# data[].attributes.body
1:
- Trapezform mit viereckigem Ende (links)
-> nach Rechts breiter
- zwei Drittelkreise, nach links offen
-> rechter Drittelkreis größer als linker
- Konturlinien
- horizontal symmetrisch
- eckige Formen
- dünne, gleichmäßige Strichstärke
- weiß auf schwarz

2:
- horizontal "liegendes" Dreieck
->nach rechts breiter
- Spitze (links) des Dreiecks stark abgerundet
- Ecken sind leicht abgerundet
- breitere Strichstärke, durchgehend
- Konturlinien
- weiß auf schwarz
- ein kleiner ausgefüllter Halbkreis, ein größerer leerer     Halbkreis
- gleichmäßiger Abstand von Schnittstelle der Halbkreise zu Dreieck
- horizontal symmetrisch

# data[].attributes.body
Syntaktik:

Anfang:
- drei Linien, zwei vertikale, die rechte ist diagonal nach links

- Linienenden sind eckig

- links: dünne Strichstärke

- rechts: dickere Strichstärke

Nach Redesign:

- Linienenden sind abgerundet

- Schräges Buch -> Rechteck , mit oberer abgesenkter rechter Ecke

- links: nur Kontur des Rechtecks, innere Ecken spitz

- rechts: Rechteck ausgefüllt

- Gemeinsamkeiten:

- zwei senkrechte Linien

- Diagonale nach links

# data[].attributes.body
Semantik:

- Übereinstimmung Form und Inhalt:

- vor dem Redesign: Bücher leichter erkennbar

- Nach dem Redesign: Bücher abstrakter, ohne Schriftzug schwer erkennbar

- Prägnanz/ Komplexität:

- Vor Redesign: nur aktiv Prägnant, nicht komplex

- nach Redesign: inaktiv komplexer und durch ausgefüllte Form(aktiv) prägnanter

- Harmonie der Teilbeschaffenheit/ Kontinuität

- Vor Redesign: gleiches Element und reduziert, gleiche Strichstärke (je Icon), alle Ecken spitz

- Nach Redesign: gleiche Strichstärke (inaktiv und aktiv), gleicher Aufbau, nur ein Element verändert, negativ: eckige und runde Ecken

- Gemeinsamkeiten:

- Icon für Bibliothek

- Icon soll drei Bücher darstellen

- Veränderung zeigen Aktivität

-Sigmatik:
-Ikon und index da es die Bücher darstellt und anzeigt wo man die Bibliothek finden kann

# data[].attributes.body
Pragmatik:

- Zielsetzung erreicht, da:

- prägnanter, leserlicher durch dickere Strichstärke und Rechteck

- kontrastreicher durch dickere Strichstärke

- wirkt durch Abstrahierung moderner -> lässt die App zeitgemäß wirken

# data[].attributes.body
Syntaktik:

Änderungen sind: Dickere Strichstärke, vorherige Trapezform wird eher zu Dreieck, abgerundete Kanten, höherer Abstraktionsgrad/ Stilisiertere Darstellung, Konturlinien

# data[].attributes.body
- Kreise visualisieren Schallwellen (der Musik)
-> Schallwellen kommen aus linkem Element (Lautsprecher)
-> gleiche Ausrichtung
- linkes Element stellt stilisiert Lautsprecher dar
- hoher Stilisierungsgrad (bes. Schallwellen)
- Ikon (Lautsprecher -> Ähnlich zu manchen Lautsprechern)
- Prägnanter durch dickere Strichstärke
-> leichter erkennbar, komfortabel und inklusiv
- Komplexität durch sich umfassende Halbkreise
-> Gesetz der Nähe
-Harmonie der Teilbeschaffenheit und Kontinuität durch gleiche Strichstärke und Rundungen

# data[].attributes.body
Semantik:

Prägnanz: Durch die dickeren Linien und das reduzierte Design ist das neue Icon prägnanter.

