Module 9 Kelsie Donaldson Casey Boland Nitish Pahwa. IMDb, August 13th, 2002

Size: px

Start display at page:

Download "Module 9 Kelsie Donaldson Casey Boland Nitish Pahwa. IMDb, August 13th, 2002"

Laurence Watson
5 years ago
Views:

1 Module 9 Kelsie Donaldson Casey Boland Nitish Pahwa IMDb, August 13th, 2002

4 IMDb.com Sitemap Landing Page Navigation bar News Forums Awards Movies TV Box office Search bar Header Site title logo Footer About page Careers Contact Social media links Featured movie Get tickets Movie pages Quick synopsis Director, writer, stars Videos Similar movies Whole cast Storyline Keywords

5 Box Office performance Trivia Quotes Soundtrack FAQ User reviews Message boards Person pages (actors, directors, etc ) Bio Known for Filmography Related videos Trivia Message boards News Top news Movie news TV news Celebrity news Indie movie news Forums Message boards Learn about the community Polls How to contribute Awards Newsfeed of upcoming award shows

6 Movies In Theaters Showtimes and tickets Latest Trailers Release calendar Top rated movies TV On tonight Top rated Most popular Box Office Current Box Office information All-time top-grossing Box Office Reflection For module nine, our group decided to redesign IMDb s website. Specifically, we looked at waybackmachine.com and found screenshots of IMDb s website from August 13th, Because the site back then was very bland design-wise, we knew we really wanted to incorporate some interesting visuals for the landing page. Instead of the all-white background that was displayed in 2002, we chose to put an image in as the background of the home page. We selected a picture of an old-fashioned movie projector screen; we liked this idea because now even the background of the site is centered around the theme of movies. It s also a fairly simple image, so while it s interesting to look at and ties in with the theme of the site well, it s not distracting from the content of the site, and it doesn t make the featured images and text hard to read. It also allows us to have a black header and footer, which means the content on each of these sections really stands out. The border around the white projection creates a nice symmetry that is pleasing to look at.

7 For our logo, we decided to stick with the movie theme, and create the shape of a ticket. We liked the idea of making it actually look like a movie ticket, so we made the background white. As for the IMDb font, we decided to pick something a bit more elegant that fits the old-fashion theme a bit better than the Impact font they chose in We made the navigation bar at the top gold so that it contrasts nicely with the black background, and the text for each page is easy to read. We decided on six categories to put at the top of the page, because we felt these six things really encapsulate the core pillars of the site, and should be the main focus for the user. We decided to spice up our home page by adding many of the same features they had on their landing page in 2002, but in a more organized and eye-catching fashion. We didn t necessarily want to add more of the same links we already had listed in the header, so we wanted to include fun and interactive features for the user to enjoy. We have a featured movie shown on the left side of the page, with its poster and a short descriptor. We made it a movie that is currently popular so it will get more clicks. We included a Now Playing section with Get Tickets buttons as an easy resource for any moviegoer to find out what s currently in theaters and easily purchase tickets too. At the bottom of the Now Playing section, we included a randomized Movie Fun Fact that would ideally change every time you revisit or refresh the landing page. We put a search bar at the top as an easy way to look for something specific in the database. We also utilized serif fonts throughout the page to match the feel of a movie ticket or a movie script. The links on the page are colored as Dark Red 2, and the headers on the site are all bolded in order to stand out. We did not wish to make the links a standard blue underlined format. In our footer, we included some basic links: About, Careers, and Contact. We figured that those are links with helpful information that don t need to be displayed at the top of the page. Each of these links are common on many different websites, and are essential to a good design that encourages user engagement, as IMDb does. We put the circular social media icons at the bottom, similar to what they have on IMDb s current site (although they have their icons on top as well). When creating the sitemap, we knew we had a lot of information to cover; after all, the site at its core is a data base. We started with the page we would actually be designing: the landing page. We knew we wanted some of the features seen in the 2002 version of the site, so we started there, and then build from it. From there, we needed to map out some of the other pages that would be on the site. Because one of the biggest uses of IMDb is to look up information on movies and actors, we thought it was important to break down what would be on each of these pages. We thought about what we look for when we visit a site such as IMDb, and included these ideas on the sitemap. From there, we decided to focus on the six categories we d selected for our navigation bar. We brainstormed what information would fall in which category, and

8 added it under that section. Overall, even though the site has a ton of content about many different topics, we think we did a good job of providing a pretty comprehensive site map that illustrates the main user-purposes of the site and intuitive navigation we would hope the site to have. Overall, we utilized a theme of old-fashioned movies to create a more elegant, cohesive, and visually appealing site than the basic, black-and-white design of By going through the entire design process step by step, we were able to create a design comp that had both meaningful content an attractive design.

Module 9: WayBackMachine Redesign

Module 9: WayBackMachine Redesign Written by Sydney Landon, Bernie Belcher, and Deron Ferrell Reflection When recreating MSU Writing Department's home page we wanted to make specific elements stand out.