Your SlideShare is downloading. ×
Presentatie Prototyping
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Presentatie Prototyping

335
views

Published on

Presentatie van Luc Moers tijdens de masterclass Prototyping van start-up competitie The Challenge.

Presentatie van Luc Moers tijdens de masterclass Prototyping van start-up competitie The Challenge.

Published in: Design

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
335
On Slideshare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
3
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. PROTOTYPING & INTERACTION DESIGN van idee naar testbaar concept
  • 2. LUC MOERS Even voorstellen…
  • 3. WAT GAAN WE DOEN • Introductie User Centered Design • • Een aantal UCD principes om je prototype vanuit op te bouwen Introductie prototyping • • • Onderdelen in Axure Prototype maken met Axure Presenteer je prototype • Eventueel doornemen hoe je user testing kan doen
  • 4. INTERACTION DESIGN Wat is het eigenlijk?
  • 5. INTERACTION DESIGN Bedenken en ontwerpen van de gebruikerservaring van interactieve producten
  • 6. USER CENTERED DESIGN Een korte introductie om jezelf op weg te helpen
  • 7. UITGANGSPUNTEN Hier hou je rekening mee met UCD
  • 8. BETREK JE DOELGROEP ken hun ervaringen door middel van interviews en tests
  • 9. STEL DOELEN OP voor jezelf en je doelgroep door middel van use cases en scenario's
  • 10. HOU REKENING MET DE OMGEVING waar en wanneer gebruikt je doelgroep het product?
  • 11. DENK VANUIT PROCESSEN Hoe kan ik een taak logisch en eenvoudig voltooien
  • 12. ZINVOLLE INFORMATIE Welke informatie verwacht de eindgebruiker en wat heb ik nodig (maak een mindmap)
  • 13. WEES EMPATISCH Wat wil je dat mensen voelen als ze je product gebruiken?
  • 14. MAAK EEN PROTOTYPE Test of het product echt werkt
  • 15. PROTOTYPING Je product voor het eerst gebruiken
  • 16. WELKE MANIEREN ZIJN ER
  • 17. WELKE MANIEREN ZIJN ER • Paper prototyping • Prototyping software op computer • Frameworks (zoals Twitter Bootstrap)
  • 18. WAT HEB JE NODIG? • potlood en papier • een computer • Mindmapping tool (handig) • Word • Axure 7.0 • Axshare account
  • 19. AXURE PRO Prototyping tool voor Mac en Windows te downloaden op www.axure.com
  • 20. WAT IS AXURE? • Rapid Prototyping tool sinds 2006 • Geschikt voor Mac en PC • Voor mobile apps, web applicaties, software • Tutorials en met bibliotheken • Toegankelijk voor beginners, krachtig voor gevorderden • Bekijk en test je prototype in je browser of deel het op AxShare
  • 21. HOE WERKT AXURE Gids met belangrijke features (Start Axure AUB op)
  • 22. 1 SITEMAP De onderdelen van Axure
  • 23. SITEMAP De verschillende pagina’s en processen in je applicatie of site uitgetekend.
  • 24. FLOWCHARTS Maak diagrammen om structuur te verduidelijken
  • 25. 2 WIDGETS De onderdelen van Axure
  • 26. WIDGETS Standaard (web) elementen om een pagina op te bouwen. 
 Selecteer bibliotheken voor widget sets.
  • 27. 3 DE ONDERDELEN VAN AXURE Masters
  • 28. MASTERS Maak een functionaliteit wat je meerdere keren kunt gebruiken en in 1 keer op alle pagina’s kunt veranderen!
  • 29. 4 4 DE ONDERDELEN VAN AXURE Page en widget interactions
  • 30. INTERACTIONS Maak je prototype interactief, bouw geavanceerd gedrag zelfs met de mogelijkheid om variabelen te gebruiken.
  • 31. 5 DE ONDERDELEN VAN AXURE Dynamic panels en widget manager
  • 32. DYNAMIC PANELS Paneel dat bestaat uit 1 of meerdere ‘lagen’ die op interactions kunnen reageren en zichtbaar of onzichtbaar zijn.
  • 33. 6 DE ONDERDELEN VAN AXURE Adaptive views voor meerdere schermformaten
  • 34. ADAPTIVE VIEWS Je prototype op verschillende schermformaten, voor de gevorderde gebruiker.
  • 35. 7 DE ONDERDELEN VAN AXURE Styling elementen kleur en zelfs webfonts
  • 36. STYLESHEET Kleed je prototype aan met een look and feel.
  • 37. DE ONDERDELEN VAN AXURE Deel je prototype
  • 38. DEEL JE PROTOTYPE Lokaal als HTML genereren en openen in je browser
  • 39. DEEL JE PROTOTYPE Online via share.axure.com met gratis account
  • 40. EN NU BOUWEN Werk een of meerdere schermen uit met interacties. Presenteer je demo.
  • 41. PRESENTATIES Wie durft?
  • 42. VRAGEN Luc Moers l.moers@drecomm.nl