Glasgow Family Medicine Residency Project Links

Wireframes and Style Prototypes: What’s all this now?

The first deliverable in the Yellowberri process of building a website is the creation of wireframes and style tiles. These two tools, explained in further detail below, allow us to separate the logical and semantic from the creative and emotional.

Wireframes

Wireframes deal with structure. The purpose of a wireframe is to demostrate how we think the website is best organized. Wireframes show how the user will navigate your website, how content will be ordered, what features are present, and what areas will be most prominent.

To show how your website will react to multiple screen sizes, we have included controls on the bottom of each wireframe page. These controls will resize the window to commonly found screen resolutions, causing the content of the website to reorganize itself based on the viewing area.

Questions to ask yourself when reviewing a wireframe:

• What is the first thing a user sees, and why? Is the most important thing to my business right now?
• Will users be able to quickly find all the sections of my website?
• What pages/features do you think will be particulary useful for your business, and why? Our goal is the build the best website for your business, and we want all the industry insight and experience we can gather.
• What pages/features do you think will be ineffective, and why?
• Are there any features I think my customers could benefit from that are not included. (Now is the time to add new features, it only becomes more difficult later.)

Style Tiles

Style tiles are on the complete other end of the spectrum. It’s right in the name, it’s all about sttttttyyyylle. No but seriously, style tiles demostrate the tone and visual style that your final site will have. Think carefully about the you want people to perceive your business. Do you want to appear edgy, youthful, friendly, laid-back, aggresive, modern, institutional, or some other emotion? The colors, typography, and visual elements all help shape what people think about your website and your brand.

Questions to ask yourself when reviewing a style prototype:

• What is the attitude of my business? What should be the attitude of my business?
• Do you like the visual style? Will your customers react positively to the visual style? Which is more important?
• Is this consistant with the rest of my brand?