style tiles: ready to wear for the ux designer

Download Style Tiles: Ready to Wear for the UX Designer

Post on 19-Aug-2015




1 download

Embed Size (px)


  1. 1. Style Tiles Ready to Wear for the UX Designer Rob Fitzgibbon 2015
  2. 2. So What is a Style Tile, Anyway? No Nop e Rob Fitzgibbon 2015
  3. 3. Well Let Me Tell You In a digital project, a Style Tile is A single deliverable of images, colors, words and UI elements that Defines both soft design themes and hard front end UI elements Device agnostic Resolution agnostic; doesnt rely on fixed width Responsive design-friendly Described as paint chip or color swatch Avoids the vagueness of a mood board and the literalness of a screen comp Popularized by Twitter designer Samantha Warren in a March 2012 List Apart article Rob Fitzgibbon 2015
  4. 4. Heres an Example Rob Fitzgibbon 2015
  5. 5. Heres Another Example Rob Fitzgibbon 2015
  6. 6. And Heres a Third Rob Fitzgibbon 2015
  7. 7. AnndAnother One Text Text Rob Fitzgibbon 2015
  8. 8. And Finally This One Rob Fitzgibbon 2015
  9. 9. So How/When Is a Style Tile Used? During a Design Phase Useful when there is an already established brand that needs to be ported to a new platform As a tool to focus design/brand discussions with client Rob Fitzgibbon 2015
  10. 10. The Advantages of Style Tiles Lean Design Less work than making screen comps, thus efficient and cost effective Pattern-centric as opposed to concept- centric Easy to apply to templates Developer-friendly Rob Fitzgibbon 2015
  11. 11. Of Course Every Rose Has Its Thorn Mean Design; a Style Tile is also Reductionist, reducing design down to a set of Lego pieces Lazy; easy to miss elements/states and leave them undefined It doesnt work with lots of content Its rigid AND frigid (i.e. non-interactive) Its non-narrative Rob Fitzgibbon 2015
  12. 12. Style Tile Significance? New Design Tool for the Ages? UX equivalent of a coffee stirrer? Rob Fitzgibbon 2015 Time will Tell!