Harmonie d. Teilbeschaffenheit: Neues Icon wirkt in sich geschlossener und schlüssiger/ weniger abgehackt, Abgerundete Kanten harmonieren mit den Linien, die den Schall darstellen sollen.

Übereinstimmung Form/Inhalt: das Motiv bleibt das Gleiche, bei dem Neueren wird der Eindruck der Moderne durch die Änderung der Strichstärke und die abgerundeten Linienenden/ecken erzielt

Ikon: Das Icon stellt ein Lautsprecher dar. Der Ikonizitätsgrad ist bei dem Redesign gesunken, da der Lautsprecher abstrakter dargestellt ist.

Symbol: Man kann das Icon auch als Symbol für Lautstärke betrachten, in diesem Fall ändert sich bei dem Redesign nicht viel.

Index: Das Icon hat einen hinweisenden Charakter, da es auf die Lautstärke der abgespielten Musik hinweist.

# data[].attributes.body
Syntaktik:
Weiß auf schwarz, Icons auf einem schwarzen Balken nebeneinander, drei Gestaltungselemente

Wenn inaktiv:

Zwei, abgerundete, vertikale Linien; dicke, immer gleichbleibende Strichstärke

Ein Quadrat (Dreidimensionalität), nur Konturlinien, rechte obere Kante abgeschrägt (schafft Perspektive), abgerundete Linienecken und -endungen

Wenn aktiv:

Zwei, abgerundete, vertikale Linien

Quadrat mit Perspektive als Füllform
rechte obere Kante abgeschrägt (schafft Perspektive)

abgerundete Linienecken und -endungen

Gleiche Strichstärke

Veränderungen: abgerundete Linienecken- und endungen, dickere Konturen, Füllformen bei Aktivität

# data[].attributes.body
Semantik:
Darstellung von Schallplatten nebeneinander; alle Alben, die gespeichert wurden

Verschiedene Darstellungen wenn aktiv/inaktiv

Zwei Balken bleiben gleich, wenn die Seite aufgerufen wird ist das Quadrat eine Füllform

Gleichgeblieben: Figur Grund Beziehung, gleiches Motiv, gleiche Darstellung von geometrischen Formen

Veränderung: klarere Bildbotschaft (Modernisierung), leichter erkennbar

Zielgruppe wird angesprochen, prägnantere Zeichen durch dickere Strichstärke und Entfernung von Schriftelementen, wirken unproportionierter, bessere Lesbarkeit

Prägnanz: Stilisierung (schneller, einfachere Erfassbarkeit), dickere Linien, hoher Auffälligkeitswert

Harmonie der Teilbeschaffenheit: funktionieren miteinander, zusammenhängend, Gesetz der Nähe macht sie zu einem

Komplexität: aus drei Balken werden zwei Balken und ein perspektivisches Quadrat, Dimension im Design, Informationsgehalt relativ gering

Übereinstimmung Form-Inhalt: passt zu Spotify's neuem Image (modernisiert, innovativ, simpel), iconorientiert, nicht mehr textorientiert, Bibliothek an Alben/Schallplatten (für Musik)

Index (Hinweis) und Ikon (Abbild, stilisiert), Schallplatten, eine schief stehende Schallplatte

# data[].attributes.body
-Strichstärke dicker geworden

-Auf beiden Seiten, des Kopfhörers, wurde an den Ohrenpolstern eine Ecke mehr abgerundet

-Die Ohrenpolster haben sich von außerhalb des Kreises, nach innerhalb des Kreises bewegt
-Outlines bzw. Kontur Gestaltung ist geblieben
-Vertikal Achsen-symmetrisch
-Weiße Outlines auf schwarzem Hintergrund ist geblieben

-Kreis, nach unten geöffnet. Die nach innen gedrehten Ohrenpolster die jeweils diagonal zum Bogen sind, setzen sich aus einem Oval, dass an der oberen Seite schräg gestumpft ist zusammen

