Mobile Patterns - Wie Apps und Co. digitale Interfaces revolutionieren
-
Upload
markus-greve -
Category
Design
-
view
34 -
download
0
Transcript of Mobile Patterns - Wie Apps und Co. digitale Interfaces revolutionieren
Kochan & PartnerBrandDesignDevelopment
Mobile Patterns Wie Apps und Co. digitale Interfaces revolutionieren
Markus Grevezur Webwoche 2015
Mit-Teilen: Wo Dich das Rascheln von Laub
aufspürt, der Flügelschlag einer Graugans. Wo
Ideen lässig landen und Musen sich zum Kuss
aufreihen. VERSUCH ÜBER DAS GEMEINSAME:
www.kochan.de/experiment
Kochan & Partner Brand Design Development2
Slides http://de.slideshare.net/markusgreve/
Markus Greve KOCHAN & PARTNER BRAND DESIGN DEVELOPMENT
T +49 89 17860–150 E [email protected] @mrmontezuma
Hi, I’m Markus
Kochan & Partner Brand Design Development
Mobile Patterns Wie Apps und Co. digitale Interfaces revolutionieren
Drei Thesen Ich freue mich auf die
anschließende Diskussion
3
Kochan & Partner Brand Design Development
Vitaly FriedmannChefredakteur Smashing Magazine
Real-Life Responsive Web Design
Responsive Design ist in. (…) Welche Design Patterns nutzt man und wie
geht man mit komplexen Tabellen, Karten,
Formularen und interaktiven Elementen um?
10
TYPO Berlin 2015
Kochan & Partner Brand Design Development
Verständnis von Icons abhängig von der Zielgruppe
Je nach Kontext optimierbar durch Zusatz »Menü« oder ähnlich
Die Position fixiert am oberen Bildschirmrand ist in den meisten Anwendungsfällen nicht nutzbar!
➜ Positionierung am
Screen überdenken
19
Zusammenfassung
Kochan & Partner Brand Design Development
“Skeuomorphismus (aus dem Altgriechischen σκεῦος Behälter, Werkzeug und μορφή Gestalt) ist eine Stilrichtung
hauptsächlich im Design, bei der Objekte in ihrer Gestaltung ein anderes Material oder eine Form eines älteren, vertrauten
Gegenstandes nachahmen, ohne dass diese durch ihre Funktion begründet ist.
– Wikipedia
23
Design Trend: Vermeidung von Skeuomorphismus
Kochan & Partner Brand Design Development26
Microsoft Windows
Modern UI (ehemals »Metro«)
Apple iOS (später auch Mac OS X)
Flat Design
Google Android
Material Design
Kochan & Partner Brand Design Development27
Microsoft Windows
Modern UI (ehemals »Metro«)
Apple iOS (später auch Mac OS X)
Flat Design
Google Android
Material Design?
Kochan & Partner Brand Design Development
Höhe
Patterns und Höhe
30
Interface Guidelines
Floating Action Button »FAB«
Resting height: 6dp, pressed state 12dp
Kochan & Partner Brand Design Development
Klare, aufgeräumte Gestaltung
Glatte Oberflächen
Aber: Interaktion im Interface durch klassische Metaphern wie »Höhe«
➜ Für die Konzepte des »Material Design«
reichen zwei Dimensionen nicht aus.
34
Zusammenfassung
Kochan & Partner Brand Design Development35
THREE
________
Interfaces Get Simpler
– And Therefor More Complex!
________
In-App Lernvideos
Kochan & Partner Brand Design Development
Einführung neuer Bedienkonzepte
– Wake-on-Turn
– Mute-on-Cover
– Force Touch
Persönliche Einlernphase
Massenverbreitung
➜ Wiederverwendung bereits »erlernter« Patterns wichtig wie nie!
49
Zusammenfassung