Wireframes
Wireframes provide a way to develop and present design ideas in the early stages of a project. They can be made up of very rough paper sketches or can be more refined and detailed digital artifacts. In the early stages of designing an interface, they can be used to help plan the layout of the design. They are a good way to focus on the functionality of the design without getting into the details, such as style and colour.
Alongside the visual wireframes, it is best to also consider narratives, long descriptions, or written step-by-step "tours" through the wireframes as a way to create a textual alternative. Not only does this make the wireframes more accessible, but it is a good way to start imagining how the interface can be presented in alternative modes. Considering this in the early stages of design will result in more successfully integrated features.
Try
- Start by listing the global features of your interface as well as features that are specific to individual screens, in order to get a clear idea of the features and functions needed
- Create a skeleton for each screen; features can be located within the screens and interaction behaviors assigned to each one
- After several iterations and user testing sessions, create high fidelity wireframes that more closely reflect the look, feel and interactive behavior of your final product