Skip to content

Latest commit

 

History

History
 
 

5-Prototype

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
 
 
 
 

Prototype

During this phase, the designers will build high fidelity mockups and assemble prototype for the validation phase. For the hi-fi mockups, the designers need to iron out the layout, styles and interactions. Even though fake data is used in the mockups, the designer should still insert some realistic data for better storytelling.


Tasks/Activities for Prototype

Mockup with Sketch

Sketch is the primary tool the team uses to create high fidelity mockups. Here are some useful resources for the team: https://drive.google.com/drive/folders/0BwLVd0W-_5qwZEZnMzRETEZ5QjA

Prototype with InVision

Invision really great for being able to take mockups from Photoshop or Sketch and allow for users to click through different states or pages.

Example of a prototype on InVision: https://invis.io/3VBJDMIGC

QlikSense

When mocking up a QlikSense app, it is sometimes easier build sheets directly in QlikSense, especially when there's sample data provided. The team can also explore extension objects on http://branch.qlik.com

HTML & CSS

HTML & CSS prototypes tend to be the most time consuming but are best for heavier web interactions like filling out forms.

Paper prototyping is as low-fi as you can get for a prototype. It is especially useful when you are under a time crunch to produce a prototype. It also allows for the whole team to contribute. Because the prototype is sketches on paper you are relying much more on the imagination of the participant. It gives you the ability to prototype on the fly, even during the session with the participant. Tools like Marvel and POP can help present sketches on a mobile device or in the browser so that it seems more real.