Your SlideShare is downloading. ×
Prototyping to the next level with interactive prototypes - Jaideep Singh, ThoughtWorks
Prototyping to the next level with interactive prototypes - Jaideep Singh, ThoughtWorks
Prototyping to the next level with interactive prototypes - Jaideep Singh, ThoughtWorks
Prototyping to the next level with interactive prototypes - Jaideep Singh, ThoughtWorks
Prototyping to the next level with interactive prototypes - Jaideep Singh, ThoughtWorks
Prototyping to the next level with interactive prototypes - Jaideep Singh, ThoughtWorks
Prototyping to the next level with interactive prototypes - Jaideep Singh, ThoughtWorks
Prototyping to the next level with interactive prototypes - Jaideep Singh, ThoughtWorks
Prototyping to the next level with interactive prototypes - Jaideep Singh, ThoughtWorks
Prototyping to the next level with interactive prototypes - Jaideep Singh, ThoughtWorks
Prototyping to the next level with interactive prototypes - Jaideep Singh, ThoughtWorks
Prototyping to the next level with interactive prototypes - Jaideep Singh, ThoughtWorks
Prototyping to the next level with interactive prototypes - Jaideep Singh, ThoughtWorks
Prototyping to the next level with interactive prototypes - Jaideep Singh, ThoughtWorks
Prototyping to the next level with interactive prototypes - Jaideep Singh, ThoughtWorks
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

Prototyping to the next level with interactive prototypes - Jaideep Singh, ThoughtWorks

280

Published on

There are a lot of tools available for rapid prototyping which can be used to create neat prototypes within hours. However, the prototypes don't really give any idea about the user flow and how they …

There are a lot of tools available for rapid prototyping which can be used to create neat prototypes within hours. However, the prototypes don't really give any idea about the user flow and how they connect with each other. Also, if you're doing paper prototypes, it gets very hard to present them as a flow. With Indigo Studio, we'll learn how we can create effective prototypes and link them together in a user flow. Choose to import your existing paper or digital prototypes, or build new ones from scratch. Bring your prototypes to life with interactions like click, mouseover, right click, etc. All this and more, in this learning session about interactive prototypes.

Published in: Business, Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
280
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
6
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. Interactive Prototypes Jaideep Singh
  • 2. Tools TIME FIDELITY Storyboards Prototypes Digital mockups HTML/CSS pages Dynamic pages (DB etc)
  • 3. What is a prototype Picture credits: Wikipedia
  • 4. Why prototype Quick visual representation All stakeholders on the same page Validate information architecture Early feedback
  • 5. What is not a prototype Color & graphics Typography Detailed interactions Working application
  • 6. Paper vs digital
  • 7. You can draw A straight line Circle Rectangle Triangle Shade
  • 8. Paper prototype Create a todo app List of tasks Option to mark tasks done Option to delete tasks Group tasks as completed and incomplete
  • 9. General guidelines Straight lines Spacing between elements Post-Its for components and for states Time limit the activity
  • 10. Lifealytics demo http://www.youtube.com/watch?v=J- bVzUahNIg
  • 11. Prototyping tools Solidify (Analytics) Invision (Collaboration) Antetype (Responsive) Balsamiq (Quick, minimal) Wires (In-browser) Proto.io (Animations)
  • 12. Indigo Studio Storyboards Interactive wireframes Import paper wireframes Animated transitions Share FREE
  • 13. The prototype Ecommerce app for a camera store Key categories Screens Product listing Product details
  • 14. List Detail
  • 15. Thank you! @_jaideep

×