You Do Responsive: So What?

‘

The web is something that is, and will always be, constantly changing. Along with these changes come advances in interactive content and technology. These developments, in turn, create design trends in the web. One of the most recent (and most talked-about) trends has been responsive design, and the demand for mobile-friendly sites has been high lately. Now, we are at a turning point. Google is requiring you to have a site that mobile users can enjoy or you’ll be penalized in their rankings. Thus, responsive design and development is a must. We are now at a point in time when the term responsive is (and should be) folded into the meaning of the term “website.”

Since we are now moving out of the responsive push, we designers must ask ourselves, “What’s next?” Before we answer that question, though, we must look in our toolbox and decipher what the next trend is and determine the correct way to push it. So, what do we have?

  • An ever-growing library of standardized web tools
  • Internet infrastructure that’s becoming more sophisticated (Internet speeds)
  • Smarter search engines
  • Content that’s becoming more interactive
  • Analytics that are becoming more precise

This toolbox allows designers to keep up with the times and push ourselves to make bigger and better things. My personal belief is that the web will see a push in animation, interactive content, and user experience (UX). In the past, this was interactive flash sites, but now that those tools are only holding a small niche in the web, what do these things look like?

Here are some ideas to push the trends for the post-responsive age:

Get Rid of the Webpage’

Flat design is slowly fading out of the web scene and UX/UI design is fading in. Stop thinking of your website as a flat surface to paint on. Remember that the backend guys have been working tirelessly to make your dreams (within reason) come true. You should also remember that users are going to tap, click, drag, scroll, like, and share on your site. Your site is an avenue for your user to interact with your company or brand. At Papercut, we try to keep coming back to this. Interactive is in our name, after all.

Make Your Content Engaging

Content is always king, but now that clicks are counted like dollars, you should make them worth every penny. Spend a little extra time thinking through how the user will interact with your content. Does a button simply have a hover state and link to the next page, or does it lead to a new section of your site that opens the user’s eyes to your service or product? Does an image sit flat on a page or does it open a gallery that shows what the subject is really about? Design with the user in mind. Think about the simplest action and then think about how meaningful that action can really be.

Use Animations as Part of Your Brand

Using an animation that fits within your brand will make your content placement feel deliberate. Heck, even using a lazy-load plugin will help make the content feel more at home on your site. Animated content will draw more attention and create a more meaningful interaction with the user.

 

NOTE: I do realize that not all users, especially on mobile, will be able to see Javascript/CSS transitions and animations. But, just because we have responsive designs on our minds doesn’t mean that experiences should be altered for users with more computing power. Let’s make the best site possible and then gracefully degrade from there.

I’m not saying that you should riddle your page with transitions, videos, music, gifs, and Javascript. What I do mean is that you should use an animation that is subtle, complements the designed layout of your site, and draws attention to certain pieces of content when needed.

Some Examples: Logo Animations

Approaches for logos on the web have already gone responsive, so maybe it’s time to make them more than just a mark on a web page. I usually look at logo animations on videos and commercials. You see this type of thing all the time in commercials and video ads, so why not on the web? As designers, we have the technology and power to make your brand come to life on the web.

Check out these Turner Media brands and see for yourself how animation really makes your brand come to life.