Also known as element collages, these layouts are combinations of the main pieces of the page.
As we get more diverse on how we want to design each page of our website, we need systems for all of these styles and purposes and devices.
Therefore we need to think in modular design where we can be able to focus on the pieces but realizing that they will need to go into several different layouts.
Why is important:
- Provide deliverable with which to get feedback
- Save time by not designing whole websites
- Start drafting important elements, so they get more rounds of revision
Style Guides: Pieces of the website, sharing widgets, texts, title, headlines and any of the most important pieces of the site. This is not an inspiration board, we dont want to screen shooting and pasting it into our layouts because if we do, we are giving both our client and us a misguided perception of how far along the process we are actually are. We want to do this as our actual first drafts of the pieces of the design.
Styletitle: appropriate for when we want to know if the client likes our colors
Frankenstein layout: appropriate for when we want a more design feedback haven’t designed the whole website. It contains:
- buttons, menus, tabs
- headlines, paragraphs, forms
- callouts, icons, special sauce
Resources
- http://styletil.es/: This are more specific than a mood board. Here you will have an actual headline, actual colors and images, buttons and ui assets on the page but its not quite a full layout
- Element Collages provides good examples in his work developing style guides. These style guides give you a great idea of the personality of the website even before moving to layouts