In 2016, SurveyMonkey released a redesigned mobile version of our webpage. We have seen a marked improvement in the user experience on mobile devices that we wanted to share what we did and what will come in the future.
Why did we build a mobile site?
Over 25% of users signing up for our services are doing so on a mobile device and the numbers are growing.
We didn’t just want to give users a responsive site, but a site designed for use on a mobile device. We took in mind space, speed, and internet connectivity limitations. The mobile site offers users improved navigation, a new layout, and a streamlined, mobile-tailored feature set. To check it out, just sign in to surveymonkey.com on your mobile device.
How did we build our mobile site?
First, it is the most performant of the popular frameworks
This is extremely important when using mobile devices. Google found that 53% of users will abandon your site if it takes longer than 3 seconds to load.
React also has an active open source community. The community is continually improving and adding to the ecosystem by developing tools, libraries and best practices. In addition, React is easy to get up and running.
For large applications, state can become difficult to control. Redux has made this simple. We have one “store” that centralizes the state of the application. Anytime we want to change the state — for instance, if a user changes their account preference — we call an action to update the state. Redux is a great library that has simplified a lot of the issues with Flux (the original state management library developed by Facebook).
How does our mobile site work?
- Moving around the mobile site is fluid and snappy. Thanks to React-Router, the user can navigate around without needing to reload the page. We fetch only data that is needed for the current page, and if we already have that data we don’t fetch it again.
Our mobile site feels so much like an app that it’s easy to forget it isn’t. Take a look at our Android app versus our mobile site. Can you tell the difference?
Well if you can’t, don’t feel bad because it is actually the same code! That’s right, we reuse our React code for both our iOS and Android apps.
Old vs. New
The new experience increases mobile conversion rate by 50% and survey deploy rate by 43% in our english speaking countries. Before our redesign, users would have to pinch and zoom to navigate and create surveys. Now you can easily navigate between pages and create surveys on the go. Here is a look at what the mobile experience used to look like versus now:
What will the future bring?