Case Study: Design Hackathon

Vishnu pandey
Bootcamp
Published in
15 min readJul 24, 2022

A 48-hour hackathon where we redesign OYO for better Average order Value and increase conversion.

This was 48 hours of design hackathon where we were given problem statements with business metrics attached to them. Our job was to redesign the app or the flow to impact the business metrics in a positive way.

About the team-

We were a team of 7 UX designers, a few of us were working for real companies and the rest were learning UX design. We decided to do an ice breaker and introduction section to know each other and get comfortable. Initially, we also decided on a sleep and rest cycle to reduce exhaustion and maintain productivity.

The Race started-

The hackathon started, and we were happy that we are comfortable with each other now all our planning and work will be smooth. We all were UX designers and were open to criticism, perspective and learning new things.

Meet the team

The team was really amazing as everyone was ready to learn and get a new perspective.

We were given multiple business problem statements to choose from, we had 10 mins to choose. We all mutually decided to go for OYO, as a surprise I found out that none of us have ever worked on any evaluative design projects before. Anyhow the team decided to go for OYO.

Problem statement-

Evaluate the loyalty program (OYO wizard) flow of OYO, from the Home screen, Wizard plans to the checkout page and redesign the experience while identifying opportunities to make usability better for unmarried people under the age of 30 which will lead to an Increase Average order value and increase conversion.

Reasons to pick the problem -The target user base was relatable.

  • Familiar and good UX of the app in general so it seemed challenging to improvise
  • We were not unaware of the Oyo wizard feature, so it was intriguing to work on.
  • Business metric seemed like a very interesting and useful metric to work on
  • Working on a loyalty program was challenging and exciting at the same time.

Plan of action- we break down the problem statement into multiple tasks and decided who will do what.

I was really confident about UX research, heuristics, problem identification, ideation, hypothesis, secondary research, ideation, and wireframe.

I was really excited to learn more about UI design, prototyping and iteration.

Plan of action

To keep ourselves on track we decided on our goals and stick with them till the end

  1. Pitch the wizard to more users, basically attracting users to buy the wizard plan.
  2. If we were able to sell more wizard plans we will be impacting AOV because Wizard plans by OYO are there to increase AOV, and by increasing the users buying wizard plan will ultimately the business will be impacted.

In a group activity, we decided to break down the statement which will help us to understand the problem statement in detail. We came up with the following

Problems identified during Self-Heuristic Evaluation

My individual contribution was that I facilitated the team and break down the tasks further, deciding what everyone will do.

We evaluated the 10 heuristic principles on each screen, following the flow of buying the wizard plans. Finally, we identified the following problems wrt missing heuristics:

  • Visibility of system status: Users can not differentiate between the Wizard plan on the homepage and the get a free room by referencing.
  • Consistency and Standard: The ticks on the wizard plan are confusing.
  • the blue- ticks seem as if they are selected in the default state.
  • sliver- ticks appear as if they are not selected
  • Match between system and the real world: The wizard Plan contains jargon words like Partner, Relevance of super discount coupon in is not well explained which causes curiosity to the user and they have to search for an explanation in the information button which can demotivate the user to eventually buy the program as the process seems too tedious
  • Match between system and the real world: Use case inconsistency-
  • Wizard-lite and wizard are two terms that indicate two offers but in reality, it offers only one plan for the IOS users causing frustration for the user and misguiding them
  • For android shows a different plan when clicking wizard lite(lite option is unavailable)
  • Visibility of system status: Wizard plan does not show the status of steps ( how many steps the user is away from purchasing the plan)
  • Recognition rather than recall: Users cannot avail the offers by directly tapping on it. In order to avail of an offer, customer has to go to the offer card and memorize the coupon code (which is more than 5 letters) and then fill it which can cause them to lose interest.
  • lack of copying the offer
  • lacks error prevention
  • use case- users have to remember the coupon code/ Oyo code and then proceed to the next page.
  • Aesthetic and minimalist design: The offer section in the payment section is not clickable, the user has to go to view all then only the user can select the offer. The offer has a common region also.
  • Flexibility and efficiency of use: Too many offers can cause users overwhelming

Problems identified during the intuition-based evaluation

I step down in this part and took tasks in this activity, here we analyzed the flow and identified what was wrong based on our intuitions, also this was a team activity where we identified problems and gave reasons behind them.

