Icon-Familie
Jahr
2022 (2. Semester)
Programme
Illustrator, Photoshop, Miro
Kategorie
Icon Design, Visual Design
Projektart
Gruppenarbeit
(5 Personen)
// Aufgabenstellung
Die Aufgabe im Modul Interfacedesign bestand darin eine konsistente Icon-Familie für eine digitale Kochanwendung zu gestalten.
Ziel war es, 18 unterschiedliche Funktionen visuell eindeutig, funktional verständlich und gestalterisch einheitlich darzustellen. Die Icons sollten dabei in verschiedenen Größen funktionieren.
// Schritt 1
Analyse & Funktionsverständnis
Zu Beginn analysierten wir die vorgegebenen 18 Funktionen der Kochanwendung und klärten deren Bedeutung sowie den Nutzungskontext. Dadurch wurde sichergestellt, dass jedes Icon die jeweilige Funktion klar und intuitiv kommuniziert.
Die 18 Funktionen waren:
Familienkochbuch (Auswahlmenü aufrufen)
Rezeptsuche
Rezept speichern
Rezepte für besondere Anlässe
Gerichte nach Region
Maße und Gewichte umrechnen (Umrechnungstabelle)
Rezept erstellen (anlegen)
Schnelle und einfache Gerichte
Schritt-für-Schritt Anleitung (erstellen / aufrufen)
Beschreibung per Spracheingabe aufnehmen
Wochenplan erstellen
Essensreste verwenden
Zutaten ausschließen
Nährwertangabe
Kochlexikon
Zutatenliste
Einkaufszettel erstellen
Filtern nach Zubereitungszeit
// Schritt 2
Aufteilung & Entwurfsphase
Anschließend schätzten wir die Komplexität der einzelnen Funktionen ein und teilten diese gleichmäßig innerhalb der Gruppe auf. Anschließend setzte sich jedes Teammitglied intensiv mit den eigenen Funktionen auseinander und entwickelte erste Scribbles.
Ich übernahm die Gestaltung der Icons für Rezept erstellen, Schritt-für-Schritt-Anleitung, Kochlexikon und Einkaufszettel erstellen.
// Schritt 3
Aufteilung & Entwurfsphase
Als Gruppe entwickelten wir ein gemeinsames Gestaltungskonzept für die Icon-Familie. Dabei definierten wir unter anderem Formensprache, Strichstärke, Rundungen, um ein einheitliches Erscheinungsbild zu gewährleisten.
// Schritt 4
Gestalterische Umsetzung
Die finalen Icons wurden in Adobe Illustrator ausgearbeitet und für unterschiedliche Größen optimiert (120×120 px, 58×58 px, 48×48 px und 16×16 px). Besonderer Fokus lag darauf, dass die Icons auch in kleinen Größen gut erkennbar bleiben.
