Case Study: Shared Mobility City Index

The Shared Mobility City Index, or SMCI, is an interactive website, allowing users to explore city data, and how cities compare to each other based on certain shared mobility criteria.

Visit the Shared Mobility City Index

Team

My role in the project was UX design and web development. The data for the cities, content, and city reports were created by Sandra and Sigrun from movmi, and David and Julie from Inov360.

Setting Up a Shared Mobility Service

One of the first steps in starting up a shared mobility business is researching strengths and weaknesses of potential cities to start your car or bike share in. Without many accessible resources, this is a time consuming process.

To save many people time and energy doing all the research themselves, we wanted to create an easy to use tool, allowing visitors to interact with city data, as an easy starting point for their research.

Who Would Use It?

The SMCI targets two different groups. Entrepreneurs looking to start their own shared mobility company, and city mangers or planners, visiting the site to gain insight on how to attract and sustain shared mobility services.

SMCI Sketches and Early Wireframing

The UX Process

I wanted to avoid someone coming to the website and becoming confused by all the information on the page. So I created a specific hierarchy of information so that instead of being overwhelmed, the user is eased into the experience. They can interact and explore the data, before scrolling down to access the information on research and city criteria.

Each city is complex, with it’s own set of data, so for the end user, finding what is relevant to them is important. I wanted to simplify as much as I could without leaving out any functionality. It would make the user’s life easier if they got to interact with a map, and have that map dynamically display information about the cities they were interacting with.

The Product — Dynamic and Interactive

Using Google Maps API and AngularJS, the data from each city can be visualized dynamically on a map and interacted with. This would eliminate frustrations of a user not finding relevant information. It also adds an element of exploration. Interacting with a map is much more fun and engaging than looking at a map with some data on it.

Learning Technologies

At the beginning of this project, I didn’t know how to use AngularJS or the Google Maps Javascript API. I knew that both these technologies could provide value with interactivity and dynamic visualizations, so I challenged myself to learn them. It was exciting and sometimes frustrating, but in the end I was proud of myself and the results it produced.

Launch

The SMCI launched at a the City Car Summit in Berlin, where a live demo was presented to panel attendees. The week leading up to the launch was a crash course in bug testing and dev ops. I had a couple late nights trying to find solutions to the problems, but learning a lot in that time. I have gained some insights on how to prevent some of the issues from happening again and how to prepare for the unexpected ones.

The launch was successful with about 300 unique users accessing the page with a bounce rate of 60% to access the contact form to request more information.

Google Material Design and In Depth Reports

The SMCI is a product that is changing and evolving. Every year changes are happening to shared mobility, allowing new things to be added. Our team had the opportunity to provide detailed city reports to our users. I added this using Stripe, and also took this opportunity to learn about Google’s material design philosophy. I took the existing design of the SMCI and updated it to use material design elements like the colour schemes and card depth.

Please reach out if you have any questions or comments, you can connect with me on twitter or by email: albert.jordan.coil@gmail.com

Jordan is a UX Designer and Web Developer, recently graduated looking to start his career creating useful and engaging work.