Designing for Multiple Screens: The Evolution of Responsive DesignBack to articles

Designing for Multiple Screens: The Evolution of Responsive Design

December 18, 2012 2:31 pm

Ever since computers and electronics became popular devices, there has always been a form of disparity and grouping within them called a platform. This was a specific series of machines of a unique type that ran a specific system and software. This was primarily CPU architecture, but to a wider extent, depended on operating system itself.


The 21st century has a new kind of platform disparity replacing the old, and that is all about device niche and screen size in combination. CPU architectures still exist, and varying operating systems do as well, but as programming gets more sophisticated, publishing a single application one time for multiple architectures and operating systems is so easy and common as to render them moot.


As this increased system and architecture independence grows, and cloud and SaaS which are inherently platform independent, grow in popularity, the new platform disparity is more about solving multiple device shapes, interfaces and screen sizes into the equation.


Screen size is usually directly affected by the purpose of the device. Desktop or laptop screens are going to be larger, and so a traditional design methodology is going to work with them if they are the only target. If one is aiming for lower screen sizes too, then wise use of empty space on the larger screens is a complicated and involved application of good aesthetic logic.


When aiming for a series of smaller device sizes, tablet to smaller mobile, there is less real estate. This means that a paged interface not unlike mobile systems already use, is going to be the best layout scheme. Not crowding the controls will be important as the smaller the screen is, the more likely it is to be very touch dependent.


Scaling for these displays so that they can actively work with too much real estate as a large screen system, and can work with limited space and be touch friendly on smaller devices is a tricky matter. Factoring in that aesthetics should be aimed for as well, this results in a need to design a very responsive and scalable design.


Visual components would have to be sliced and arranged so they could tile and repeat, for the enclosure of the app to attractively scale on width and height. Dynamic, algorithmically controlled component placement must be implemented that spaces and sorts the controls at the right ratios.


Further higher logic will become necessary to reposition some things entirely if certain size thresholds are either reached or below. As a result, the interface has to be very dynamic and compartmentalized, and easy to reconfigure without the interface breaking or changing logic to accommodate this.


As a result, responsive design in the future is going to have to continue to evolve into a more dynamic and very easy to implement form of logic that allows for flowing dynamic interface like this. Likewise, GUI conventions will have to increase their centrism to this design convention so that both are met half way and a stable responsive design capable of overcoming screen differential will just be second nature.


For the time being, it just means that responsive design takes some elbow grease. This excuses nobody for not taking the effort.