(problem breakdown)

FLOW 1- Through the hamburger menu (become OYO wizard Option)

  • It takes users to a page that does not show anything about the different plans or options and you cannot apply from there.
  • There is no connection that leads to the wizard plans page, showing the available plans
  • Only a small question saying “how to avail oyo wizard”
  • Very cluttered and only textual display of information
  • Misleading information
  • Seems unnecessary and not required, it’s just like a simple info page, if it’s there it should be connected to the wizard plans page

FLOW 2- Through all-new wizard cards displayed on the home screen

  • Earn a free stay using referrals and get a free stay through wizard are confusing options one below the other
  • One has to scroll down to find Oyo wizard option . Less visibility will lead to less conversions.
  • CTA Button has too much information which can increase the decision-taking time of the user.
  • info and terms and conditions too cluttered
  • users usually don’t focus on any additional membership plan that’s being shown separately
  • too much text on the wizard plans page and

FLOW 3- Through directly seeing the option of applying wizard during the checkout/while browsing if a hotel has a wizard

  • There’s no way to check which hotels have wizards directly, you have to browse through all of them

Hypothesis Statement

At this point, I made 2–3 hypotheses based on heuristics and intuition based, but as a team, we decided to focus on hypotheses on usability issues rather than UI issues

  1. My hypothesis is that we should increase the visibility of the plan, and give the user subtle prompts throughout their journey of making a booking by showing them the advantages they’ll have on using Wizard. Or tempt them with exclusive discounts available only through the wizard on luxury stays etc assuming that the user has less knowledge about the plan and finds it relevant to buy (make it relevant to them)
  2. My hypothesis is we can use better ways of visual communication to ensure that the user is not confused about the state of the program and is able to figure out the benefits for them assuming due to bad communication they are not able to understand plans.

Secondary Research Insights

I was actively involved in this phase, here I was looking at behaviour and factual data. In this part, I was going through articles and case studies from trusted news outlets and other sources.

  1. There are no options to personalize the offer according to their comfort: Personalized recommendations to a subscriber
  2. Customers earn rewards for each purchase based on a traditional point system. The innovative part is that members can choose how to use their reward points.
  3. Designed for the frequent traveler in India, Wizard will also offer up to a 10% discount on OYO’s Wizard hotels across India, and a lot more. This summer, Oyo witnessed two record-breaking festive weekend bookings in April 2022. Over the Good Friday and Vishu week, Oyo clocked in 8 lakh bookings, the highest ever in 2022, surpassing the new Year, which is usually a high-demand holiday, according to a statement issued by the company.
  4. For Wizard hotels, in particular, 70% of transactions by members are made on these hotels, resulting in higher income as compared to non-Wizard hotels. Thus, making the paid program extremely beneficial to both guests and hotels,” mentioned the company’s press statement.

Presently, OYO Wizard is available in three variants- Wizard Blue (Rs 99 for 6 months), Wizard Silver (Rs 199 for 1 year), and Wizard Gold (Rs 399 for 2 years).

5. Hotel chain OYO announced the launch of OYO Wizard, a new membership program designed to recognize and reward frequent customers

6. The community where their customers can share product feedback and ideas, chat about related topics (financial news, fintech, and all things money), and even share insights on their competitors. (we have improvised on this part for social proofing)

7. A loyalty program is a strategy in which a company provides its customers with rewards and discounts for being loyal. It helps businesses retain existing customers and increase product sales.

Insights from competitor research.

I was actively involved in studying Agoda and Fabhotels, the flow and the loyalty program, and what do they do to hook people into their loyalty programs.

We got ourselves divided into teams and started working on this, the other team was working on documenting the insights simultaneously to save time and be more productive at same time.

  1. Fabhotels: It has an Offer tab on the bottom nav bar, Easy access to offers and a loyalty screen. First, ask for check-in and checkout time which gives the user more control.
  2. Bag2bag: Loyalty points are given without asking users to pay for anything. Neatly, identifiable categorized sections reduce cognitive load on the user in terms of taking decisions.
  3. Agoda: Users can be promoted to the next level just by booking through the app, it does not aim for average order value but it aims for user retention.
  4. Goibibo: Giving cab booking feature in the app for every hotel.
  5. Make My Trip: They had an approach for Social proofing which made us concrete that we can solve AOV and retention metrics by this method.

