Use research, visual and interaction design.
Wego is an online travel search engine company. In this project, I led the project and designed the dark mode for Wego mobile apps.
Unfortunately, the travel industry plummeted due to the COVID-19 outbreak. At that time, after launching this feature we weren't able to get any decent result.
The majority of Wego users are Muslim travelers based in the Middle East, North Africa, and Southeast Asia.
As Muslims, they need to do their prayers 5 times a day while facing towards the "Qibla", a direction in which the city of Mecca is located.
In this project, we want to help users to plan their itineraries around their prayer timings, so they can travel with ease and not miss their prayers.
Users are able to check prayer times in their destination city, locate Mosques around them, and choose the best flights for them so they won't miss any prayers.
Before designing this project, I need to find a positive value for users to open Wego app. As a Muslim myself, I have another app dedicated to solve this problem. So if it's just another prayer times and qibla finder widget, it wouldn't be very helpful, just a nice-to-have.
Most Muslims would already have a prayer times and qibla finder app on their phones, it is a necessity. So how do we make this feature different from those apps? Why would they open Wego, instead of those apps?
Despite the positive impact this feature would have for Muslim travelers, we also need to think about how this feature could affect our non-Muslim users.
I interviewed around 10+ Muslim travelers from Indonesia, Singapore, Iran, Bahrain, and Dubai. The user archetypes are people who travel in groups, business travelers, and solo travelers, in which they travel at least 1 time a year.
We asked questions to understand their travel behaviors related to their prayers. The purpose is to find a real value that we can give to our users so this feature won't be just a nice-to-have.
When Muslim travelers are planning their trip, they find it hard to fit in their prayer schedule to the itinerary. The reason is simply because it's too much work to search for the prayer times of each city they want to visit and put them in the itinerary. They need an easier way to do this.
Muslims have some set of prayer rules and conditions. There are certain time window that they can't miss.
Which means they also need to plan their flights properly: what time do they fly, what time do they arrive, how many prayers do they have to do on the plane, and how will they pray around those flight times.
When they travel, due to the timezone differences, it's easy to miss the prayer time window. In their travels they need to understand how much time to they have left until the next prayer time.
In some cases, they ended up missing their prayers, because of the tour itineraries, or they simply couldn't find a place to pray nearby.
Instead of making this just a simple Prayer times and Qibla finder, I want to take this opportunity to make Wego on top of Muslim traveler's mind.
User should be able to start planning their trip in our app and enjoy their trip with the help of Wego.
One of the fun part of this project was designing a bunch of different timetable styles for the prayer times. I took inspiration from some apps that has a clock/time interface on their widget. In the timetable, I also added an indicator which highlights the next prayer time.
Although the majority of our users are Muslims, we still need to address what would happen if a non-Muslim user encounter the widget.
Upon opening the app, user may choose to keep or remove the Muslim Prayer Times widget. If in the future a user wants to activate the widget, they can activate the widget from the accounts page.
I want to create a Qibla finder that is not just a normal compass, but also intuitive and gives a helpful feedback. For this, I used haptic feedback and background color change as a positive response.
The interaction for the compass needs to feel intuitive and helpful. I played around in Protopie and made a prototype of the qibla finder. Below is the full-page version of the feature.
With just a green highlight, the next prayer time is not that easy to understand. They couldn't understand whether the highlighted color mean current prayer time or next prayer time.
Even though we already designed the prayer time and qibla finder, people thought it would be more helpful if we can indicate the prayer time in the flight schedule. However this time, it is out of our project scope.
Prayer times are based on the movement of the sun. Most similar apps use progress indicators to show the movement of the sun. However, as we are showing the widget in the homepage, we need a simple but effective way of doing this.
I improved the widget by adding a countdown timer to the next prayer. It is self explanatory and has a connection to the prayer times above the text.
When I were testing the prototype, the dev mentioned that on some mobile phones, we may need to calibrate the compass before we can get an accurate compass direction.
Based on that feedback, I made an improvement to the compass by giving users a suggestion to calibrate their compass to get better accuracy. I also made an illustration of how they should do the calibration process.
Unfortunately, the travel industry plummeted due to the COVID-19 outbreak. After launching this feature we weren't able to get any decent result. 2 years later in 2022, I went to Vietnam and finally had the chance to use this feature. I think it's pretty nice, but not that useful since I already have another app dedicated for this.
This project started as an open discussion in Slack: "What if we make a prayer times and qibla finder for Ramadan?"
At the beginning, this project was just a "seasonal gimmick" for Muslim users during the Muslim's holy month of Ramadan. But the research that we did managed to expand the feature further into something that would be valuable to Muslim travelers.
Without gathering any feedback from our users, we might have ended up with just a nice-to-have instead of a valuable feature.
In this project, I made some prototypes using ProtoPie. I shared the prototype to the stakeholders and convinced them on the vision that I imagined. The prototype helped us to get on the same page and to share the feedback they have about the design.
With the prototype, I was also able show them what I meant by "giving a helpful feedback to user when they found the Qibla direction". By using a fully-functional compass in ProtoPie and have them try it on.
Improving the likeliness of conversion by making discounts more achievable and less demanding.