Last updated at Thu, 31 Aug 2017 14:13:25 GMT

Responsive Design has been a buzzword for quite some time now. According to Google, this blog post just became one of the 158,000,000 articles you can find when you search the phrase; so what's there left to talk about?

What Is Responsive Design?

When you search the phrase Responsive Design, you'll notice the search engine kindly reminds you that the term should be Responsive Web Design (RWD). Sure, the notion of device-based design didn't start blooming until browsers began to support different viewpoints. Especially with the exponential Mobile growth over the last decade, it seems only logical to present your design for different screen sizes in order to provide a better user experience across media. But what if I told you responsive design is much more than that, and we've been doing it for hundreds of years?

(Image credit: Wikipedia)

Think Content

Newspaper editors put the most exciting pieces above the fold to entice the sales because how newspapers are folded and displayed; magazine editors promote their issues by producing stunning imageries on spreads and foldouts. They are not limited by their canvas and they don't dwell on the parts that will be hidden, instead, they figure out ways to put the most important contents front and center for their readers. To design and convey your message loud and clear beyond media constrains, that to me is the essential of responsive-goodness.

(Image credit: Google Image)

Web Has NO Borders

It is human nature to always push the limits of the canvas to express their creativities to the maximum, but interestingly enough, we tend to draw ourselves a box when there are less limits (to feel more in control, perhaps?). Take web design for example, width and height are not native to web, yet we discuss more around physical screen sizes, device diversity, and pixel density more than anything else. Don't get me wrong, these are all valid factors to take into considerations for us to provide seamless experience for our audience across the board, but we also need to remind ourselves to put the spot light back on the contents.

Mobile First = Content Focus

Since we moved from desktops to laptops and now to mobile devices, we had a habit of designing for the bigger screens first then strip out the less important pieces and stuff whatever we can fit into the smaller ones. However, this approach causes many issues, the main one being users don't get the full experience when they lose certain contents, and it didn't take long for the Mobile First approach come into play. The Mobile First strategy was often explained to design the full experience for the most limited surface then gradually add to it when space is more flexible. This totally makes more sense, right? Well, not really.

By either adding or subtracting contents, you're giving your audience an inconsistent experience by deciding for them what are and are not important. Moreover, if you think certain things can be removed on certain devices without affecting the overall experience, wouldn't you say it should be fine to remove them altogether?

Don't let the term mislead you. Mobile First is about designing for focus, and we need to define priority, not layout.

(Image credit: Wells Fargo)

Don't Be Afraid to Re-Write Your Content

Content is the key, and responsive design is all about how you prioritize it. it's absolutely valuable and crucial to invest some time into content inventory and audit; examine between what you want to say, what you're actually showing, and what your audience really want to see. If your contents don't make much sense anymore, don't be afraid to re-write them, either. Rapid7 products collect, process, and produce huge amount of data, and the UX team takes the Responsive Design principle to the heart and we constantly analyze and evaluate what we present to our customers to ensure the quality of user experience.

Be Truly Interactive!

Last but not least, I would like to share with you a quote from two interactive architects: “A truly interactive system is a multiple-loop system in which one enters into a conversation; a continual and constructive information exchange.”—Michael Fox & Miles Kemp

I encourage you to watch this video of Interactive Wall when you have a few minutes. If architects can break the physical constrains and bring the human-space interaction to a whole 'nother level, imagine the exciting future we are heading!


Marilyn Chao

Level-One Human Behavior Observer