Designer from Phirational. Working on projects for Citrix, OSN, Refresher and many other. Noticing things that place barriers in online world, loves UX, great conferences and coffee

1. Ako nadizajnovať
mobilnú aplikáciu
a neprísť pri tom
o gate.
Oliver Stahl
UI / UX Designer @ Phirational
PRE
VÝVOJÁROV

2. “Ľudia neznášajú škaredé
veci.”
Oliver Stahl, MobCon, teraz

3. “Ľudia neznášajú škaredé
veci.”
Oliver Stahl, MobCon, teraz

4. “Ľudia neznášajú škaredé
a nefunkčné veci.”
Oliver Stahl, MobCon, teraz

5. Timeline práce dizajnéra -
začiatočníka
Spoznávanie
problému
Dizajnovanie

6. Timeline práce dizajnéra -
profesionála
DizajnovanieSpoznávanie problému

7. Timeline práce vývojára
Dizajnovanie Odhalenie
chýb
Fáza
opúšťania sa
Spoznáva-
nie problé-
mu

8. Timeline práce vývojára
Fáza
opúšťania sa
Rýchle odfláknutie dizajnu Odhalenie
chýb

9. Timeline toho, čo chceme
dosiahnuť
Spoznávanie problému Dizajnovanie

10. 3 základné kroky
k dosiahnutiu pekného
& funkčného dizajnu

11. 1. Základné princípy

12. 1. Základné princípy
2. Plán a príprava

13. 1. Základné princípy
2. Plán a príprava
3. Exekúcia

14. 1. Základné princípy

15. 1. Základné princípy
User-centered design

17. Donald Norman:
“Knowing how people
will use something
is essential."

18. “Však to
je úplne
jasné.”

19. 1. Základné princípy
Dbajte na základy dobrého
dizajnu

20. 1. Základné princípy
1. Inovatívny
2. Užitočný
3. Pekný
4. Pochopiteľný
5. Decentný
6. Dôveryhodný
7. Trvácny
8. Bohatý na detaily
9. Šetrnný k životnému prostrediu
10. Mať tak málo dizajnu, ako je možné
Dieter Rams
Dobrý dizajn by mal byť:

21. 1. Základné princípy
1. Inovatívny
2. Užitočný
3. Pekný
4. Pochopiteľný
5. Decentný
6. Dôveryhodný
7. Trvácny
8. Bohatý na detaily
9. Šetrnný k životnému prostrediu
10. Mať tak málo dizajnu, ako je možné
Dieter Rams
Dobrý dizajn začinajúceho dizajnéra by mal byť:

22. Dieter Rams:
“Less but better."

23. 2. Plán a príprava

24. 2. Plán a príprava
1. Ideamaking + sketching
2. Špecifikácia
3. Wireframing
4. Konzultácia
Ako pripraviť dobrý základ pre dizajn:

25. 2. Plán a príprava
Ideamaking a sketching je fáza
dizajnu, pri ktorej vznikajú hrubé
rysy interfacu mobilnej aplikácie
a vzniká celkom jasná predstava
o jej fungovaní
Ideamaking + Sketching

26. 2. Plán a príprava
Špecifikácia je detailný opis funk-
cionality aplikácie a slúži ako
oporný stĺp pri robení budúcich
rozhodnutí alebo zmien
Špecifikácia

27. 2. Plán a príprava
Wireframing je fáza projektu,
pri ktorej sa vizuálne prvky umiestnia
do layoutov, ktoré sú následne
zoradené podľa postupnosti
(flowchart)
Wireframing

28. 2. Plán a príprava
Verifikácia dizajnových
nápadov je pre neskúseného dizajnéra
to najťažšie, ale zároveň to dizajn
posunie ďalej, ako keby na ňom
pracoval sám
Konzultácia

30. 3. Exekúcia

31. Sketch
Mirror
PS Play Skala View
3. Exekúcia
DIZAJNUJTE NA MOBILE!

32. 3. Exekúcia
1. Buďte konzistentní
2. Nevymýšľajte koleso
3. Používajte guidlines
4. Nebojte sa whitespacu
5. Udržujte všetko vo vektoroch
6. Používajte pekné fonty
Moje UI pravidlá:

33. 3. Exekúcia
Moje UI pravidlá:
1. Buďte konzistentní
2. Nevymýšľajte koleso
3. Používajte guidlines
4. Nebojte sa whitespacu
5. Udržujte všetko vo vektoroch
6. Používajte pekné fonty

34. 3. Exekúcia
Moje UI pravidlá:
1. Buďte konzistentní
2. Nevymýšľajte koleso
3. Používajte guidlines
4. Nebojte sa whitespacu
5. Udržujte všetko vo vektoroch
6. Používajte pekné fonty

35. 3. Exekúcia
Moje UI pravidlá:
1. Buďte konzistentní
2. Nevymýšľajte koleso
3. Používajte guidlines
4. Nebojte sa whitespacu
5. Udržujte všetko vo vektoroch
6. Používajte pekné fonty

36. 3. Exekúcia
Moje UI pravidlá:
1. Buďte konzistentní
2. Nevymýšľajte koleso
3. Používajte guidlines
4. Nebojte sa whitespacu
5. Udržujte všetko vo vektoroch
6. Používajte pekné fonty
Toto je headline
Lorem ipsum dolor sit amet, consectetur
adipiscing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna
Button
Toto je headline
Lorem ipsum dolor sit amet, consectetur
adipiscing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna
TUNAK KLIKAJ

37. 3. Exekúcia
Moje UI pravidlá:
1. Buďte konzistentní
2. Nevymýšľajte koleso
3. Používajte guidlines
4. Nebojte sa whitespacu
5. Udržujte všetko vo vektoroch
6. Používajte pekné fonty

38. 3. Exekúcia
Moje UI pravidlá:
1. Buďte konzistentní
2. Nevymýšľajte koleso
3. Používajte guidlines
4. Nebojte sa whitespacu
5. Udržujte všetko vo vektoroch
6. Používajte pekné fonty

40. Questions & Answers
FB: fb.co/oli.stahl