Emergency Call for Responsive Design

Frank Paepens
2 min readJan 17, 2019

What is Responsive Design? Responsive Design is making sure that app-pages show well on both big screens (think desktop PC’s & laptops) as well as on smaller screens (smartphones).

For instance, in the image below you see on the left side a product form that shows correct on a big screen. On the right side you see the same form shown on a mobile device:

No Responsive Design

Basically it was developed for bigger screens (see below). But when scaled down to mobile phone sizes it becomes useless & messy!

In the next image, you see a reworked version (on the right side) of the same form for mobile devices:

Responsive Design

Notice that our designer replaced the text in the tabs with icons and that all inputs are in 1 column (only for the mobile version).

And that is exactly what responsive design is all about: thinking upfront how a design should adapt to different screen sizes or to the orientation of the screen (portrait/landscape).

Now you still wonder why “Emergency Call” is in the title: many companies are paying to develop a Web App, only to find out at the end that their App is NOT Responsive. So: make sure to put “Responsive Design” in your initial requirements! At Appdnd we test our designs for every project on all screen sizes, but we regularly have to make quotes to fix these issues for already finished projects.

You can read more about Responsive Design on our blog.

This post first appeared on the Appdnd blog at https://appdnd.com

--

--

Frank Paepens

Partner at Appdnd: agency specialized in App Design & Development. Interests: technology, startups, travel & watersports.