Wireframes – Design Wireframe – Wireframe Tools – Website Wireframes – Wireframe Software
Random header image... Refresh for more!

Successful Interface Design: Storyboarding for Your Website – Part 3

Storyboarding How-To

Storyboards can be created from (usually smaller) sheets of paper, post-it notes, using a white or black board, using office software programs, or using a more specialized software program. A storyboard does not usually require a high level of artistic detail; instead it should only focus on details that are relevant for the interface design of the website. Thus, a storyboard can be built with simple shapes, such as basic line drawings. In some cases, simple wireframe prototypes can be used for storyboarding purposes. There are a few wireframe tools that even allow for wireframes that look hand-drawn. For optimal results, keep the following basics in mind while creating the drawings of your storyboard:

1.    Website navigation: Include the buttons and links that users will need to find their way through the website.

2.    Content sections: Don’t waste time on details, rather focus on how you plan to present the relevant content areas?

3.    User login boxes: Some websites have a login section. Include it if it’s relevant.

4.    Search boxes/engine: How do users of the site find relevant information?

5.    Page connections: How do individual pages of the website relate to one another?

Simple storyboards allow you and your clients or prospective users to focus on the important aspects and the usability of the user interface and not on details, such as graphics, color, fonts or other design characteristics. Thus, when creating a storyboard prototype, focus on the fundamentals first. Solid fundamentals usually trigger innovation in later stages of the web design process.

0 comments

There are no comments yet...

Kick things off by filling out the form below.

Leave a Comment