2013 Trends You Can Trust Part 1

With the end of 2012, it is that infamous time of year when designers like to declare trends for the new year. I am no different. At the end of this article I will make bold proclamations about the new year in design, however I would like to start with this precursor: Trends are just that: trends.

Trends come and go and should be approached gingerly. Do you remember when we used blinking elements on the screen, huge drop shadows in design, or the glossy effect of buttons from web 2.0? Luckily, those were all trends that fell to the wayside quickly.

Instead of putting all our faith into trends, designers should search out the latest trends THEN adapt, combine, and improve upon them using a combination of our past experiences (including client and user feedback). We don’t want to find ourselves revisiting recent work and chuckling because we did what was “hip” in design at the moment.

The goal of this article is that we as a design community can strike up a conversation about the future trends of our industry. So your comments are welcomed.

This past year has lead to 3 industry trends

1. Responsive Web Design

Responsive web design is to web development/design what PB&J is to the sandwich. We have all heard various definitions for responsive web design so another one won’t hurt: responsive web design is delivering the same UX across any number of devices using a flexible grid based on percentages or ems. This differs from adaptive web design which focuses on exact breakpoints and uses pixels as it’s main form of measurement. For more information on responsive web design visit the following article by Ethan Marcotte.

A perfect example of responsive web design would be Steve Fishers website, hellofisher.com. As the browser screen is reduced or expanded the content flows and morphs to fit the exact browser window. This site does not wait for some magic number of the past (cough…. cough… 1024px) but instead is coded so the viewers experience is great no matter the browser window size. Even the typography is changing to better fit the screen size.

There seems to be an endless amount of resources for responsive web design. However, most of them seem to be misleading and offer up adaptive web design examples and tutorials as opposed to truly responsive web designs. This being said here are a few reliable resources:

  1. Responsive Process is Steve Fisher’s work-in-progress responsive web design resource. I anxiously awaiting the day it is complete and official released.
  2. Golden Grid System is a great starting point for truly responsive web design projects.
  3. Responsive Toolkit has a bunch of responsive design tools.

2. Content Driven Experiences

Internet users are becoming increasingly savvy and wise. They expect sites to deliver what they are looking for nearly instantaneously. If this information isn’t present, they quickly jump to another site that has what they want. With this movement comes a need for great, useful content. Hence the rise in content related occupations within our industry. No matter how beautiful or interactive the experience, if the content is lacking, the experience will be less than pleasing for the user. Content is king.

This “trend” has brought back the fantastic idea of COPE (Create Once and Publish Everywhere). If you have not heard this nifty little acronym, don’t worry. It is as simple as it sounds. Create content once so it can be seen everywhere. If you would like to learn more about COPE, I highly suggest reading the following article by Karen McGrane.

A great example of a content driven experience would be NPR. They use the idea that their content is king and it should be available for all possible devices or situations a user could run into. Their editors create the well formated data once and it becomes available across the multitude of presentations outlets that exist. If you don’t believe me, look at an NPR article on their site, a mobile device, a tablet, on your tv, and any other place you could find NPR and you will notice the content is delivered as needed, per device. This is the definition of COPE (Create Once and Publish Everywhere).

3. Single Focus

An example of single focus within design would be a single page site. You may be asking, “well why didn’t you just title this trend ‘Single Page Sites’?” The reason is the same principles behind a single page site can be applied to a specific section of a site. The single focus trend encompasses all single page trends… good and bad. One of the inherited trends would be parallax scrolling. I must be honest, this spiffy scrolling trend has tempted me, but this aspect of the single page trend is just eye candy. Parallax scrolling, at it’s core, keeps every related element on one page for easy navigation.

Single focus does a great job of:

  • telling a story (creates user interest)
  • defining steps in a process (informs the user)
  • grouping related topics (helps the users ability to absorb content easily)

Single focus is a trend that will help designers and developers deliver quality effective user experiences.

MTV Election 2012 is an excellent example of a site using single focus. This site has 2 layers of focus:

  • the issues for the 2012 election
  • the issues facts

I am opposed to limiting a user’s interactions, but this site does a great job of having the user complete a section of the issue before moving on. It creates a focus on what is on the screen for the user. When the users reaches the end of the issue, they are introduced to the next topic, which opens in a new view. The site is not 100% on a single page, but the interaction design gives the site a single focus.

Read on in part 2 of 2013 Trends You Can Trust to learn more about my take on current design trends.


Written by James

Leave a Reply