Primary Research-

I was heavily involved in finding users and convincing them to interview, Also I interviewed 1 user out of 5, and other teammates were interviewing users sententiously.

We got ourselves divided into smaller teams and interviewed users on zoom call asked them to share the screen and make them think aloud.

One of the core reasons for doing usability testing in the primary research phase was to observe how they behave while using OYO, also is our hypothesis right.

We also wanted to validate our hypothesis before making UI and what in the current UI is working.

Since we had 48 hours we wanted to solve problems related to OYO wizard and reduce the priority of other problems.

User Insights from interview

Defining the target users is important to select the right people for the interview. We came up with a short screener form to Screener form https://forms.gle/DdLX3YzUhuGzpxr79 (link to form)

TOP INSIGHTS OF PRIMARY RESEARCH

👉🏻 Reviews, Rating, and cost was decision-making for factor for user to book a hotel

👉🏻 Users were confused about what benefits the wizard plan has to offer

👉🏻 Users were having difficulty getting on to the wizard plan

👉🏻 Based on primary research we got multiple versions of UI.

Validation.

In this phase, we collected all our insights and validated them from primary research, secondary research and competitor research.

The Mid run

It was already 24 hours into the hackathon and we had a good ,start, still a lot of work was left. by this time I was really confident that we can pull off a good solution in the next 24 hours, also we were highly motivated after validation.

Ideate The Solutions

I was involved in the ideation of wizard plans, brainstorming and HMW, this was a team activity and fun to do.

We had set a timer for 5 minutes for ideation and worked on it together since time was a major constraint here we wanted to make most out of it.

After primary research, we did a quick filtration process and wrote all the pain points that affect our business metrics. We set a timer for — 10 mins for each pain point we shortlisted and brainstormed How might questions. We came up with the following HMWs for each screen.

He could not find an OYO wizard
HMW increase the visibility of the OYO wizard on the home page?

Price is their prime decision factor
HMW sell them oyo wizards while also making it cost-efficient to them?
HMW increase the credibility of the product and build trust among customers?

The user found that there were no extra benefits written if you were a wizard member.
HMW we communicate the benefits of Wizard membership in a clearer way.

Lite doesn’t clearly mention stuff
HMW clearly mention the details of Lite
HMW prompt the users with the benefits of OYO Wizards frequently

The information was not sufficient.
How might we give more information to the user?

He does not trust recommendations as he thought the company wanted to sell their products that’s why he won’t want to go there.
HMW we do something which will motivate him to buy our Gold product

High changes of drop-off users because there is no clear comparison between the three plans because the user wants to know exactly what benefits they will get in each plan.
HMW make the user more clear about the three plans or draw a comparison between the three plans.

He wanted to do a little research before selecting the plan. In the plan mentioned he felt that the information provided was less and kept saying “I wanted more details on this” By reading the name of the offer he got attracted (on selected benefits only).
HMW we write the content in a much better way that gives 100% transparency.

He saw offers on the checkout page, Payment options.
HMW prompts the user about the offer while looking at the details of the hotel.

Didn’t realize there was a wizard option on the checkout and inner page
HMW make it more prominent to be seen on the checkout page.

He also uses group coupon discounts if he goes on group trips.
HMW make more beneficial opportunity for group users.

We got some ideas like-

  1. It is changing the wizard card on the homepage, making it the same as the icon on the hamburger menu, and moving its position to the top right corner of the menu.
  2. Subscribe for detailed reviews
  3. Wizard stories
  4. Giving rewards for posting a story or review.

Wireframes

Individual contribution-I made the wireframe flow, from page navigating to wizard page, which was iteration 01.

The team further iterated on the wireframes and we moved towards digital wireframes.

Iterated wireframes digital and paper.

Explanation of wireframe-

Wizards on the menu: Changing the position of the existing position of the wizard card on the homepage to the same as the icon on the hamburger. Reasons- Primary Research: 1. The user has to scroll down a bit to find the wizard card.

2.The user missed the wizard card on the homepage.

3. The user discovered the wizard from the hamburger.

Adding Detailed Experience: Asking users to write detailed experiences and feedback of the experience or stay they had in wizard hotel. It can be shown on the homepage as well as on the wizard hotel detail page instead of the reviews and rating section or below that.

Reasons- A community where people can share their experiences( ideated on this).

