GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN...
Transcript of GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN...
![Page 1: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/1.jpg)
GESTALTUNGVONMATERIALITÄT
Von /ElviraStein @elvirastein
![Page 2: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/2.jpg)
INTERAKTION
![Page 3: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/3.jpg)
MaterialitätäußertsichinderInteraktion
![Page 4: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/4.jpg)
ANALOG:INSICHTBAREN,FÜHLBAREN
EINDRÜCKENBeispielBuch:dasUmblätternisteinmanuellerAkt,das
ÜberwindeneinesfeinenWiderstands
![Page 5: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/5.jpg)
DIGITAL:INSUBTILERVERÄNDERUNGWiekannsichdieVeränderungausdrücken?
![Page 6: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/6.jpg)
ANIMATIONBewegung:eineEingabelöstBewegungausTempo:etwaskannschnelleroderlangsamerwerden
![Page 7: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/7.jpg)
Via
Youcansayalotwithaheart.IntroducinganewwaytoshowhowyoufeelonTwitter:
—Twitter(@Twitter)
https://t.co/WKBEmORXNWpic.twitter.com/G4ZGe0rDTP
November3,2015Twitter’sHeartAnimationinFullCSS
![Page 8: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/8.jpg)
TONEBENEBenutzereingabenlösenSoundsaus
![Page 9: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/9.jpg)
Playbackisn'tsupportedonthisdevice.
0:00/0:03
![Page 10: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/10.jpg)
BILDEBENEOpazität:dieTransparenzverändertsichSchärfe:BilderwerdenscharfoderunscharfVeränderungderHelligkeit
![Page 11: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/11.jpg)
![Page 12: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/12.jpg)
![Page 13: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/13.jpg)
DonaldNormanvia
«Beautyandbrains,pleasureandusability–theyshouldgohandinhand»
ustwo.com
![Page 14: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/14.jpg)
MICROINTERACTIONSMini-FunktionenerfüllengenaueineAufgabe
![Page 15: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/15.jpg)
MicrointeractionssindderSchlüsselzuguterUserExperience.
![Page 16: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/16.jpg)
![Page 17: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/17.jpg)
INTUITIVUNDERFREULICH
![Page 18: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/18.jpg)
Smart Design
CL ICK FOR SOUND
Smart Design
CL ICK FOR SOUND
ViaMicrointeractions–DesigningwithDetails
![Page 19: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/19.jpg)
ChuckLonganeckerin
«Bybeingintentionalaboutuserexperienceinthosesmallmoments,thataretypicallyneglected,youcanshowcasethepersonalityofyourapp,aswellas
buildingloyaltyamongusers.»GiveyourWebsiteSoulwithEmotionallyIntelligentInteractions
![Page 20: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/20.jpg)
«IT’SABOUTCARINGMORETHANOTHERSDO.»
![Page 21: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/21.jpg)
MÖGLICHKEITENDERGESTALTUNGIM
DRUCK
![Page 22: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/22.jpg)
WiekönnenwirbesondereProdukteschaffen?
DETAILS
![Page 23: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/23.jpg)
EmotionundErfahrungmitdemObjektspieleneinewichtigeRollefürdenBenutzer.
![Page 24: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/24.jpg)
![Page 25: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/25.jpg)
LiegtesgutinderHand?
Istesschwer?Leicht?
WelcheAssoziationenwecktes?
![Page 26: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/26.jpg)
KONTEXTWerwirdesverwenden,inwelchemZusammenhang?
![Page 27: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/27.jpg)
CarolineHummelsonDesignandEmotionvia
«Bydesigningcontextsforexperienceinsteadofsimplyproducts,thefocusshiftsfromtheresultofinteraction[…]towardstheinvolvementduringinteraction[…].Thismeansthatthedesigner’semphasis
shouldnotmerelylieoncreatingabeautiful,pleasingproductinappearance,
butexpandtocreatingabeautiful,engaginginteractionwithaproduct.»
InternationalJournalofDesign
![Page 28: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/28.jpg)
AUFLAGE
![Page 29: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/29.jpg)
PAPIER
![Page 30: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/30.jpg)
gestrichen–ungestrichenglänzend–mattFarbeGrammatur:Widerstand,Opazität,VolumenHaptik:rauh–glatt–strukturiert
![Page 31: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/31.jpg)
DRUCKVERFAHREN
![Page 32: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/32.jpg)
DigitaldruckOffsetdruckSiebdruckBuchdruck/LetterpressLinoldruckHandschrift
![Page 33: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/33.jpg)
FARBEN
![Page 34: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/34.jpg)
1c:Bitmap,Graustufen4c:Vierfarbdruck(Standard)Sonderfarben
![Page 35: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/35.jpg)
VEREDELUNGEN
![Page 36: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/36.jpg)
Lackierung(matt/glänzend)PrägungHeißfolienprägungLaminierung(matt/glänzend)Stanzungen,Falzungen,Perforation,…
![Page 37: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/37.jpg)
BINDUNG
![Page 38: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/38.jpg)
KlebebindungFadenheftungKlammerheftungVorsatzpapiereSoftcover–HardcoverFlappen,…
![Page 39: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/39.jpg)
MATERIALITÄTIMDESIGN
![Page 40: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/40.jpg)
![Page 41: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/41.jpg)
![Page 42: GESTALTUNG VON MATERIALITÄT - Elvira Stein · ANALOG: IN SICHTBAREN, FÜHLBAREN EINDRÜCKEN Beispiel Buch: das Umblättern ist ein manueller Akt, das Überwinden eines feinen Widerstands](https://reader030.fdocument.pub/reader030/viewer/2022040417/5d5e1f7b88c993bc2b8bc28d/html5/thumbnails/42.jpg)
DANKE!♥