You don’t want to tie yourself to a particular website design too early. Studies have shown that people are more willing to make changes to a design when the design is drawn more primitively. That is why most prototypes start out as low-fidelity wireframes, often drawn on paper but also sometimes in tools like Sketch or Balsamiq.
For this assignment, you will first work in groups during class to determine what the different page categories might be for your website (the top-level navigation). Then, you will draw a design for your home page, which will incorporate the top nav and other key elements you want to feature on the home page.
You may draw the wireframe of your home page on paper or in Sketch or Balsamiq. If you draw it on paper, you can take a photo of it and upload the photo.
You are only required to make one wireframe, but I encourage you to draw two options so that you can get even more feedback and generate more ideas.
Assignment Credit Requirements
- [ ] The wireframe must be drawn by hand or in a tool like Sketch or Balsamiq. It should be LOW-fidelity so that you feel okay changing it in the future. Do not built it in WordPress, although you may browse WordPress templates to get inspiration for the layout you want.
- [ ] The wireframe may be for laptop/desktop, tablet, or phone dimensions. Refer to the user journey you created. You can start with mobile or start with a desktop/laptop view, depending on how your primary user will get to the site.
- [ ] Include a main navigation with links to the main pages or sections clearly displayed for the user. Although the top nav may change in the future, you need actual words (not placeholder text/lorum ipsum) for the main navigation links. The top nav should include at least three links, typically no more than eight unless you can justify it.
- [ ] Include a spot for your logo and company name.
- [ ] Include a search bar. (Most website visitors search rather than browse.)
- [ ] Include a spot for at least one main feature or call to action on the home page. (You can use lorem ipsum for text and X boxes for images. Include the ▶️ symbol if something is a video.)
- [ ] Include at least two secondary features or highlights/calls to action.
- [ ] You should have space for some images and/or videos on the page, not just text, unless you can justify an image-free design.
- [ ] Include a footer, which should contain a copyright space at the least but might also include space for a site map or maybe social media links, unless you are featuring things like that elsewhere.