The website was launched long time ago and over time many things were added or changed. Sometimes not for the better. For example, users simply didn’t understand how exactly CityBee works. Or how much it costs to use. Major rethinking of the whole user experiece was needed.
To understand how the old website is used, we took a deep dive into CityBee’s Google Analytics data. Here’s what we found:
New visitors spend little time getting to know the service and leave the site quite soon. This means that website is failing to communicate and engage the users.
Returning visitors spend a lot time reading FAQs and pricing. And huge amount of them leave right after. This, again, indicates failure to clearly and effectively communicate pricing and other terms to the user.
Returning visitors make up the majority, yet there is no additional value on the website for them.
New users spend more time on the website if they use a mobile device.
The challenges. Most users struggled to find what CityBee is and how it works. Users didn’t understand the pricing. Some even made a false conclusion that if you keep your trips short (under 50 km), the service is free. It took a long time for users to find out how to use the service. Unlocking the car, starting the engine, turning on lights.
Users could be more encouraged to watch the video. A better method of explaining the user how much would a real life trip cost. Proactively educating the user about certains aspects of the service to help avoid bad UX. Valuable content for returning visitors to help them get the most out of the service. Better tools to help users find the best car for their needs. Better tools to easily find answer to their question.
The biggest priority was educating visitors and users about the service, teaching them how to use it, helping them avoid issues and other unpleasant situations. Many iterations of the prototype were created and each version.
To create the prototype, Sketch and Craft plugin with Invision were used.
The new version relies heavily on bright colours, illustrations, icons and photos. The new visual style was designed to communicate that CityBee is user-friendly and easy to use.
Know the price of your trip
To better explain how pricing of the service works, a new functionality was introduced. It’s an interactive tool that calculates how much would a real life trip with Citybee cost. User only has to pick a destination and starting point. The calculator will then show the best route on the map and show the price of the trip, even taking traffic into the account.
The calculator is design have as few steps as possible. It only asks you to pick your point A and B. It doesn’t ask you to select a car, it just uses the cheapest one by default. But what if you don’t want the cheapest car? What if you want a Mini for the weekend and you need to know what that would cost?
You can choose the default car to any car CityBee offers! You can also tell the calculator that you’re gonna be keeping the car for 24 hours or even more. You can even add additional destination points, like shopping malls, train stations and other points of interest.
Categories by use cases
CityBee has a lot of different cars. Some of them are very compact, some are electric, some have retractable roofs. For anyone who is not a car person, it is quite difficult to understand what all these different models are for.
So the new version now categorises cars by usage. For example, cars for comfortable trips out of town, cars to move big and heavy things like furniture.
Filter cars by features
Sometimes users have very specific needs. For that a feature filter was introduced in the new version. Users can now toggle features that are important to them and the car list will update automatically, only showing cars that match user’s criteria.