tragbares designsprech
Post on 20-Jun-2015
111 Views
Preview:
DESCRIPTION
TRANSCRIPT
„Tragbares“ Designsprech
Benjamin Reimold
by Michael Rose @mmistakes
iOS & Android
@elektrojunge
tausendsassaesk.de
benny.reimold@me.com
Benjamin Reimold
Codenauts
codenauts.de
iOS & Android
Rails
HockeyAppPS:
Tragbares Designsprech Benjamin Reimold
Mobile Maultaschen
Ping me!
Tragbares Designsprech Benjamin Reimold
tl;dr
Intro
Design (Begriff)
Design (Vorgehensweisen)
Design (Hintergrundwissen)
Design (Praxis)
Tragbares Designsprech Benjamin Reimold
Tragbares Designsprech Benjamin Reimold
Apps sind lauwarmer Kaffee!
Tragbares Designsprech Benjamin Reimold
Apps sind lauwarmer Kaffee!
Appland - das Land der 1000 Kontexte
Tragbares Designsprech Benjamin Reimold
Apps sind lauwarmer Kaffee!
Appland - das Land der 1000 Kontexte
Apps sind eine ERNSTE Sache
Tragbares Designsprech Benjamin Reimold
Wir brauchen Designsprech!
Tragbares Designsprech Benjamin Reimold
Designers to the rescue!
Tragbares Designsprech Benjamin Reimold
Designers to the rescue!
„Spezifikation“ der App
Tragbares Designsprech Benjamin Reimold
Designers to the rescue!
„Spezifikation“ der App
Designerin beauftragen
Tragbares Designsprech Benjamin Reimold
Designers to the rescue!
„Spezifikation“ der App
Designerin beauftragen
„tragbares“ Designsprech
Tragbares Designsprech Benjamin Reimold
Designers to the rescue!
„Spezifikation“ der App
Designerin beauftragen
„tragbares“ Designsprech
alle sind froh
Tragbares Designsprech Benjamin Reimold
Designers to the rescue!
„Spezifikation“ der App
Designerin beauftragen
„tragbares“ Designsprech
alle sind froh
€€€€€€€€
Tragbares Designsprech Benjamin Reimold
Nö!
Tragbares Designsprech Benjamin Reimold
Augenkrebs! NSLog(@“You suck!“);
Tragbares Designsprech Benjamin Reimold
Die Praxis™ zeigt:
Tragbares Designsprech Benjamin Reimold
Die Praxis™ zeigt:
Jede Softwareentwicklerin ist auch Designerin.
Tragbares Designsprech Benjamin Reimold
Kreativität
Nutzungskontext
Hardware
Ökosysteme
Trends
Subjektivität
Wahrnehmung
Psychologie
Schnellebigkeit
Was ist „Design“ überhaupt?
Psychologie
Werkzeuge / Tools
Ich kann doch nicht „zeichnen“
Erfahrung
Typographie
User Experience
Buzzword-Bingo
...
UX
UI
Farbenlehre
Tragbares Designsprech Benjamin Reimold
Know your enemy.
Tragbares Designsprech Benjamin Reimold
Know your enemy.
Design (Begriff)
Tragbares Designsprech Benjamin Reimold
Know your enemy.
Design (Begriff)
Design (Vorgehensweisen)
Tragbares Designsprech Benjamin Reimold
Know your enemy.
Design (Begriff)
Design (Vorgehensweisen)
Design (Hintergrundwissen)
Tragbares Designsprech Benjamin Reimold
Know your enemy.
Design (Begriff)
Design (Vorgehensweisen)
Design (Hintergrundwissen)
Design (Praxis)
Tragbares Designsprech Benjamin Reimold
User Experience Design
Interface Design
Interaction Design
Sound Design
Human FactorsHuman-
ComputerInteraction
Information Architecture
Design (Begriff)
Tragbares Designsprech Benjamin Reimold
Namen sind nur Schall und Rauch.
Tragbares Designsprech Benjamin Reimold
Namen sind nur Schall und Rauch.
Apps sind Werkzeuge.
Tragbares Designsprech Benjamin Reimold
Namen sind nur Schall und Rauch.
Apps sind Werkzeuge.
Ein Werkzeug erledigt seinen Job.
Tragbares Designsprech Benjamin Reimold
Namen sind nur Schall und Rauch.
Apps sind Werkzeuge.
Ein Werkzeug erledigt seinen Job.
Ein Werkzeug lässt sich gut in die Hand nehmen.
Tragbares Designsprech Benjamin Reimold
Namen sind nur Schall und Rauch.
Apps sind Werkzeuge.
Ein Werkzeug erledigt seinen Job.
Ein Werkzeug lässt sich gut in die Hand nehmen.
Keine Nutzerin juckt, wie es dazu kam.
Tragbares Designsprech Benjamin Reimold
Design (Vorgehensweisen)
Tragbares Designsprech Benjamin Reimold
Tragbares Designsprech Benjamin Reimold
Tragbares Designsprech Benjamin Reimold
Tragbares Designsprech Benjamin Reimold
Tragbares Designsprech Benjamin Reimold
Tragbares Designsprech Benjamin Reimold
Tragbares Designsprech Benjamin Reimold
Tragbares Designsprech Benjamin Reimold
Tragbares Designsprech Benjamin Reimold
Tragbares Designsprech Benjamin Reimold
Tragbares Designsprech Benjamin Reimold
Tragbares Designsprech Benjamin Reimold
Tragbares Designsprech Benjamin Reimold
Details & Überarbeitung
Ideenfindung & Lösungen
Analyse & Strukturierung
Erforschung & Beobachtung
Personas
Tragbares Designsprech Benjamin Reimold
Personas
Tragbares Designsprech Benjamin Reimold
Tragbares Designsprech Benjamin Reimold
Details & Überarbeitung
Ideenfindung & Lösungen
Analyse & Strukturierung
Erforschung & Beobachtung
Personas
Tragbares Designsprech Benjamin Reimold
Details & Überarbeitung
Ideenfindung & Lösungen
Analyse & Strukturierung
Erforschung & Beobachtung
Personas
Mentales Modell
Tragbares Designsprech Benjamin Reimold
Das mentale Modell
Tragbares Designsprech Benjamin Reimold
Tragbares Designsprech Benjamin Reimold
Tragbares Designsprech Benjamin Reimold
Tragbares Designsprech Benjamin Reimold
Tragbares Designsprech Benjamin Reimold
Design (Hintergrundwissen)
Tragbares Designsprech Benjamin Reimold
App-Design ist KALTER Kaffee.
Tragbares Designsprech Benjamin Reimold
seit Mitte der 1970er
Gutes Design ist innovativ.
Gutes Design macht ein Produkt brauchbar.
Gutes Design ist ästethisch.
Gutes Design ist verständlich.
Gutes Design ist unaufdringlich.
Gutes Design ist ehrlich.
Gutes Design ist langlebig.
Gutes Design ist konsequent bis in‘s letzte Detail.
Gutes Design ist umweltfreundlich.
Gutes Design ist so wenig Design wie möglich.
Tragbares Designsprech Benjamin Reimold
seit Mitte der 1970er
Gutes Design ist innovativ.
Gutes Design macht ein Produkt brauchbar.
Gutes Design ist ästethisch.
Gutes Design ist verständlich.
Gutes Design ist unaufdringlich.
Gutes Design ist ehrlich.
Gutes Design ist langlebig.
Gutes Design ist konsequent bis in‘s letzte Detail.
Gutes Design ist umweltfreundlich.
Gutes Design ist so wenig Design wie möglich.
Dieter
Rams:
10 Th
esen für
gutes D
esig
n.
Tragbares Designsprech Benjamin Reimold
seit ca. 1990
Status
Metapher/Mentales Modell
Freiheit/Kontrolle
Konsistenz/Standards
Fehlervermeidung
Erkennen statt Erinnern
Flexibilität/Effizienz bei der Nutzung
Ästhetik/Minimalismus
Fehlererkennung & Fehlerbehebung
Dokumentation
Jacob
Nielsen:
10 Usab
ility He
uristi
cs
Tragbares Designsprech Benjamin Reimold
Wieso ist App-Design dann schwierig non-trivial einfach hart Hexenwerk Teufelszeug
komplex nicht immer einfach?
Tragbares Designsprech Benjamin Reimold
Tragbares Designsprech Benjamin Reimold
„Wir haben doch nur Informatik studiert!“
Tragbares Designsprech Benjamin Reimold
„Wir haben doch nur Informatik studiert!“
NUI
Tragbares Designsprech Benjamin Reimold
„Wir haben doch nur Informatik studiert!“
NUI
Appland, das Land der 1000 Kontexte
Tragbares Designsprech Benjamin Reimold
„Wir haben doch nur Informatik studiert!“
NUI
Appland, das Land der 1000 Kontexte
Menschen haben diese...Finger.
Tragbares Designsprech Benjamin Reimold
„Wir haben doch nur Informatik studiert!“
NUI
Appland, das Land der 1000 Kontexte
Menschen haben diese...Finger.
Die Wortwolke von vorhin, ihr erinnert euch...
Tragbares Designsprech Benjamin Reimold
„Wir haben doch nur Informatik studiert!“
NUI
Appland, das Land der 1000 Kontexte
Menschen haben diese...Finger.
Die Wortwolke von vorhin, ihr erinnert euch...
1000 Wege...
Tragbares Designsprech Benjamin Reimold
Was hilft?
Tragbares Designsprech Benjamin Reimold
10 Usability Heuristics
Status
Metapher/Mentales Modell
Freiheit/Kontrolle
Konsistenz/Standards
Fehlervermeidung
Erkennen statt Erinnern
Flexibilität/Effizienz bei der Nutzung
Ästhetik/Minimalismus
Fehlererkennung & Fehlerbehebung
Dokumentation
Jacob
Nielsen:
10 Usab
ility He
uristi
cs
Tragbares Designsprech Benjamin Reimold
MOAR basic knowledge about „design“!
Tragbares Designsprech Benjamin Reimold
Skeuomorphismen™
Tragbares Designsprech Benjamin Reimold
Affordances
Tragbares Designsprech Benjamin Reimold
Feedback
Tragbares Designsprech Benjamin Reimold
Feedforward
Tragbares Designsprech Benjamin Reimold
Direct Manipulation Pattern
Tragbares Designsprech Benjamin Reimold
Fitts‘s Law
Tragbares Designsprech Benjamin Reimold
Tragbares Designsprech Benjamin Reimold
Tragbares Designsprech Benjamin Reimold
Geschwindigkeit
Tragbares Designsprech Benjamin Reimold
„Persönlichkeit“
Tragbares Designsprech Benjamin Reimold
Und noch soooooo vieles mehr...
Tragbares Designsprech Benjamin Reimold
Design (Praxis)
Tragbares Designsprech Benjamin Reimold
Guidelines™
1996 (!) Zen of Palm
Tragbares Designsprech Benjamin Reimold
iOS != Android != Windows Phone != ...
Tragbares Designsprech Benjamin Reimold
iOS != Android != Windows Phone != ...„So du gestaltest für ein dir
nicht eigen gemachtesBetriebssystem, nutze es vorab
für einige Zeit.“Captain Obvious, 2013
Tragbares Designsprech Benjamin Reimold
cmd + c / ctrl + c
Tragbares Designsprech Benjamin Reimold
cmd + c / ctrl + c
Was machen „die anderen“?
Tragbares Designsprech Benjamin Reimold
cmd + c / ctrl + c
Was machen „die anderen“?
Was funktioniert (nicht)?
Tragbares Designsprech Benjamin Reimold
cmd + c / ctrl + c
Was machen „die anderen“?
Was funktioniert (nicht)?
Was bringt mir das?
Tragbares Designsprech Benjamin Reimold
cmd + c / ctrl + c
Was machen „die anderen“?
Was funktioniert (nicht)?
Was bringt mir das?
cmd + c / ctrl + c mit Stil.
Tragbares Designsprech Benjamin Reimold
UI-Elemente
Tragbares Designsprech Benjamin Reimold
Features
Tragbares Designsprech Benjamin Reimold
Beherrsche dein Werkzeug!
Tragbares Designsprech Benjamin Reimold
Beherrsche dein Werkzeug!Stift + Papier
Tragbares Designsprech Benjamin Reimold
Beherrsche dein Werkzeug!Stift + Papier
Photoshop (Pixelmator/Sketch/...)
Tragbares Designsprech Benjamin Reimold
Beherrsche dein Werkzeug!Stift + Papier
Photoshop (Pixelmator/Sketch/...)
UI-Mockup-Tools (Briefsapp, Sketch ...)
Tragbares Designsprech Benjamin Reimold
Beherrsche dein Werkzeug!Stift + Papier
Photoshop (Pixelmator/Sketch/...)
UI-Mockup-Tools (Briefsapp, Sketch ...)
„echter“ Prototyp
Tragbares Designsprech Benjamin Reimold
Beherrsche dein Werkzeug!Stift + Papier
Photoshop (Pixelmator/Sketch/...)
UI-Mockup-Tools (Briefsapp, Sketch ...)
„echter“ Prototyp
...
Tragbares Designsprech Benjamin Reimold
______________ *
* Schlussstrich™
Tragbares Designsprech Benjamin Reimold
______________ *
Design (Vorgehensweise)
* Schlussstrich™
Tragbares Designsprech Benjamin Reimold
______________ *
Design (Vorgehensweise)+
* Schlussstrich™
Tragbares Designsprech Benjamin Reimold
______________ *
Design (Vorgehensweise)+
Design (Hintergrundwissen)
* Schlussstrich™
Tragbares Designsprech Benjamin Reimold
______________ *
Design (Vorgehensweise)+
Design (Hintergrundwissen)+
* Schlussstrich™
Tragbares Designsprech Benjamin Reimold
______________ *
Design (Vorgehensweise)+
Design (Hintergrundwissen)+
Design (Praxis)
* Schlussstrich™
Tragbares Designsprech Benjamin Reimold
______________ *
Design (Vorgehensweise)+
Design (Hintergrundwissen)+
Design (Praxis)=
* Schlussstrich™
Tragbares Designsprech Benjamin Reimold
______________ *
Design (Vorgehensweise)+
Design (Hintergrundwissen)+
Design (Praxis)=
Tragbares Designsprech
* Schlussstrich™
Tragbares Designsprech Benjamin Reimold
Fin. *
* Merci.
top related