Skip to content

Task UIPrototype

caracciolo edited this page Oct 8, 2014 · 4 revisions

1. Draw: UI & Navigation prototype

You are asked to design the user interface. This can be done by drawing wireframes of the different screens of your application. We suggest you to use fluidui.com, a web app that helps you creating interactive visual prototypes with little effort and for free. If you choose fluidui, try hovering on the elements that you added in the screen and use the "link" feature to associate it to another screen. This will allow the user to explore your prototype by clicking on objects to jump from screen to screen and having the impression of interacting with a real application.

If for any reason you don't like this tool, feel free to use another one.

Your end result should look (more or less) like the following example:

The final prototype must be saved in your repository at the following location: /Prototype/
If you will be using fluidui.com, put a link to your prototype in a file named "wireframe.txt".
Otherwise export your prototype in one of the following formats: png/jpg/pdf/html

Tip: Give a look at the use cases that you have defined during the previous week. They will help you remember all the different scenarios that your application must support. You can take each single use case and try to see if your navigation schema has a path that fulfills it.

Resources

For more information look at:

Clone this wiki locally