As a designer who routinely creates logos and usage guidelines for various brands, I spend a lot of time crafting marks that can be used in a variety of applications. This is really a key element: how well a logo or word mark will work on web, mobile, print, social media, watches, icons, favicons and the list goes on. And, as these applications continue to grow more complex and varied, it only makes sense to me that logos would follow the path that web design has started us on in regards to responsive formatting.
Responsive Web Design
As you probably remember, the standard for mobile sites used to be a separate “mobile optimized” site that allowed users to browse distilled website content on their phones. The problems were many and included the cost of creating two sites, as well as the diverse range of screen sizes that made true control over layout impossible. So responsive layouts were born. These sites would adjust content, layout and imagery automatically to the size and ratio of a screen.
As Adrian over at Designmodo puts it:
Responsive web designing is an entirely different designing version than traditional web designing, and developers (especially fresher) must know about the pros and cons of responsive web designing.
Responsive Web Examples
Late last year Netflix updated their brand with the Ad Agency Gretel, and one of the coolest aspects of the rebrand was the fluidity and flexibility of their brand systems.
According to Gretel:
Netflix needed a brand through-line: a conceptual and visual thread to connect everything. Our challenge was to create something broad enough for a global brand but still unique and identifiable. To create something variable yet systematic and bulletproof. It had to be visually striking, adapt to any format, and hold up to interpretation by agencies and vendors around the globe.
The key takeaway there is something identifiable yet able to adapt to any format. Netflix nailed it, and the branding is unmistakably Netflix, even when the logo is absent.
Netflix created a brand system that was flexible and variable, there are other companies willing to push the concept of responsive branding much further.
The Brazilian telecom company Oi wanted to create a logo that would be truly responsive, a shapeshifting mark that responds to sound and looks different to every customer who speaks to it. This may sound crazy to traditional designers who painstakingly create logos to be represented and received the same way every time, but the new logo from Oi works because it focuses on the visuals that matter and lets all other aspects change as needed.
According to Wolff Olins, the design shop behind it:
We developed an interactive approach to the identity, experimenting with sound and touch activation, so that there could be as many subtle variations of the Oi logo as there are people who interact with it.
In all, the new Oi identity “proudly displays its iconic roots, but it’s now firmly future-facing,” says Wolff Olins. “Designed for an open, digital world where everyone can be a creator and individuality counts, the Oi brand is much more than a static badge. In stores, in the street, on smartphones and tablets, it’s now a living, breathing entity which responds to its environment and the ever-changing needs of its customers.”
Another recent example of a rebrand that focused on responsive designs is Art UK’s new layouts by Pentagram. Creating a responsive modern logo is costly and when the European charity approached Pentagram they told partner Marina Willer that they “had neither the budget nor the patience for one of those living brands.”
With these budgetary constraints, Willers team generated a simple and fluid design that represents a literal, interconnected network. The logo can be updated easily and appears to be completely rearrangeable.
According to Fast Co. Design:
It’s an effect that’s meant to mirror the way users can curate their own experience of art on the site. But rather than actually animating the logo, Pentagram just produced several versions of Art UK that looked good and passed them along.
This low-tech approach to an animated logo works well for Art UK. Instead of rendering a logo that could be viewed in millions of ways they built a few logos that could serve Art UK in most contexts.
These are just a few examples of how branding is changing with the nature of visual media. What do you think about the use of animated or dynamic branding? Do you think it strengthens brand recognition or confuses the consumer? Leave your thoughts below and let me know if you would like more posts on responsive design.