SurveyCTO Web App

SurveyCTO is a field-tested technology platform that helps its clients collect data using mobile phones, tablets, or PCs. It is used by thousands of users in more than 130 countries for high-quality data collection.

SurveyCTO asked us to help them develop a front end interface for their upcoming web application. It was a very challenging job. Many UIs had to be very complex and our task was to find a way to present this data to users in a non-convoluted way. Data types we had to work with were very diverse. It included numerous forms, lists, reports, graphs, images, audio, and video data. Application UI should provide smooth user experience on multiple types of devices with various screen resolutions.

However, we like to be challenged and thus gladly accepted this offer. We did a careful research on what type of UI would be the most appropriate in every particular case. Interface solutions were tested on groups of selected users. Only if these tests were successful those UIs were accepted for production use. If we, or SurveyCTO users, were not completely satisfied with how some particular screen looked and behaved, we were going back to the drawing board until returned with better solution.

Since this should be a responsive, mobile first web app, all interface elements were carefully tested on several devices with different screen sizes. We did not hesitate to create multiple versions of the same UI element if it was necessary. One was used for small screens and finger input, and the other one was chosen as a best fit for desktop environment.

We designed and tested user interfaces for Server Administration Console, Form Designer, Data Explorer, Web Collect and Submission Details modules and many other parts of this extensive web application. In cooperation with other members of SurveyCTO team we developed many UI modules in JavaScript, HTML5 and CSS3. It was a complex task since we have to provide smooth user experience with large data volumes transferred over connections that can be far from perfect. To mitigate this, we used extensive data caching using IndexedDB and local storage. We developed a Java encryption compatible JavaScript decryption module. It provided seamless compatibility with back end server that was written in Java. There were many other challenging tasks in this project, but we were able to solve all of them successfully.

If you are interested in what SurveyCTO does and how it works, you can check their official video guide. It shows many UIs that we’ve created in much more details that we are able to show here: blog.surveycto.com. As Japanese are saying, "Seeing for oneself is far better than hearing about something."

It was a very challenging yet interesting and satisfying project. It was a great pleasure for us to work with SurveyCTO and we are immensely grateful to the company that they invited us to participate in this project.