Freelancer Tips

Why Your Brand Needs Style Tiles

By
Kate Devery
|
May 16, 2019

If you haven’t heard of style tiles before, it doesn’t mean they aren’t important to your business’ branding. According to Envato tuts+, style tiles are a rectangular image that contains the graphic elements of a business’ brand, including colors, typography, textures, and patterns.

These are smaller, condensed versions of entire branding mockups, which are often a few pages.

What's the Purpose of a Style Tile?

The purpose of style tiles is two-fold: it gives the business a high-level view of what their brand encompasses and it also allows designers to spend less time on brand design mark-ups that the rest of the team or the client may not like.Styletil.es explains that this document helps facilitate the conversation between the designer and the client or other team members they are working with on the project.

It ensures that everyone is on the same page when it comes to where a brand needs to go next, making it easier for everyone involved with less time spent brainstorming and fewer revisions for the designer. Creative Bloq states that style tiles shouldn’t necessarily replace design mock-ups, but are instead a “first step” before complete mock-ups that help everyone stay on the same page with the designer's goals.

What Elements Should Style Tiles Have?

The Envato tuts+ article explains that all style tiles should contain most of the following elements where they make sense:

  1. Client logo
  2. Fonts
  3. Possible brand colors
  4. Textures (this is to convey a “message” about the brand, it doesn’t mean literal photoshop or background textures.)
  5. Adjectives
  6. Typography
  7. Buttons
  8. Background
  9. Version (to keep track of the iterations of style tiles)

How to Create Style Tiles

Styletil.es goes into this with more detail, but the four-step process for creating a style tile is as follows:

  1. Listen: have a design kick-off meeting to ask questions and make sure everyone is clear about the branding objectives and what the branding needs to convey
  2. Interpret: Review team feedback to turnkey phrases and adjectives into design elements.
  3. Define: Look at the list of adjectives and design elements to create the tile. Many designers do multiple versions of tiles and present a few at once. Here is a zip PSD template by Styletil.es to use as a starting point.
  4. Iterate: Present to the team. Depending on their feedback, this process may need repetition or you may need to combine elements from multiple style tiles to create a final version for branding.

Be Patient When Designing

Creating the perfect branding can be difficult to get right, especially if the designer, owner, or others working on the project have different ideas about what the brand needs to convey or what graphic elements to include.

That’s why style tiles are so important: they allow everyone to get on the same page, interpret expectations in a visual way, and include all the components that make up a company’s brand: typography, colors, and meaning through visuals.

Creating style tiles for branding can save time and resources while decreasing the chances of frustration or missed communication amongst project members.

Kate Devery
Kate is Fiverr's Senior Brand Copywriter. She has 6+ years experience in managing content and writing copy for beauty, fashion, tech, and wellness brands.
Marketing Executive Priorities
Business News
Top Priorities for Marketing Executives
Fiverr has released its second annual report detailing the urgent needs and top priorities of marketing executives in the U.S.
Holiday Season
Business News
Fiverr Research Reveals How Retailers and e-Commerce Brands are Tackling the Shortened Holiday Season
Retailers are investing in AI (70%), social media ads (39%), influencer marketing campaigns (35%), email marketing (33%), and SEO (29%).
Finance Priorities
Business News
Top Priorities for Finance Executives
Fiverr has released a comprehensive report detailing the urgent needs of finance executives in the U.S. 
Choose a language
Check mark icon
English
Deutsch
Français