Differences

This shows you the differences between two versions of the page.

--- extras:wissikon:semantik:icon [2025/07/06 07:34] – ↷ Page moved from wissikon:semantik:icon to extras:wissikon:semantik:icon Felix Hardmood Beck
+++ extras:wissikon:semantik:icon [2026/03/22 12:43] (current) – Felix Hardmood Beck
@@ Line 1: / Line 1: @@
 ===== Was ist ein Icon? =====
-Ein Icon ist ein kleines grafisches [[wissikon:semantik:symbol|Symbol]], das in digitalen Benutzeroberflächen verwendet wird, um Funktionen, Anwendungen oder Inhalte visuell zu repräsentieren. Der Begriff stammt vom griechischen //eikon// und bedeutet Bild oder Abbild. Icons dienen der schnellen Orientierung und Interaktion in digitalen Systemen wie Betriebssystemen, Apps oder Webseiten.
+Ein Icon ist ein kleines grafisches [[extras:wissikon:semantik:symbol|Symbol]], das in digitalen Benutzeroberflächen verwendet wird, um Funktionen, Anwendungen oder Inhalte visuell zu repräsentieren. Der Begriff stammt vom griechischen //eikon// und bedeutet Bild oder Abbild. Icons dienen der schnellen Orientierung und Interaktion in digitalen Systemen wie Betriebssystemen, Apps oder Webseiten.
 Typische Beispiele für Icons sind:
@@ Line 11: / Line 11: @@
 Icons zeichnen sich durch ihre kleine, einprägsame und funktionale Gestaltung aus. Sie sind so gestaltet, dass sie auch bei geringer Größe und ohne zusätzlichen Text verständlich bleiben. In grafischen Benutzeroberflächen ersetzen sie oft beschriftete Schaltflächen, um Platz zu sparen und die Bedienung zu vereinfachen.
-Verwandte Begriffe sind [[wissikon:semantik:piktogramm|Piktogramm]] und [[wissikon:semantik:signet|Signet]]. Während Piktogramme allgemein für sprachunabhängige Zeichen stehen und Signets Marken repräsentieren, beziehen sich Icons speziell auf die digitale Interaktionsumgebung. Sie sind funktional und dienen primär der Benutzerführung.
+Verwandte Begriffe sind [[extras:wissikon:semantik:piktogramm|Piktogramm]] und [[extras:wissikon:semantik:signet|Signet]]. Während Piktogramme allgemein für sprachunabhängige Zeichen stehen und Signets Marken repräsentieren, beziehen sich Icons speziell auf die digitale Interaktionsumgebung. Sie sind funktional und dienen primär der Benutzerführung.
 Icons sind ein zentrales Element des User Interface Designs und tragen zur Nutzerfreundlichkeit und Effizienz digitaler Produkte bei.
+==== Erste Hilfe für App-Icon Dummies ====
+Schritt-für-Schritt-Anleitung für die Gestaltung eines App-Icons
+  - Ausgangspunkt festlegen \\ \\ Wählen Sie für das App-Icon eine klare Grundidee. Überlegen Sie, wofür die App steht und welches Motiv, Zeichen, Objekt oder welcher Buchstabe diesen Inhalt möglichst einfach ausdrücken kann. \\ \\
+  - Inhalt reduzieren \\ \\ Vereinfachen Sie die Idee so weit, dass sie auch in sehr kleiner Darstellung noch verständlich bleibt. Ein App-Icon sollte nicht wie ein Plakat funktionieren, sondern mit wenigen, prägnanten Formen arbeiten. \\ \\
+  - Form entwickeln \\ \\ Arbeiten Sie mit einfachen geometrischen Grundformen, klaren Konturen und einer eindeutigen Silhouette. Prüfen Sie, ob das Motiv auch ohne zusätzliche Details erkennbar bleibt. \\ \\
+  - Schwarz-Weiß-Version gestalten \\ \\ Entwickeln Sie zunächst eine Version nur in Schwarz und Weiß. So wird sichtbar, ob das Icon formal stark genug ist und auch ohne Farbe funktioniert. \\ \\
+  - Komposition im quadratischen Format anlegen \\ \\ Setzen Sie das Motiv in ein quadratisches Format. Achten Sie auf Ränder, Proportionen, Gewichtung und eine ausgewogene Platzierung innerhalb der Fläche. \\ \\
+  - Varianten entwickeln \\ \\ Erstellen Sie mindestens drei unterschiedliche Varianten. Verändern Sie dabei zum Beispiel Form, Anschnitt, Proportion, Flächengewicht oder die Beziehung zwischen Figur und Hintergrund. \\ \\
+  - Lesbarkeit in klein prüfen \\ \\ Verkleinern Sie das Icon stark und prüfen Sie, ob es weiterhin klar erkennbar ist. Entfernen Sie Elemente, die zu klein, zu komplex oder unnötig sind.  \\ \\
+  - Entscheidung begründen \\ \\ Wählen Sie eine Variante aus und begründen Sie kurz, warum diese am besten funktioniert. Entscheidend sind Klarheit, Wiedererkennbarkeit und visuelle Prägnanz.  \\ \\
+  - Finale Version ausarbeiten \\ \\ Überarbeiten Sie die gewählte Variante sorgfältig. Achten Sie auf saubere Kanten, klare Kontraste und eine stimmige Gesamtform.  \\ \\
+  - Export vorbereiten \\ \\ Exportieren Sie das finale Icon als quadratische Bilddatei. Legen Sie zusätzlich eine Übersichtsseite mit den Zwischenvarianten an, damit der Gestaltungsprozess nachvollziehbar bleibt.