Benjamin Reimold | Codenauts
$foo-design basics for (iOS-)developers
Mittwoch, 5. September 12
This presentation is licenced underCC BY-NC-SA 3.0
visit www.creativecommons.orgfor more information
Mittwoch, 5. September 12
Benjamin Reimold@elektrojunge
tausendsassaesk.de
Mittwoch, 5. September 12
“Challenge accepted!“
Mittwoch, 5. September 12
You make my eyes water!
NSLog(@“You suck!“)
Kommunikation
Kommunikation
Mittwoch, 5. September 12
Mittwoch, 5. September 12
Design-Grundlagen
Mittwoch, 5. September 12
$foo-Design
Mittwoch, 5. September 12
$foo-Design
User Experience Design
Interface Design
Interaction Design
Sound Design
Human FactorsHuman-
ComputerInteraction
Information Architecture
Mittwoch, 5. September 12
Interaction Design
Mittwoch, 5. September 12
Interaction Design
Mittwoch, 5. September 12
Interaction Design
Mittwoch, 5. September 12
Interaction Design
Mittwoch, 5. September 12
Interaction Design
Mittwoch, 5. September 12
Die Idee
Mittwoch, 5. September 12
Die Idee
App
Mittwoch, 5. September 12
Die Idee
M-PaymentApp
Mittwoch, 5. September 12
Die Idee
M-Payment EssenApp
Mittwoch, 5. September 12
Die Idee
M-Payment EssenApp Nerd
Mittwoch, 5. September 12
Die Idee
M-Payment EssenApp Nerd
Mittwoch, 5. September 12
Interaction Design
Mittwoch, 5. September 12
Interaction Design
Mittwoch, 5. September 12
Interaction Design
Mittwoch, 5. September 12
Interaction Design
Mittwoch, 5. September 12
Interaction Design
Mittwoch, 5. September 12
Vorgehensweise
Mittwoch, 5. September 12
Erforschung & Beobachtungen
# Beobachten# Interviews# Aktivitäten
Mittwoch, 5. September 12
Analysierung & Strukturierung
# Visualisierung# Diagramme / Listen# Konzeptionelles Modell# Personas
Mittwoch, 5. September 12
Mittwoch, 5. September 12
Mittwoch, 5. September 12
Mittwoch, 5. September 12
Ideenfindung & Lösung
# Konzepte# Brainstorming-Techniken# Design-Prinzipien
Mittwoch, 5. September 12
Details & Überarbeitung
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
Details & Überarbeitung
Ideenfindung & Lösung
# Konzepte# Brainstorming-Techniken# Design-Prinzipien
Analysierung & Strukturierung
Forschen & Beobachtungen
# Beobachten# Interviews# Aktivitäten
# Visualisierung# Diagramme / Listen# Konzeptionelles Modell# Personas
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
„Und was is‘ mit Tee Entwicklung?“
Mittwoch, 5. September 12
Details & Überarbeitung
Ideenfindung & Lösung
# Konzepte# Brainstorming-Techniken# Design-Prinzipien
Analysierung & Strukturierung
Forschen & Beobachtungen
# Beobachten# Interviews# Aktivitäten
# Visualisierung# Diagramme / Listen# Konzeptionelles Modell# Personas
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
Ich bin nur das Erinnerungs-Lama
Mittwoch, 5. September 12
Details & Überarbeitung
Ideenfindung & Lösung
# Konzepte# Brainstorming-Techniken# Design-Prinzipien
Analysierung & Strukturierung
Forschen & Beobachtungen
# Mentales Modell# $foo-Design Grundlagen
# Beobachten# Interviews# Aktivitäten
# Visualisierung# Diagramme / Listen# Konzeptionelles Modell# Personas
Mittwoch, 5. September 12
Grundprinzipien
Mittwoch, 5. September 12
Grundprinzipien
Status
Mittwoch, 5. September 12
Grundprinzipien
Status
Metapher
Mittwoch, 5. September 12
Grundprinzipien
Status
Metapher
Freiheit/Kontrolle
Mittwoch, 5. September 12
Grundprinzipien
Status
Metapher
Freiheit/Kontrolle
Konsistenz/Standards
Mittwoch, 5. September 12
Grundprinzipien
Status
Metapher
Freiheit/Kontrolle
Konsistenz/Standards
Fehler
vermeid
ung
Mittwoch, 5. September 12
Grundprinzipien
Status
Metapher
Freiheit/Kontrolle
Konsistenz/Standards
Fehler
vermeid
ungEr
kenn
en s
tatt
eri
nner
n
Mittwoch, 5. September 12
Grundprinzipien
Status
Metapher
Freiheit/Kontrolle
Konsistenz/Standards
Fehler
vermeid
ungEr
kenn
en s
tatt
eri
nner
nFle
xibilit
ät/E
ffizie
nz
Mittwoch, 5. September 12
Grundprinzipien
Status
Metapher
Freiheit/Kontrolle
Konsistenz/Standards
Fehler
vermeid
ungEr
kenn
en s
tatt
eri
nner
nFle
xibilit
ät/E
ffizie
nz
Ästethik/Minimalismus
Mittwoch, 5. September 12
Grundprinzipien
Status
Metapher
Freiheit/Kontrolle
Konsistenz/Standards
Fehler
vermeid
ungEr
kenn
en s
tatt
eri
nner
nFle
xibilit
ät/E
ffizie
nz
Ästethik/Minimalismus
Fehlererkennung
Mittwoch, 5. September 12
Grundprinzipien
Status
Metapher
Freiheit/Kontrolle
Konsistenz/Standards
Fehler
vermeid
ungEr
kenn
en s
tatt
eri
nner
nFle
xibilit
ät/E
ffizie
nz
Ästethik/Minimalismus
Fehlererkennung
Dokumentation/Hilfe
Mittwoch, 5. September 12
Grundprinzipien
Status
Metapher
Freiheit/Kontrolle
Konsistenz/Standards
Fehler
vermeid
ungEr
kenn
en s
tatt
eri
nner
nFle
xibilit
ät/E
ffizie
nz
Ästethik/Minimalismus
Fehlererkennung
Dokumentation/HilfeGeschw
indigkeit
Mittwoch, 5. September 12
Grundprinzipien
Status
Metapher
Freiheit/Kontrolle
Konsistenz/Standards
Fehler
vermeid
ungEr
kenn
en s
tatt
eri
nner
nFle
xibilit
ät/E
ffizie
nz
Ästethik/Minimalismus
Fehlererkennung
Dokumentation/HilfeGeschw
indigkeitPers
önlic
hkei
t
Mittwoch, 5. September 12
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
# Mentales Modell# $foo-Design Grundlagen
Das mentale Modell
Mittwoch, 5. September 12
# Mentales Modell# $foo-Design Grundlagen
Das mentale Modell
Das UI-Modell
Mittwoch, 5. September 12
# Mentales Modell# $foo-Design Grundlagen
Das mentale Modell
Das UI-Modell
Das Implementierungsmodell
Mittwoch, 5. September 12
Mittwoch, 5. September 12
Mittwoch, 5. September 12
Mittwoch, 5. September 12
Realismus
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
Skeuomorphismen
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
Mittwoch, 5. September 12
1 Tuna 1,112. Sake 2.223. Avocado 3.33.4. Tomate 4.445. Gurke 5.551 Tuna 1,112. Sake 2.223. Avocado 3.33.4. Tomate 4.445. Gurke 5.551 Tuna 1,112. Sake 2.223. Avocado 3.33.4. Tomate 4.445. Gurke 5.551 Tuna 1,112. Sake 2.223. Avocado 3.33.4. Tomate 4.445. Gurke 5.551 Tuna 1,11
1 Tuna 1,112. Sake 2.223. Avocado 3.33.4. Tomate 4.445. Gurke 5.551 Tuna 1,112. Sake 2.223. Avocado 3.33.4. Tomate 4.445. Gurke 5.551 Tuna 1,112. Sake 2.223. Avocado 3.33.4. Tomate 4.445. Gurke 5.551 Tuna 1,112. Sake 2.223. Avocado 3.33.4. Tomate 4.445. Gurke 5.551 Tuna 1,11
Mittwoch, 5. September 12
Gestaltgesetz der…
# Mentales Modell# $foo-Design Grundlagen
…Prägnanz
…Nähe
…Ähnlichkeit
…Kontinuität
…Geschlossenheit
…gem. Bewegung
…fortgesetzt durchgehenden Linie
…gemeinsamen Region
…Gleichzeitigkeit
…verbundenen Elemente
Mittwoch, 5. September 12
Affordances
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
Mittwoch, 5. September 12
Feedback
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
Mittwoch, 5. September 12
Mittwoch, 5. September 12
Feedforward
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
Mittwoch, 5. September 12
Mittwoch, 5. September 12
vs
Mittwoch, 5. September 12
vs
Mittwoch, 5. September 12
Direkte Manipulation
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
Mittwoch, 5. September 12
Indirekte Manipulation
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
Mittwoch, 5. September 12
Fitts‘s Law
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
Die Wurstfinger-Regel
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
Poka-Yoke
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
Mittwoch, 5. September 12
Hierarchie
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
Mittwoch, 5. September 12
Mittwoch, 5. September 12
Animationen
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
Mittwoch, 5. September 12
Konsistenz
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
Konsistenz
Animationen
Hierarchie
Poka-Yoke
Die Wurstfinger-Regel
Fitts‘s Law
Indirekte Manipulation
Direkte Manipulation
Feedforward
Feedback
Affordances
Realismus
Mittwoch, 5. September 12
Habt eine Meinung!
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
Features
# Mentales Modell# $foo-Design Grundlagen
Mittwoch, 5. September 12
Mittwoch, 5. September 12
Design-Prozess
Mittwoch, 5. September 12
Design-Prozess+
Mittwoch, 5. September 12
Design-Prozess+
$foo-Design basics
Mittwoch, 5. September 12
Design-Prozess+
$foo-Design basics=
Mittwoch, 5. September 12
Design-Prozess+
$foo-Design basics=
einfachere Kommunikation
Mittwoch, 5. September 12
Design-Prozess+
$foo-Design basics=
einfachere Kommunikation+
Mittwoch, 5. September 12
Design-Prozess+
$foo-Design basics=
einfachere Kommunikation+
bessere Apps
Mittwoch, 5. September 12
Mittwoch, 5. September 12