6 Lessons learnt making our expired domains web app responsive

A few months back we decided to change our expired domain web app with the intention of making it look good on all devices. Since DomCop primarily comprises of software programmers who do not possess much design sense, we decided to buy a responsive theme and use it. Following are six lessons which we learned courtesy this decision

1. Don’t underestimate the time for becoming responsive
Since in previous projects all it took was a couple of days to change the theme on a web app, we figured it would be the same this time too. However, our estimation could not have been more off the mark. While changing the theme did not take much time, ensuring that the web app looked good on all devices took two weeks to accomplish.

2. Start with responsiveness in mind
If we were to build a new project from scratch, responsiveness would have been a top factor right from the start. To make an already existing site responsive is a much tougher task than starting with a responsive design.

3. Research themes to see what works and test before you start integrating
We bought the awesome Aces Admin theme from WrapBootstrap. Luckily for us the Aces Admin theme is truly compatible with datatables, a jquery plugin that DomCop uses extensively. If you are planning to do the same, spend time listing down all your UI elements and test whether the theme supports them.

4. Have multiple devices ready for testing
We started with a laptop and an android phone and the testing process came to an end with an additional iPhone, ipad and android tablet. It is amazing how the same UI element can appear different on each device.

5. Users will hate any major change – anticipate it and set expectations
You have just replaced the crappy looking theme on your web app with this super cool twitter bootstrap based responsive version and expect everyone to love it, right? Totally Wrong! It turns out that users are averse to change even though it is for the better. Our users had established an emotional connect with the old black and green theme. So when we changed it to white and blue, they hated it. To this effect, we would advise limiting UI changes to being as small and incremental as possible. However, if you are planning to change the entire theme in one go, be prepared for a backlash.

6. Learn about how responsive design works before you start
We had not worked with bootstrap before and in retrospect reading through some tutorials would have saved us time while making changes. Bootstrap is awesome, especially version 3.0, and it handles responsiveness really well. Now that we know how it works, everything just seems to make sense unlike when we started out.