UI frameworks Presentatie kennissessie bij AMIS op 31 maart 2015

1. UI / UX
Robbrecht van Amerongen

3. 3
Robbrecht van Amerongen
@robbrecht
Linkedin.com/in/robbrecht
flipboard.com/@robbrecht
Telefoon aan! Geluid uit!
Gebruik @amisnl
@robbrecht

4. Agenda
17.00 Overview UX  Robbrecht van Amerongen
18.00 Diner
18.45 Frameworks en best practices  Niels Mansveld
19.15 UI proces bij AMIS  Matthieu de Graaf
19.45 Hoe maak je ‘saaie’ logdata sexy?  Frank Houweling
20.00 Het nieuwe dashboard  Edward Orlowski
20.15 UX demo’s en Serviceportaal  Paco van der Linden
Merijn van der Linden
20.45 Afronding en Netwerkborrel @AMIS Café

5. 5

6. Wat is een goede UI / UX
Een systeem met de gebruiker centraal,
niet de producten,
de leverancier
of de developer.

7. 7
“If you notice the UX,
it is probably not designed correctly”

9. Quotes (1/2)
Het systeem kan het niet aan als (te) veel gebruikers gegevens zoeken (?!)
Dat kan niet,
ons framework is namelijk gebaseerd op “standaard componenten”....
Dit systeem is niet echt arbeidsvreugde verhogend…...
Dit framework maakt het makkelijk voor de ontwikkelaar,
niet voor de gebruikers…...

10. Quotes (2/2)
Waarom moet ik eerst zoeken om “mijn” gegevens te vinden,
het systeem weet toch wie ik ben?
Informatie delen met mijn collega van een andere afdeling kan nu niet,
foto’s delen met mijn zoon in Ghana kan ik wel
Het systeem weet toch wie ik ben, wat ik doe en wat ik belangrijk vind…. dus…
Van al deze velden op dit scherm……
gebruik ik alleen deze 2, de rest eigenlijk nooit.
Waarom zie ik een zandloper als ik naar de volgende rij spring?

11. Trends
● Waar vragen kanten naar?
● Wat willen (potentiele) collega’s?
● Wat wordt de standaard?

12. What is modern?
Hip?
Fashionable?

14. Requirements of modern UX
● Effectief
● Intuitief
● Anticiperend
● Autonoom / gepersonaliseerde
● Gebruik van defaults
● Groeperingen
● Effectief kleurgebruik
● Reactief
● Tijdigheid
● Vertrouwd / betrouwbaar

15. Effectief
Meer doen in minder tijd
Krijg jouw gegevens,
Actuele taken, acties

16. 16
Intuitief
Eenvoudig in gebruik,
geen instructie,
helder wat effect van actie is

17. Anticiperend,
Maak gebruik van dingen die het systeem al weet.
Geo, agenda, taken, klanten, targets, etc
Verberg minder gebruikte zaken

18. 18
Autonoom / gepersonaliseerde
Mijn user interface. Zelf menu, kleur, logo
volgorde items kunnen instellen.

19. 19
Gebruik van defaults
Wat weet je al? Wat kan je gebruiken?
Taal, datum / tijd, veel gebruikte opties,
Voorkeur, locatie

20. .
Groeperingen
Informatie die bij elkaar hoort als groep weergeven. Duidelijke
scheiding tussen de informatie delen.

21. Reactief
Geef de gebruiker feedback op wat hij doet. Save,
edit, wissel scherm. Pas content en layout aan op
gebruikte device

22. 22
Effectief kleurgebruik
Geen felle kleuren. Complementair
Kleur theorie. Grijswaarden.
Benadruk wat belangrijk is.

24. Tijdigheid
Snelheid waarmee de informatie beschikbaar is
Toon die informatie op het moment dat je
het nodig hebt (en niet eerder)

25. 25
Vertrouwd / betrouwbaar
Toon de bron van de gegevens en het tijdstip.
Laat zien wat de rechten zijn die bij de data hoort.

26. 26

27. 27
Wat maakt de mix
Functioneel
ExperienceEsthetisch

28. 28
Functioneel
Functioneel
ExperienceEsthetisch

29. 29
Esthetisch
Functioneel
ExperienceEsthetisch

30. Experience
Functioneel
ExperienceEsthetisch

31. 31
Ben je tevreden met de UX die je maakt?

32. 32
Een designer werkt er enkele dagen aan

33. 33
Een ontwikkelaar bouwt het in een paar weken

34. 34
Een gebruiker kijkt er enkele jaren naar!

35. 35
Of maar 1 keer…..

36. 36
UX is not what it does
It is how it makes you feel