Redesigning IMDb | Modernising the look and ‘improving’ the User Experience
Starting off with my first redesign which has been due for a very long time. Switching my line from a front-end developer to a full time UI Designer was a tedious job at first. So for starters I decided to do a redesign of one of my favourite products i.e. IMDb.
So here is how it all started.
Challenge: The current challenge which I see is lack of a modernise UI. Undoubtedly IMDb has done a great role in justifying there UX inspite of such a huge database, but there are some small things which can be ‘improved’.
That’s the overall gist of this redesign, a better modern look and improving some of the aspect of IMDb.
User Survey: I conducted a poll with my Facebook friend list related to IMDb, result are as follows-
Deductions from the above user survey:
- People are more inclined towards knowing about Movies than towards TV Series.
- People find IMDb the most reliable source to know about the Cast & Crew.
- The articles written on IMDb are huge in number but are the least engaging elements on there website.
Homepage Redesign.
Click here to see the whole design
- Hero Section: As soon as someone lands on the website the upcoming movies are shown in the form of a big slider. There is a main preview section on the left and the thumbnails of other movies in this section on the right.
2. Based on the insights from the case study, users want to know the budget/earnings of the recently released movies. Here it goes:
3. Latest News(Articles): Since maximum amount of people found articles on IMDb non-interesting, I decided to take the visual appearance of this section as the first step. People tend to notice images more prominently than the just normal blocks of text. Here it goes:
Movie Page Redesign
Click here to see the whole design
- Hero Section: The first thing visible on the Movie page is the Name, Main Cast, IMDb Rating and a small brief about the plot. Following the same consistency of the home page, the hero section is divided in 1/6+ 3/6+2/6 layout showing Official Poster, Movie Trailer, Movie Related information respectively
2. Earnings, Awards and Plot Summary: The visual treatment of the full page is divided in such a way that after the movie’s basic info(cast, trailer etc) you get to see the movie earnings with a catchy design. Also there is a plot summary, but its shown in a way like “Relax folks, this is a spoiler free summary, you can read the entire synopsis here”.
3. Articles related to the Movie, Cast etc: This section covers the articles from IMDb which are related either to the Movie or the Cast in some way or the other.
Celebrity Profile Page
Click here to see the whole design
- Hero Section: One of the major sources of income of IMDb is IMDb Pro: where people can actually contact PR’s, Agents, Casting Directors etc. So in the main hero section of the profile page is a flashy button where it says you can contact the Celebrity via IMDb Pro. Also twitter being the most popular social media platform related to celebs, there is a live twitter feed too.
2. Biography and Awards: You can read a detailed summary about the celebrity’s biography along with a button that takes you to a timeline section of the celebrity which shows “Year by Year achievements” of the celebrity. Also you get to see how many wins/nominations does the actor have on his name.
Full Designs below:
There is one more section I needed to cover: IMDb Pro, but since I am not a PRO user, I couldn’t figure out how to do that. Suggestions and comments are welcomed.
Be lenient, this is my first story on Medium :)
Check the full project on https://www.behance.net/gallery/36175333/IMDB-Redesign-UIUX
