Now that you have completed your User Flow/Journey Map, you need to wireframe each screen, step, etc. But before you start, know that wireframes are very different from thumbnails. Yes, they are both visualizations of what a design can look like, but both serve a very different purpose in the design process.

Wireframes are a visual tool that information architects, content strategists and designers use to organize the flow and hierarchy of content (elements) on a page. The wireframes should be design agnostic, meaning they should not be giving clues as to what the elements on a page look like, rather they should only be showing placement of elements. To help you visualize what a Wireframe is I’ve attached a few examples.

However, wireframes tend to become visualizations not organizations if you don’t have any content to organize throughout a page or a site. So, in order for you to create our own wireframes you need to have content. You will be gathering content or creating it on your own. This is an important step, you can use Lorem Ipsum in your final prototype, so start thinking about real content now!

Grading

This assignment will be worth 12 points. You can upload your files here.

Resources