Primary Research: 1. Users read reviews before confirming the booking of the hotel

2. Fewer reviews on OYO as compared to make my trip → therefore this will help the user get to know more about the hotel and make the decision quickly.

Competitor analysis: 1. Stories and feedback are there to make my trip.

Clear comparison of benefits of being a wizard member for wizard hotel/ to show what the user can do with the money saved: Providing information or showing the user what and how exactly they saved or benefitted from the offer. Eg- By using this offer I have up to 30% and with the money left I had a brunch in this hotel. This can be presented on the homepage.

Reasons- This encourages users to buy the wizard plan and make clearly see the difference which will help them in making quick action. Primary

Research: 1. Users were not able to figure out how will they benefit by buying wizard plan

Rewards:

1. Adding stories will have some reward

a.Normal stories

b.Template stories: They will get more rewards as compared to normal stories as this attracts users to buy wizard plans as the reward is more in it.

2. Adding detailed experience will have rewards Reasons: The rewards will attract users and encourage these activities hence ensuring that this feature will be used by the users.

Primary research: 1. Users are attracted to offers and interested in knowing what the plan is offering so, therefore, presenting them in a prompting way ensures that they might buy it.

Secondary research: 1. Making the paid program extremely beneficial to both guests and hotels,” mentioned the company’s press statement.

UI and the reason behind it.

I was actively involved in UI design, where I redesigned an iteration of the Wizard plan. Also helping the team in making UI.

Also, I made the prototype of the final UI.

Reasons behind UI design.

End Run

It was last 6–8 hours and was ready with our prototype. We had to conduct usability testing and documentation, but we all were active and ready to take responsibility for our respective tasks.

Till this time I really experienced teamwork and planning as our teamwork was so smooth and everything was going as per plan.

Usability testing.

Individually I was actively involved in 2 out of 3 usability testing as team members were improving UI after feedback.

Since the time was less we got ourselves divided into 3 teams and went for user testing. Below is the key insight of usability testing.

Usability testing insights

Iterations.

I was actively involved in prototyping the UI of the final iteration, other team members were working on documenting everything. This was the last few hours before the deadline.

  1. Differentiated the OYO stories from cities on the homepage

a. From the interview, we got the insight that the user couldn’t able to identify the difference between the stories and other locations

2. Emphasized more on the “Save your pocket section” to which we have to redesign the complete section

a. From the interview, we got the insight that the user no one noticed the banner.

3. Change the images on the stories

a. From the interview, we got the insight that the user stories felt artificial and that it was sponsored by the Oyo apps.

4. More personalized pictures and text on wizard member experiences.

a. From the interview, we got the insight that the user would want the real experience to make up his mind to confirm the booking.

5. Redesigning the entire wizard plan page.

a. From the interview, we got the insight that the user was not able to differentiate between the plans and got confused.

(final prototype after implementing all the changes link of figma file https://www.figma.com/file/UPHNq3P968YuN3a7ElnUrs/Group-03---oyowizard-designathon)

What went right-

  1. Competitor research went right as it gave a lot of ideas about the industry, and how competitors of OYO are running their loyalty programs.
  2. Heuristics evaluation went right as we found out a lot of usability issues, which were hindering the user experience.
  3. Teamwork was amazing, as everyone did their part, Sana left in the middle but she helped a lot in planning and streamlining the team.
  4. Primary Research- we were able to get a lot of behavior data and how people react to loyalty programs.

We also came across 4 different UI’s for the OYO app which made the primary research.

  1. Usability testing- we got a lot of insights into how users reacted to change, by doing the think-a-loud activity.

What would have been done better-

  1. Ideation and wireframing- we think it would have been better, as we are used to ideating for exploratory research.
  2. We would have followed the Plan of action better.
  3. We would have a systematic discussion round.

Future and scope-

  1. Add your story with a template and get a reward.
  2. We work on story flow and how a person can earn
  3. Wizard membership comparing on the wizard hotels details page to make the conversation clear.
  4. When we are searching for hotels in a specific location add stories there.

Key Learnings

  1. Teamwork.
  2. Power of planning.
  3. Breaking down the tasks into smaller pieces.
  4. Leading the team in some areas and being a team member in some areas.

--

--

Vishnu pandey
Bootcamp

UX designer with keen interest for business, I try to design products which solves user and business problems.