Redesigning the micro flows of “Ticket New” App

In this article , I am going to explain how i approached redesigning the micro flows of Ticket New App

First, I am really glad that I got to attend Growth school’s 2-week UX workshop by Anudeep sir at the very beginning stage of my UX career. It laid the roots of my design thinking process and gave me a clear vision to travel with.

It encouraged me to take up this UX kickstarter design Challenge by Growth School which happened for two days.

Let's get into the case study!

What is Ticket New app ?

Ticket new is a e-commerce service website & app providing movie ticket booking services online.

Why I chose the Ticket New app?

I was using ticket new.com to book movie tickets in the early days of its launch. But somehow with time, I shifted to using other apps. Recently I wished to try this app again and installed the Ticket new app in my phone.

I opened the app, while browsing and searching for content. I faced some issues with some parts of the user flows. I decided to redesign it on whole.

I also came across the Growth schools UX challenge at the same time. so I decided to work on this app for my challenge. Considering the duration of the challenge, I decided to select two microflows and redesign them.

For this challenge I chose two micro flows

1. Click the app in your mobile and enter the home screen of the app
2. Click the search bar and enter the search screen

These are the original screens currently available in the ticket new app

Why the redesign?

The problems I identified with the flows are:

• The app uses a vertical scroll to browse content in the app which is successful in Instagram because it provides variable rewards to the users.
• But here we display a subset of categories so the same wouldn’t work here also most of the users decide a content before in their mind and come to book tickets so the contents in the screens must be easily scannable by the user
• Sorting options was not effective
• The search screen was very blank. Users are occupied with many things there is a chance they are not able to recall things suddenly so the search should be in a way where users can recognize things and act faster.
• Users spend most of their times in other apps so they expect your app to behave in the same way. Following a old design system can results in the possibility of users to chose other apps over yours in spite of you providing a better service.
• Also, the ticket news app’s screens UI looked pretty outdated and less engaging. It surely needed a makeover.

Luckily, our mentor Anudeep sir provided us students with the workbook kit that would guide us through this process

Suggested by the workbook I evaluated these issues with the heuristic principles to see how it actually affects the user.

Here is what I found

These above issues connect with two main heuristic principles

• Consistency & Standards
• Recognition rather than recall

After all brainstorming and ideations I decided to proceed with these below ideas

1. Making existing contents more presentable and easily Accessible to users
2. Introducing new categories like Advance bookings open for
3. Use horizontal scroll
4. Adding recent searches and popular searches to the search screen
5. Redesigning both the screens

Some Behind the scenes

Based on the Ideas I created wireframes to have a better view of my ideas.

Link to Marvel prototype👇

https://marvelapp.com/844780d

Next I created high fidelity prototype to test with users :

Usability testing was very new to me but finally it ended really well. I was able to interact with different people and know how they perceive things . To some users these solutions were really useful . Some users broadened my user research to consider new user problems. Few users suggested improvements.

Our mentor Anudeep sir was indeed right “ I am not the User ”. I have to understand real user problems and provide them with a possible solution.

Based on the insights I got from the user testing I did some iterations to my design.

And.. here you go

The Completed version of my design solutions

Want to try and see how it works :

Link to figma prototype👇

Let me explain to you what i did

I will break down the changes made to the flow and explain the solutions I came up with

SOLUTION 1

Making existing contents more presentable and easily Accessible to users

How it benefits user :

Earlier this language filter was in the form of a drop down menu.

In the new design I designed it in a way it is more visible and accessible to the users . Users could directly click the language names above and the respective content appears below. I improved the flexibility and efficiency of its use here

How it benefits the business :

Users speaking different languages enter our app. They can filter their search by sorting out the movies according to their languages. We make things simple for users. Everything is sorted out properly for users to find contents effortlessly this boosts the retention of users .

SOLUTION 2

Introducing new categories like Advance bookings open for

Introducing new categories like Advance bookings open for

How it benefits user :

I retained the two categories “ New releases ” & “ Coming soon ” which was already available in the app. I introduced a new category named “ Advance bookings open for ”

During occasion times and the time of release of big movies users have to check the movie ticketing app again and again and refresh it many times to see whether the advance bookings has started for a particular movie or not .

Notifying the users about the opening of advance reservations of movies would reduce the time and effort taken each time by users while booking tickets for big movies.

How it benefits the business :

Notifying users about the opening of advance bookings reduces the error rate as users know for which movies bookings has been started in advance so they need not check or refresh the booking screens. It reduces the session length and results in increase in the number of bookings made in the app especially during occasion and big movie release times .

Satisfied users through word of mouth can also bring new users to the app.

SOLUTION 3

Introducing a rating feature below movies that are released in the app. This feature is common in other apps but it is new to ticket new app.

This solution was completely taken from usability testing. Users felt that ratings would give them an idea about the movie and take better decisions. Users also felt star ratings would be better to get unbiased opinions about the movie.

And there isn’t too much users can take away from star ratings except that users can know whether a movie is trending upwards or down.

How it benefits user : Using a star rating instead of percentage ratings helps users have an unbiased opinions about the movies because it depends on how the users calculate these stars as percentage or marks out of 10 in their mind and Also, these ratings allows users to compare between movies and make decisions quicker.

How it benefits the business : It reduces the time taken on a task and increases the bounce rate which is again beneficial for the app

SOLUTION 4

Adding recent searches and popular searches to the search screen

Adding recent searches and popular searches to the search screen

How it benefits user : I added a recent searches which helps users recognise the content they searched for last time rather than recalling it each time . This also guides them in case they were not able to recall any content they came searching for.

Popular searches column has been included to inform users about the trending movies and help them not miss anything.

Users can also filter their searches according to the languages

In case the users searched for movies that was yet to release and if their advance bookings has been opened . We notify that to the users also in the search screen if the users missed it in the home screen they can also find it here and I have also added a book now button which directly takes the users to the booking page with in a click.

How it benefits the business :

Users coming to book ticket for a particular movie by seeing this features can spend extra time browsing through it and can also book tickets for that, which results in an increase in user’s session length in the app.

I have also redesigned the UI for both the screens in a clear and presentable way . I have added horizontal scroll view to make the app more accessible and engaging.

Retrospecting and learnings

1. Some facts which our mentor Anudeep said like “ I am not the user ” and “ I am a student “ made more sense when I worked on this case study.
2. UX design is not about solving problems we assume that users want to be solved. It is about solving the problem that users actually face and want to get solved.
3. Attending this challenge was like a self-analysis. I was able to know places I was better with and the topics I have to work more on.
4. User experience design is a responsibility. We listen to the users, find their pain points, and work on solutions to provide them with a better user experience which is a really special thing.

Thanks to everyone who made it till the end. Please feel free to share your feedbacks on this article.

You can connect with me through linked in : https://www.linkedin.com/in/hema-priya-u-444877201