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

Similar documents
Module 9: WayBackMachine Redesign


BETTER LOOKING S

Clickbank Domination Presents. A case study by Devin Zander. A look into how absolutely easy internet marketing is. Money Mindset Page 1

Publisher 2007 Creating Flyers and Brochures

Publisher 2007 Creating Flyers and Brochures

ABOUT RESEARCH POSTERS

Handy guide for effective EPFL PowerPoint presentations

PLANNING. CAEL Networked Worlds WEEK 2

THE 18 POINT CHECKLIST TO BUILDING THE PERFECT LANDING PAGE

The Marketing Campaign. Teaser Poster Teaser Trailer Website Main Poster Full Trailer T.V. Spot Publicity and Promotion

Teaching with Primary Sources

Create Reflections with Images

Chapter 5 THE STYLE. Style plays a key part in the overall experience. After making your app intuitive it is time to add some flair.

Setting up Blogger. We have focused on Blogger as it is easy to use and ideal for someone starting blogging.

CSS gives great power. But requires great responsibility.

15 NEUROMARKETING. Mind Hacks. You Need To Be Using

How to make your neighbourhood newsletter look good

Reviewing and Evaluating your Website

Duplicate and customize an existing kahoot to fit your needs. Launch and host a kahoot game in your class

How to Create a Google Sites Website

Design Justification Assignment 2 Kawther Alsaffar

Creating an with Constant Contact. A step-by-step guide

mobile friendly? Google s survey shows there are three key points to a mobile-friendly site:

Quick Start Guide for Club Websites

Design Principles. Advanced Higher Graphic Presentation. Professional Graphic Presentations by kind permission of

Creating an with Constant Contact. A step-by-step guide

Fast Company Homepage This ad is very distracting and grabs the viewer attention more than the logo and navigation. It could cause the user to overloo

Labels: On the original site, none of the menu labels are awful, but some could be more descriptive. I had to work out the answers to the following:

After looking through references and professional examples, I started to design and develop the Icons for the App.

On the Web sun.com/aboutsun/comm_invest STAROFFICE 8 DRAW

CREATING A POWERPOINT PRESENTATION BASIC INSTRUCTIONS

Microsoft Publisher Project 2 Designing a Newsletter

UNSW Global Website Branding Guidelines. Website Brand Guidelines

HOW-TO GUIDE. Join or Login. About this Guide!

BE A MOVIE MAKER! Before we import our pictures, we want to change the default frame rate -- in other words, how fast our movie will run.

Heuristic Evaluation of Mango

Library Website Migration and Chat Functionality/Aesthetics Study February 2013

Creating Teacher Websites

University of Pittsburgh Communications Services. Basic Training Manual Drupal 7

Tips & Tricks for edx-forums

Museums Sites Quick Start Guide

Branding Guidelines for

Piktochart 101 Create your first infographic in 15 minutes

Software Compare and Contrast

Creating a Website Using Weebly.com (June 26, 2017 Update)

Strong signs your website needs a professional redesign

Personalized Movie Database System

Pitchfork Case Study & Redesign. Matt Rondos Interactive Design I

AAG Mobile App User Manual

WEBINAR CONSOLE BRANDING GUIDE

Choose a title that captures the interest of an audience and orients the audience to the poster s content.

TouchCMA Branding Options. Give your newest tech tool a makeover with your company s look and feel!

Lesson 1 Introduction to PowerPoint

10 TESTED LANDING PAGE ELEMENTS GUARANTEED TO IMPROVE CONVERSIONS

Prezi Quick Guide: Make a Prezi in minutes

Introduction. But what about some of the lesser known SEO techniques?

Senior Technical Specialist, IBM. Charles Price (Primary) Advisory Software Engineer, IBM. Matthias Falkenberg DX Development Team Lead, IBM

How to Make a Book Interior File

COMPANY BRANDING guidelines. colors styles fonts usage

Basic PowerPoint Guidelines. Tips for Creating Great Presentations

8 Web Design Principles to Use IN ELEARNING DESIGN

TRINET INTERNET SOLUTIONS, INC.

Teach Yourself Microsoft PowerPoint Topic 4: Slide Master, Comments and Save Options

Design of Ontology for The Internet Movie Database (IMDb) Sasikanth Avancha, Srikanth Kallurkar, Tapan Kamdar

Designing Posters TIDI Development Research Week

WEBINAR CONSOLE BRANDING GUIDE

MANAGE YOUR CONSTRUCTION21 COMMUNITY

The Elements Theme English manual: v1

ONE K CREATIVE. tools for social impact storytelling: CREATING A CONSISTENT BRand

Website Self-Assessment

Lab 2. CSE 3, Summer 2010 In this lab you will learn about file structures and advanced features of Microsoft Word.

A Quick and Easy Guide To Using Canva

Enhancing your Page. Text Effects. Paragraph Effects. Headings

Buddhist Symbols Style Guide

LizardThemes.com Free & Premium WordPress Themes. LizardThemes. User Guide. First Edition

IGCSE ICT Section 16 Presentation Authoring

QUICK START GUIDE FOR CLUB WEBSITES

Creating a Newsletter

ICPA Survival Guide. Version 2.0 February 1, Page 1

Power Point* Quick Start. 1. Start Power Point (PP) by 2x click on the PP icon in the program folder.

Introduction to the Weebly Toolkit for Building Websites

New Perspectives on Word 2016 Instructor s Manual 1 of 10

Web Design Portfolio

WEB DEVELOPMENT REQUIREMENT CHECKLIST

Quick Reference Design Guide

**Method 3** By attaching a style sheet to your web page, and then placing all your styles in that new style sheet.

THE ULTIMATE FACEBOOK AD TEMPLATE LIBRARY. Digital Marketer Increase Engagement Series

Layout of Movie Maker. Elements of Movie Maker. Step by step instructions on how to use Movie Maker. Web resources for Movie Maker

PowerPoint 2010 Quick Start to a Presentation

DESIGNING A POSTER A SHORT GUIDE FROM THE JET LIBRARY

Excel Tutorial 2: Formatting Workbook Text and Data

The Complete Nonprofit Website Toolkit Fleshing Out an Accessible, Usable, Polished Website July 2013

VIDEO 1: WHY IS THE USER EXPERIENCE CRITICAL TO CONTEXTUAL MARKETING?

NCMail: Microsoft Outlook User s Guide

Microsoft Word 2007 Tutorial CIS*1000*DE

CONVERSION TRACKING PIXEL GUIDE

This course supports the assessment for Scripting and Programming Applications. The course covers 4 competencies and represents 4 competency units.

SmartTheme Manual 1 Last update: 2017/07/29 OptimizePress

Netvibes A field guide for missions, posts and IRCs

Transcription:

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

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

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

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, 2002. 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.

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 2002. 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

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 2002. 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.