Upload
johannes-dornisch
View
894
Download
3
Embed Size (px)
T
Learn to:How you can
t tt
Xaver (3)
Astronaut
braucht
Raumschiff
Aber…
Raumschiff
Mobile Product Design?
Wegen…
Quelle: Find my Friends App Screenshot http://sachagreif.com/flat-pixels/
2016
PUL
PROBLEM
URSACHE
LÖSUNG
Man muss kein Künstlersein… Ganz im Gegenteil!
Ja, aber wie?
Modelle
Leitfäden/Abläufe/Prinzipien
The Product Pyramid Quelle: Vgl. Dan Olsen – The Lean Product Playbook, Wiley 2015
Kunde/Zielgruppe Bildquelle: unsplash
Needs Bildquelle: unsplash
„Zentrale Kundenproblemesichtbar besser lösen alsAndere“
„Ein Raumschiff, das unseremAstronauten schnellen und sicheren Transport bietet“
Quelle: Peter J. Thomson – Value Proposition Canvas Template (http://www.peterjthomson.com/2013/11/value-proposition-canvas/)
Features Quelle: Tarmack – Star Citizen Feature Creep(https://i.ytimg.com/vi/OQcKpcYpELo/maxresdefault.jpg)
FeaturesQuelle: Sebastien Roth, http://www.startupolic.com/launching-your-
service-think-about-ux/, Henrik Kniberghttp://blog.crisp.se/2016/01/25/henrikkniberg/making-sense-of-mvp
MUST HAVES
KANO-MODELLPERFORMANCE
DELIGHTERS
Flügel
Tür
Triebwerk
Düsentriebwerk
Aerodynamic
Große Flügel
Eingebauter Kran
Integriertes Raumfahrzeug
Aussichtsplattform
„As an astronaut I want to have a door to easily enter the spaceship “
The Product Pyramid Quelle: Vgl. Dan Olsen – The Lean Product Playbook, Wiley 2015
Die fünf Ebenen der User ExperienceQuelle: Vgl. Jesse James Garret, Die
Elemente der User Experience, Addison Wesley 2012
Struktur
WY
X
Z
Quelle: Jesse James Garret http://www.jjg.net/ia/visvocab/
Raster - Scribbles
Raster - Wireframes Quelle: Selbst erstellte Grafik
Raster - Mockups Quelle: Selbst erstellte Grafik
PLUS: Prototype Quelle: Selbst erstellte Grafik
Quelle:Vgl. d.school, https://dschool.stanford.edu/sandbox/groups/designresources/wiki/36873/attachments/74b3d/ModeGuideBOOTCAMP2010L.pdf?sessionID=2f58897684fb982484d0df8fbb73761194ef1158
Empathize
Define
Ideate
Prototype
Test
Design Thinking
Oberfläche – Visual Design
Werden wir etwaspraktischer…
Deference
Clarity
Depth
🍎 Apple – HUI Guidelines
Material is the metaphor
Bold, graphic, intentional
Motion provides meaning
Quelle: Google – Material Design Principles: https://www.google.com/design/spec/material-design/introduction.html#
Google Material Design Principles
Do. Don‘t
Quelle: Selbst erstellte Grafik (Bilder: unsplash)
Do. Don‘t
Quelle: Selbst erstellte Grafik
Do. Don‘t
Quelle: Selbst erstellte Grafik
Verwendet Standard-Elemente.
🍎 G
Quelle Sketch Logo https://www.sketchapp.com/static/images/app-icon.png
Quelle: Sketch – iOS UI Design Template
Quelle: Sketch – Material Design Template
Live-Demo
„The reason designers shouldknow about code, is the same reason developers should knowabout design. Not to becomedesigners, but to empathizewith them.
– Jesse Weaver
Danke!
This work is licensed under the Creative Commons Attribution 4.0 International License. To view a copy of this license, visit http://creativecommons.org/licenses/by/4.0/.