Design better by leveraging context

No design exists in a vacuum, just as no company exists on an empty playing field. That means that every product and website design lives in the context of hundreds of other products and websites that our customers and prospects interact with every day.

Yet, when working on a new design, how often do we look at that context? How often do we look at that environment our design will complement or compete with for attention?

“No design exists in a vacuum. So why would you design in a vacuum?”

Let’s dive into the set of companies, products, and assets that make up this context and discuss how to turn that context into smart design decisions.

Who makes up that context

The context for your product and website spans beyond any single company or even industry.

1. Your company: The first entity is none other than your own company. Unless you’re a brand-new company, you likely have existing customers and prospects who know your brand and your website already. For that reason, they may be expecting a certain design or certain experience going into another visit or login. Simply moving a commonly used button a few pixels to the left can cause confusion to visitors who navigate your website with such ease that they don’t even look at what they’re clicking on.
2. Competitors: The next step in building out your design context is to look at your company’s competitors. What other products does your target market use to solve the same problems? What competitive products have they used in the past, what do they use today, and what are they evaluating? We explored the topic of using competitive data to make better design decisions in the recent InVision DesignTalk: Become a better designer with competitive intelligence.

Browse millions of webpage designs catalogued in Crayon Inspire.

3. Partners: There’s a reason you engage with your partners—they likely have the same or similar customer base and offer complementary products. As a result, they also play a role in your design context. Since you have a collaborative relationship with them, you may be able to exchange design ideas and feedback.
4. Customers: Anyone who works at a company likely spends a lot of time in the product and/or website for their company every day. As a result, your target customers’ websites can contribute to your design context. Looking at a customer’s designs can give you insight into what they appreciate and what’s most important to them.
5. Customers’ peers: The same logic extends to your customers’ peers’ products and websites. It’s likely that they look at their peers’ and competitors’ products and websites on a regular basis. Take a look at the full suite of the industries you target to best understand the broader industry context for your designs.
6. Other products used: Finally, there are many products and websites we all use every day that are not directly tied to our jobs or industries. Find out which products, apps, websites, etc. your personas most often frequent and review them as part of the broader context for your designs. Oftentimes, these additions can offer the best inspiration because they aren’t directly tied to what you do.

“Looking at a customer’s designs can give you insight into what’s most important to them.”

How to identify the right companies

Now that you understand which categories of companies to look at, how do you find out which specific ones to review?

1. Persona interviews: One of the best ways to get a broad introduction to the sets of products and websites your personas use and visit is, simply, to ask them! Persona interviews and surveys can give you great insight into the companies your customers know, love, or hate.
2. Search engine results: Another great way to see who’s competing for your customers’ attention is to look at the battlefield—search engines. Doing searches on your top keywords, or even your brand name, can show you who you’re up against in organic and paid results.
3. Partner list: Finding your top partners should be a pretty easy task, whether they’re listed on your website already or identified on an internal wiki. You can also ask your partner team for more details.
4. Customer list: The same goes for your customer list—this should be a pretty simple task of reviewing your customer case studies, logging into your CRM, or asking your sales or services teams.
5. Sales data: Where things get a little more interesting is getting at the competitive landscape, which your company should be tracking as part of the sales process. Ideally you should be tracking and looking at who your prospects are using today, who they’re evaluating as part of the sales process, or whose products they choose if not yours. Remember that your “competitors” don’t need to be companies that offer the same product as you—they can simply be alternatives that your customers use to solve the same problem.

“Look at search engines to see who’s competing for your customers’ attention.”


6. Brand leaders: Top trend-setting companies, like Airbnb or Uber, can also serve as solid inspiration. These companies are often highlighted in the news or even get surfaced on sites like Crayon Inspire. If you want to get more scientific about looking at top websites, you can start by reviewing Alexa’s Top 500 Sites.

What makes up that context

The type of data to collect starts but does not end with design. There’s a wide range of data that can inform and influence your design work.

Related: How to get started with data-driven design

1. Design: The most obvious place to start when pulling together your context is the design itself. Website and product designs you can get a hold of, as well as previous designs, can quickly build up your contextual library.
2. Content: The content included in those designs, as well as the content off-site, can tell you a lot about the company’s brand and how you can stand out in comparison. Look at website copy, ebooks, videos, social media posts, and any other content you can get.
3. Promotions: Look at what these companies proactively put out, including new promotions (campaigns and offers) and announcements. This can give you insight into what that company sees as most important and compelling.
4. Product: Of course, you’ll also want to stay on top of the product(s) themselves, including features, pricing, packaging, positioning, and reviews.
5. Reputation: Design can be a major contributor to the communication of the company’s brand reputation, so look at the context of reviews, news, awards, and more that make up the reputation of these companies.
6. People: Who the company does business with and how they communicate those relationships can also play an interesting role in your design context. Look at the customers, partners, management team, and employee base to see what the company says about its people and what its people say about the company.

Case study: T-Mobile uses design to highlight a competitive edge

Design can be a powerful differentiation and branding tool, particularly in a crowded, commodity market. The cell phone market is a great example of such a market. Verizon and AT&T have long been the market share leaders, but T-Mobile has shot up to the third-place spot in recent years. Their low pricing has often been credited with driving this success, but their design has also helped hammer home the brand differentiation.

Looking at these homepages, the contrast is pretty obvious. Verizon and AT&T highlight the phones themselves on a backdrop of a simple, black-and-white color scheme.

Meanwhile, T-Mobile uses bright imagery and highlights their lower-price and transparent pricing plans. In fact, the subheading specifically calls out a competitor: “Why pay $600 more every year with Verizon?”

They also note that the pricing includes all taxes and fees, a pain point often noted in their competitors’ customer reviews. This customer focus is also reinforced with their use of people imagery across their website.

The ultimate result? Better design—a design that stands apart from the competition, shows they listen to what the market is saying, and communicates their human brand and their product differentiation.

There are many ways context can inform and influence designs, from highlighting a competitive edge, to aligning with customer values, to mirroring a recognizable user experience.

How have you leveraged your company’s context to drive an effective design? Tell us on Twitter: @InVisionApp.