IMDb — Mobile app redesign
I have been using IMDb’s application for a long time, and I always thought that this app could be better⏤ like so much better.
But back then, I had no idea whatsoever about something called user experience, or user interface. Now that I do, I decided to update the whole experience, making it more efficient and better-looking.
The Challenge
Based on a little research I did, 3 of 5 persons who watch movies regularly have IMDb on their phones. So you realize how big that number is, and we all know that the more users you have, the more problems you have to deal with and solve.
User Research
The first question I had to find an answer to was : Why do people use IMDb? I interrogated a group of IMDb users, and I got the following results.
So as you can see, most of IMDb users set as a goal⏤ deciding if a movie is worth the watch or not. Basically, by checking the movie’s rate and maybe the reviews. In addition to that, people also find the option of saving movies very useful.
What IMDb’s mobile application lacks
Among all the users I interviewed, a dominating percentage of them expected the application to include some features that it didn’t have. And one of them was⏤ chatting, which I strongly believe that it must be included within the app so that users are able to share movies/news with each other, without leaving the app or having to login in another one.
There is a big chance that the user will quit in the middle of this operation, and the reason for this is that users want to spend as little time as possible executing a certain task, so it’s our job as UX designers⏤ to take under consideration all of that, while creating an experience.
Here is what I added to the app and why
- Chatting (Mentioned above)
- Personal Collections : Although the original application already gives you the ability to create lists⏤ users don’t even know this feature existed (according to the survey I conducted), so I focused on making it primary, and getting rid of the “watchlist” system. Thus giving the user the ultimate freedom to create collections on their own criteria.
- Improve The Feed : As can be seen from the statistics, a small number of users are interested in reading news, which I suppose is due to the fact that the user does not see what interests him/her. So now, right after the sign up page, the user will get an infinite number of swipe-generated tags. What does this do is: help the app learn more about the user, hence show each one a unique feed of news, that varies depending on the chosen tags.
And here is how it looks like integrated in the UI.
- Discover Mode : Facing too much content usually disturbs the user. I wanted to make the application simpler by adding the “discover mode“. This feature divides the content into categories, which facilitates navigation and helps the user avoid confusion. This will also widen the user’s interests, and ease browsing through films.
The solutions in the UI
The tab-bar
How to consider thumb’s natural movement in your design, an article by Scott Hurff.
The tab-bar in the original app is placed at the top, which makes it difficult to reach and puts the user in absolute discomfort⏤ since the tab-bar is used frequently to navigate through the app. Learn more about bottom navigation.
App Launch
Right after opening the application, we show the user three on-boarding screens, introducing the new built-in features.
Create Account on IMDb or Login
I always strive to ditch all the distractions from the UI, because once the user accesses the page, the first thing they should notice is the point of the interface. In the sign-up page, the point is to insert information and tap the sign up/in button. So those two things should be the most attracting in this interface.
Home
Discover
It’s always important to keep your points clear and concise enough for easy re-communication. Even though the client may appreciate the extra displayed effort, it can muddy the waters when feedback comes back out.
Inbox & Invite a friend
This is the new feature I added to the app. Bellow⏤ you can see the user’s conversations with other users of IMDb.
News
Since I found out that not so many people use the app in order to browse news, I challenged myself to change that.
So, I made sure that news are presented in a simpler way⏤ that allows the user to comprehend the structure of the content.
I also used “white text on dark background” system. This will not put as much stress on our eyes because black background is not as bright as the white one. It reflects less light making it easier to read. More importantly, it prevents light from electronic displays from disrupting your body clock.
Movies library
Colors have always represented life and joy. That is why I figured that adding a colorful appearance to the library of the user, will make it more consistent and harmonic.
In this screen, you have the choice to display collections or the saved movies. You can also create a new collection, name it as you wish and put the picture and the gradient you want.
Movie Info
Last but not least, the movie screen is one of the most important screens in this app, since it’s about movies. So, I think this interface should present a content that shows what the user wants to know about any movie.
with the new design, you have the choice to add movies to any collection you want, not just the “watchlist”.