# data[].attributes.body
-modernisiert um dem heutigen Zeitgeist treu zu bleiben

-Prägnant durch dickere Strichstärke

- Ikon (Kopfhörer) weissen daraufhin, das der Kopfhörer angeschlossen sind somit wirkt dieser als Index

-stilisiert
-schwarz-weiß-Konstrast
-kontinuität ist durch gleiche Form und Farbe gegeben

# data[].attributes.body
Zielsetzung wurde erreicht:
-modern
-Verständnis und Wiedererkennung (z.B. im Alltag)
-hilft dem Betrachter einfach und verständlich das Piktogramm und die Funktion zu verstehen
-Zielsetzung:
-die Zielgruppe: Nutzer von Spotify
-Absicht des Senders: den Betrachter auf den Anschluss von Kopfhörern aufmerksam zu machen
-Suggestiv, weil...
-Indikativ, weil...

# data[].attributes.body
- verständlicher Umgesetzt
- stehen für eine inaktive und aktive Benutzung ; die neuere Lupe mit kreis für aktiv sowie bei alten die dickere Strichstärke und die inaktive Nutzung hat keinen kreis bei der neuen und bei der alten eine dünnere Strichstärke

# data[].attributes.body
-ersten beiden fast identisch (kreise mit 45 Grad Rechtecken die nach unten an der rechten Seite sich befinden , unterschiedliche Strichstärke, scharfe Ecken)
-die anderen sind unterschiedlicher in dem Sinne das die Strichstärke gleich ist, jedoch ist in der anderen Lupe ein kleiner Kreis in Füllform (weiss) vorhanden.

# data[].attributes.body
-zeichen wurde für die Nutzer von Spotify entwickelt
- es wurde modernisert und vereinfacht

# data[].attributes.body
Pragmatik:
Gleichgeblieben: Orientierungszeichen, hinweisend, gute Lesbarkeit/Erkennbarkeit

Veränderung: Wirkt orientierend und hinweisend (indikativ), beeinflusst das Handeln des Betrachters, schnellere, bessere Orientierung; wirkt bei Gefühlen (suggestiv) auf der Metaebene und beeinflusst das Nutzererlebnis

# data[].attributes.body
-schwarz/weiss Kontrast
-das Zeichen wurde modernisiert
-durch Änderung der strichstärke wurde das Zeichen prägnanter
-es ist schnell zu erkennen, wofür das Zeichen steht

# data[].attributes.body
-das zeichen ist weiß und steht auf schwarzem Hintergrund
-abgebildet ist ein Kopfhörer, welcher stilisiert und symmetrisch zur vertikalen ist, als unten offener Kreis mit zwei Ellipsen Variationen, welche die ohrpolster darstellen sollen
-die strichstärke wurde erhöht
-die ecken der ohrpolster wurden abgerundet
-die Polster die auf den Ohren liegen wurden von außen nach innen verlegt

# data[].attributes.body
Imperativ:
-
Suggestiv:
- Komfortable Ansicht

# data[].attributes.body
- indikative Wirkung (informativ)
-> zeigt User, wo man Lautstärke einstellen kann
-> durch Ähnlichkeit zum Lautsprecher wird auf Lautstärke geschlossen

- suggestive Wirkung
-> angepasster zur Typografie und App-Layout
-> generell stimmiger, angenehmer für User
-moderner

# data[].attributes.body
Pragmatik

-Icon dient dazu, dem Nutzer zu vermitteln, dass durch tippen die Lautstärke angepasst werden kann.
-Icon hat indikative Wirkung, da es bloß als Informationsträger dient.

# data[].attributes.body
- Prägnanz/ Komplexität
Schwarz/ Weiß Kontrast
Schnell erfassbar
einprägsam

- Harmonie der Teilbeschaffenheit
Gleiche Strichstärke
weichere Rundung