Travel booking app
Case study by Alexander Murashko
In 2012 I joined anywayanyday to work on new lineup of company’s mobile apps.
Anywayanyday.com is one of the leading online travel booking services in Russia. In 2012 it was holding the 4th place in Forbes list of Russian web companies.
At first I joined the mobile development team as an Interaction Designer. Then I took a role of Lead Designer, directing and managing the design team. We worked on the website and created apps for all major mobile platforms.
Anywayanyday got awards for its website, and our mobile apps were featured multiple times in their app markets. iOS app for iPhone and iPad was in top of App Store in 2013. Android app acquired more than 1 million users and was featured as best of Google Play in 2013 & 2014. Windows Phone app was featured by Nokia as best for Lumia.
This case study covers a design process for anywayanyday iPad app.
At the time the company had a web app for booking tickets online, iPhone app and Android app for phones. The task was to create a tablet app for iPad, providing the tool for travel booking with best user experience.
The mission of anywayanyday is to help people travel independently. The company’s products’ job be done is to give people a tool for booking and managing their flights, hotels and other travel services worldwide.
At the start of project a small work group was formed to figure out the interaction model for the new iPad app. At first there was an Art Director leading the product, and when he left the company I took over as the Lead Designer.
The team had a good knowledge of our customers, their job stories. Anywayanyday’s products had a well established user flow for fast flights and hotels booking. This established user flow is a service’s advantage as it provides a good overall user experience. On the other hand it is a liability as it enforces certain restrictions on product’s interaction model.
Designing the interaction model
After spending many days sketching on paper and holding stormy discussions, after few iterations the team agreed on a final version of app’s interaction model. I created wireframes to specify the user interface. Wireframes featured full interface structure and visual hierarchy to facilitate the design process.
The final mockups featured classic skeuomorphic tool bars, deep shadows and embossed buttons.
…and then Apple revealed iOS 7.
Working with a new visual language
By this time the design team migrated from using Adobe Illustrator to doing all the UI work in Sketch. It drastically speeded up the design process.
We tossed out outdated mockups, researched Apple’s new design language and started to work on key parts of the app. As a Lead Designer I was working hands on, designing the final mockups and all the UX deliverables.
Besides creating new visuals we spent quite a lot of time getting all the interactions right.
We collaborated with our developers and QA engineers in order to build the real product. We discussed the design ideas, tested and reviewed the implementation. Along the way we created various deliverables to specify the design ideas: UI kit, animations of some interface parts, user flow diagrams, UI specifications for complex components.
Anywayanyday booking service has a lot of legacy systems. Therefore the team met strict restrictions from the software backend standpoint. So sometimes there was no way to redesign something from scratch. We had to work closely with the dev team to hack the system in order to enhance the user experience the way we wanted.
Detailed route on the world map
After inputing flight destinations and dates on the search screen the user can see his route on the world map.
Anywayanyday can search flights not only for one-way or round trips, but also supports complex trips with multiple destinations. We developed visualisation even for the most complex routes, tuned the animations and added extra layer of information by showing the weather, time zones and currency at the destination cities along the route.
Anywayanyday app features voice input for flights search that is very useful on the go.
Developing this feature was quite a challenge. We worked closely with the developer on the flow of the UI, handling all the exceptions, tuned the animations. We had to get all the things right to deliver great user experience for voice search.
Launch in the App Store
Anywayanyday iPad app launched in the App Store in April 2014.
Later it was short-listed on the International World Summit Award Mobile 2014, Digital Communications Awards 2015 and won Apps Awards 2015 in “Best B2C solution”.
The project took about 7 months of work. The design team produced 213 iPad screen mockups (for iOS 7 version alone), few interface animation videos, huge amount of graphic assets. At different stages the project took countless man-hours of work of two designers, a product owner, three iOS developers, two QA engineers and two project managers.
And that is just for the flight booking part of the app. The work on the hotel booking part of the app lay ahead.
After the app’s launch the dev team took some time for refactoring and assuring the quality of the app. The product owner and the design team were waiting for the integration of analytics tools to be able to monitor product’s metrics and test some design ideas.
Meanwhile our design team started working on the hotel booking section of the app. We thought through the UI framework and designed key parts of the interface. However business priorities changed, and the development of the hotel booking was stopped.