MethodsStyle tiles
What
A design document that contains various fonts, colors, and UI elements that communicate the visual brand direction for a website or application.
Why
To establish a common visual language between the design team and stakeholders. It also acts as a collaboration artifact that both the design team and stakeholders can use to contribute to the final design direction.
How to do it
- Gather all the feedback and information that was provided during the initial kickoff of the project.
- Distill the information into different directions a solution could take. Label these directions based on what kinds of interactions and brand identity they represent.
- Create the appropriate number of style tiles based on the defined directions, which establish the specific visual language for the different directions.
- Gather stakeholder feedback. Iterate on the style tiles, eventually getting down to a single style tile which will be the established visual language for the project going forward.
Additional resources
- Tool: Style Tiles: A Visual Web Design Process for Clients and the Responsive Web. Style Tiles.
- “Style Tiles and How They Work.” Samantha Warren.
Considerations for use in government
No PRA implications. No information is collected from members of the public.