Your SlideShare is downloading. ×
0
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Crafting Experience
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Crafting Experience

3,100

Published on

UX Design Process

UX Design Process

Published in: Design, Technology
7 Comments
50 Likes
Statistics
Notes
No Downloads
Views
Total Views
3,100
On Slideshare
0
From Embeds
0
Number of Embeds
5
Actions
Shares
0
Downloads
138
Comments
7
Likes
50
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. Crafting Experience UX Design Process and Testing @RezaPrabowo
  • 2. Reza Prabowo Full-time Cyclist, part-time UX Designer @RezaPrabowo
  • 3. What is UX? I’m pretty sure the dude before me has explained it brilliantly.
  • 4. But what does a UX Designer do? The Five Competencies of User Experience Design
  • 5. IAInformation Architecture The interface structure and navigation scheme
  • 6. IDInteraction Design The page-level layout, task fulfilment, and component flow
  • 7. UEUsability Engineering The study of discrepancies between expected and actual user behavior
  • 8. VDVisual Design The consistent visual treatment of elements and components
  • 9. VD “What people often overlook is that, for every type of user interface element the interaction designer specifies, the visual designer must design a widget or devise a corresponding style. And the visual designer must consistently apply these styles to every instance of each element throughout the application” - Steve Psomas
  • 10. PTPrototyping The functioning composition of proposed interactive concepts
  • 11. UX Design Process
  • 12. Analysis Collecting information about the problem əˈnalɪsɪs
  • 13. əˈnalɪsɪsAnalysis User Research • Surveys - Get feedback from users • User Interviews - Everyone has a story, dig them deep • User testing - Sitting users in front of your website or app and asking them to perform tasks, and to think out loud while doing so
  • 14. əˈnalɪsɪsAnalysis Competitive Analysis • Benchmarking similar products / competitor
  • 15. əˈnalɪsɪsAnalysis Trend Analysis • Spot the latest trend and find out why they do it that way • patterntap.com • uxporn.uxpin.com • pttrns.com
  • 16. ˌʌɪdɪˈeɪʃ(ə)nIdeation The formation of ideas or concepts.
  • 17. ˌʌɪdɪˈeɪʃ(ə)nIdeation Doodle! • Sketch your ideas. Proven to be the fastest UX solutions • Adaptive Path's Sketchboard
  • 18. ˌʌɪdɪˈeɪʃ(ə)nIdeation Screenflow • Create relationships. Between pages, screens, components
  • 19. dɪˈzʌɪnDesign The fun part.
  • 20. dɪˈzʌɪnDesign Low fidelity wireframes • A visual guide that represents the skeletal framework of a website / application • With lo-fi wireframe, we can test and iterate design solutions faster
  • 21. dɪˈzʌɪnLo-fi wireframes Tools: UXPin, Balsamiq, Axure, OmniGraffle. Design
  • 22. dɪˈzʌɪnDesign Visual Design • Communicates the brand, interactivity, workflow, and relationships • Consistently apply these styles to every instance of each element
  • 23. dɪˈzʌɪnVisual design Design
  • 24. ˈprəʊtətʌɪPrototyping Making it work
  • 25. ˈprəʊtətʌɪPrototyping • Deliver prototypes of concept models for testing by the usability engineer. • Increasing process efficiency
  • 26. ˈprəʊtətʌɪ UXPin Prototyping: Tools
  • 27. ˈprəʊtətʌɪ inVision Prototyping: Tools
  • 28. ˈprəʊtətʌɪ Proto.io Prototyping: Tools
  • 29. ˈprəʊtətʌɪ Axure Prototyping: Tools
  • 30. dɪˈzʌɪnPrototyping Tools • UXPin - uxpin.com • inVision - invisionapp.com • Proto.io - proto.io • Axure - axure.com
  • 31. ˈdɒkjʊm(ə)ntDocument Making documents and specifications of the user experience. Making it easier for developer to understand how it works
  • 32. ˈɪmplɪm(ə)ntImplement Working with the developer to make sure they deliver the application / website as designed
  • 33. dɪˈplɔɪDeploy You can relax now. But is it over?
  • 34. But this is the easiest way to explain what UX is Never mind the fact that they use comic sans
  • 35. Reza Prabowo Full-time Cyclist, part-time UX Designer behance.net/RezaPrabowo

×