Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

UI Prototyping with Invision

441 views

Published on

One of prototyping tools designer can use today is Invision. Invision provides many tools to help designers communicate their design to stakeholders. This presentation explains about how to use Invision a a prototyping tools.

This is a part of my workshop. So in some slides there are just few information containing the main points of the practical workshop. Most of material in this slides are used practically.

Published in: Design
  • Be the first to comment

UI Prototyping with Invision

  1. 1. UI Prototyping with Afif Bimantara Founder of Agensip UI/UX Agency www.agensip.com
  2. 2. I’m Aveef I’m a UI/UX Designer who currently help some startups to bring their app into reality. Trace my LinkedIn: linkedin.com/in/aveef
  3. 3. Disclaimer! This slides is an explanation of how to make prototype with InVision, based on my experience using the tool.
  4. 4. Prototyping is a part of design processes
  5. 5. UI Design Process IDEATION WIREFRAME MOCKUP PROTOTYPE FEEDBACK
  6. 6. Prototyping is the conversation you have with your ideas “ –Tom Wujec
  7. 7. WHY PROTO TYPING ?
  8. 8. Better understanding of the design intent Early changes save time and cost Early Feedback & validation before development User research and user testing
  9. 9. Needs in Design Process Showcase Get Feedback Prorotyping Ideation Moodboard Assets & Inspect !
  10. 10. InVision fulfill all our needs in one platform similar app to consider:
  11. 11. Showcase
  12. 12. Get Feedback
  13. 13. Ideation
  14. 14. Prototype
  15. 15. Moodboard
  16. 16. Assets & Inspect
  17. 17. Craft a plugin for Sketch and Photoshop that revolutionizes your design process. Manage the plugins via Craft Manager for incredibly easy updating.
  18. 18. Download Install Craft Manager Install App Plugin
  19. 19. Publish them to Invision Get your screens ready
  20. 20. Link all screens From Sketch From Invision Hotspot
  21. 21. Deliverables Prepare all asset component for development
  22. 22. Asseting Make components exportable
  23. 23. Think, act, evaluate, iterate @aveef

×