The Project Requirements
The GCI sales team needed a mobile application that allowed them to search, display and send sales materials including PDFs, videos, and images to potential clients. They also needed to manage hundreds of documents, work offline, and sync those documents with a content management system (CMS) that housed the files. Above all though, they needed an application that could wrap all this functionality into an intuitive and easy-to-navigate interface.
The “Zen Garden” Design Challenge
With the requirements set, we dove into pushing pixels. The biggest design challenge was to come up with a navigation flow that allowed different user roles to quickly filter potentially hundreds of different documents. The client also expressed the need for a simple navigation solution to return users back to their “Zen Garden” as they called it. In other words, if a user got “lost” in the filtering process and just wanted a reset, they could click a button that would make things all right and take them back to the beginning.
We researched a number of mobile application designs and went through several internal and eventually external rounds of design. The final product absorbed all we learned to create a navigation flow that clearly steps a user through the filtering and selection process but also allows them to quickly go back to their “Zen Garden”:
Bridging the Development Gap
Development began on the application as soon as we had the requirements. Normally we wait for designs to be complete, but there was a lot to get started on that didn’t require design. There was one technical requirement above all others though that drastically changed how this application was to be developed. All of the aforementioned requirement challenges could be solved by leveraging existing web technologies except for one—working offline.
Using native web file storing technologies for storing the various documents being pulled from the CMS would not suffice due to the shear size and number of files that were required. This single requirement pushed us to look for a more native mobile application solution. We knew that given our timeline and resources, a full blown native iOS application would be out of the question. Enter PhoneGap.
Although PhoneGap proved to be the right technology fit for the project, it did come with a few of its own challenges. PhoneGap essentially wraps around a browser view on your mobile device. This means that you are stuck with similar limitations afforded to viewing webpages using Safari in iOS. One issue in particular had to do with being able to display a list of over a hundred files and have it responsively scroll. Without the same hardware muscle as a laptop, this caused a few performance and memory issues on the iPad early on but were fixed by limiting the number of CSS animations, shadows and glow effects. It was a good lesson learned in balancing design and performance.
Several weeks after the launch of the application we received a phone call from the client. Despite all the hours of testing, we immediately assumed something was wrong and wondered what it could possibly be. However, the call was to simply tell us how happy they were with the application and that they had successfully converted their sales team into using it—they had found their “Zen Garden”. We love calls like that.