During last years we have seen the rise of widespread responsive frameworks, the sets of ready to use components aimed to build user interfaces. The cool thing is that by using them you can quickly set up an interface that works pretty well on every device. It saves time, money and headaches, of course.
It all began with Bootstrap
Created at Twitter in 2010 it first served as the style guide for internal development at the company for over a year before its public release, in August 19, 2011.
I still remember back in 2011 when I stumbled upon getbootstrap.com – it was something that changed the way we design websites. Thanks to Bootstrap I started having a proper rule of thumb when starting to design a new user interface.
Sometimes, it is very easy to understand that a website is based on bootstrap, but sometimes it is nearly impossible to determine wether a site is based on it or not at a first sight. Millions of websites were built on Bootstrap since its release, and we have relevant examples of companies such as Lyft, Nasa, Spotify, Newsweek, Vogue among many other.
The ultimate framework
With Google Material Design the framework concept itself was brought to a next level. Not only rules and components but styling and refined interactions became part of what is probably the most comprehensive responsive framework available today on the web, a sensorial expression of what today Google is.
Video Player00:0000:04Use Up/Down Arrow keys to increase or decrease volume.
The massive use of design frameworks opens big questions in terms of originality.
Is their use killing diversity? Are we going to see mold-like websites and apps?
Let’s see how to take advantage of these frameworks while enhancing our diversity
Preserving web diversity
Focus on features
An interface should let users deal with your product properly, a natural reflection of what your product’s features are. Don’t pretend to be unique from an interface point of view if your product isn’t. Who else could use a bird as a button? This feature makes Twitter unique. When designing a new interface is relevant to define what are the distinctive features that are worth to enhance from a User Interface perspective.
Focus on content
We as humans are different but still share a very similar physical structure made of bones. The framework should act as a skeleton- be as useful as unvisible from the outside. Focus on creating amazing images, illustrations and videos to say the world who you are and why you are different. Heartbeats is an interactive experience that moves to the rhythm of your heartbeat. They focus on a simple illustrative language that enhance the overall experience.
Focus on details
A little interaction can make your product unique. Are you familiar with Periscopes floating emoticons? (now we have them on facebook live too -_-) Or with how on Mac OS apps are literally dissolving when dragged out from the dock? These are the details that make me fall in love with a product.
Uniqueness is probably one of the most important values we as people and companies should strive to preserve and promote.
I believe that frameworks are a big help when it comes to creating something new. They let us push the boundaries by focusing on what is really important without having to reinvent the wheel over and over again.
Uniqueness is probably one of the most important values we as people and companies should strive to preserve and promote.
On one hand their use is a big advantage in terms of process, but on the other hand, higher accessible standards also mean new challenges for designers. Users today expect the responsiveness and smoothness of an Apple or Google designed product, the ease of using Uber: this means that every detail matters.
If we want to match these new growing standards we should then go beyond the mere interface by thinking deeper about what our distinctive values are. We should consider the overall user experience to make it unique and emerge from the mass.
Will design framework kill web diversity? Maybe, but it would only be our fault.
