Was ist die empfohlene Methode zum Erstellen dieser Symbole?

Um die Grundlagen des Schnittstellendesigns zu erlernen, versuche ich, einige bekanntere App-Schnittstellen zu replizieren. Das „flachere“ Layout vieler iOS7-Anwendungen macht es relativ einfach. Der mit Abstand schwierigste Teil waren jedoch die Ikonen.

Durch die Dekonstruktion anderer online verfügbarer PSDs konnte ich die Symbole in Photoshop reproduzieren. Meistens scheinen sie die Formwerkzeuge (abgerundetes Rechteck, Linienwerkzeug usw.) zu verwenden, um die Form nachzuahmen, und sie dann mit Ebene> Formen kombinieren zusammenzuführen.

Das funktioniert gut für die Nachahmung, aber ich vermute, dass es nicht wirklich für die Kreation geeignet ist. Das Problem bei dieser Methode ist, dass es schwierig ist, die Symbole pixelgenau hinzubekommen. Auch wenn die Symbolform komplex ist, erfordert es eine dumme Anzahl von Formen, um den Gesamteffekt zu erzeugen.

Ich brauche nicht unbedingt eine Schritt-für-Schritt-Anleitung oder einen Link zu Tutorials. Nur ein Hinweis darauf, welche Tools / Programme für diesen Job am besten geeignet sind. Was ist der Inhalt des Workflows?

Vielen, vielen Dank im Voraus.

Geben Sie hier die Bildbeschreibung ein

Geben Sie hier die Bildbeschreibung ein

Adobe Illustrator.

Antworten (1)

Scotts Kommentar etwas erweitern ... Hier ist der Grund, warum Vektordesignanwendungen wie Adobe Illustrator (auch Corel Draw, Inkscape) viel besser für das Symbol- / Piktogrammdesign geeignet sind als Raster- / Pixeldesignanwendungen wie Photoshop:

  • Einfache Symbole wie diese basieren in der Regel auf einfachen geometrischen Formen, Linien und Kurven :

    • Sie profitieren nicht von den wesentlichen Vorteilen des Rasterdesigns, das eher auf das Arbeiten mit Fotos und komplexen Effekten mit vielen Tönen und Schattierungen ausgerichtet ist (z. B. Pinsel im Malstil).
    • Sie profitieren von den vielen Werkzeugen in Vektordesignanwendungen zum Arbeiten mit Pfaden und Formen – z. B. in Illustrator, dem Ausrichtungsfenster und dem Pfadfinderfenster, dem Ein- und Ausschalten intelligenter Hilfslinien und dem Stiftwerkzeug . Diese sind genau für diese Art der sehr präzisen Formgebung ausgelegt. Etwas mehr dazu .

  • Symbole werden oft in unterschiedlichen Größen benötigt:

    • Vektorbasierte Designs sind auflösungsunabhängig, sodass das Hoch- und Herunterskalieren von Designs kein Problem darstellt.
    • Manchmal möchten Sie Varianten mit mehr oder weniger Details. Das Hinzufügen und Entfernen von Unterelementen ist in Vektordesignanwendungen viel einfacher, wenn es sich um separate Pfade oder Formen handelt.
    • Siehe auch: Bester Workflow für das Icon-Design: Fang groß an oder fang klein an?

  • Sie möchten fast immer eine eingeschränkte, konsistente Farbpalette :

    • Vektordesignanwendungen sind auf die Arbeit mit schmalen Farbfeldpaletten ausgelegt. Raster-Design-Anwendungen sind dafür nicht so gut geeignet: Sie eignen sich besser für Fotos oder digitales Malen, wo jedes Pixel normalerweise einen etwas anderen Ton hat. Sie können es tun, aber Sie würden gegen den Strom schwimmen.
    • Wenn Sie das flache Design mit subtilen Farbverläufen ausführen, können Sie (im Illustrator keine Alternativen kennen) Farbverläufe und einige andere Effekte als Farbfelder speichern, um sie wirklich einfach und präzise wiederzuverwenden, was für die Konsistenz praktisch ist über ein Icon-Set.
Was ist die empfohlene Methode zum Erstellen dieser Symbole?
AntwortenHierDatenschutz-Bestimmungen1y, 0v