Space Jam 1996 Redesign
Responsive Web Redesign, UX/UI, UX research, Figma
Background
Space Jam 1996 website invokes feelings of nostalgia. The graphics and writing are playful and fun. It was designed before movie websites were common, but it didn’t become popular until someone posted on reddit about the site. It got so many hits, that someone at Warner Bros. thought it was a mistake and shut it down. It was back up and running within 2 hours and never once veered from it’s original 1996 design.
problem:
The 1996 Space Jam website is hard to navigate and outdated. Even though many fans love it for its nostalgia, it is not user-friendly or intuitive.
research goal:
I want to understand and discover what users believe to be the main goal of the website.
research methodologies:
secondary research
user interviews with moderated usability test of current site
competitive analysis
User Interviews
5 users interviewed
All participants have heard of Space Jam
Not all users have experienced Space Jam 1996
key insights from research
4/5
said the website felt very nostalgic & they liked that feeling
2/5
have visited the 1996 website before
5/5
stated the text and colors were hard to see and made it hard to read
Competitive Analysis
After completing the user interviews, I wanted to compare other fun, interactive movie websites. Wizarding World’s website for all things Harry Potter and Fantastic beasts and The Barbie Movie website were broken down for comparison.
Wizarding World
Homepage
Create account
This feature is useful because user’s can create an account to keep up with their quiz and other interactive things on the site.
Website navigation
This feature is useful because users have the option to select from the navigation menu or they can scroll the page to explore.
Website navigation
This feature is useful because it draws attention to a fun interactive quiz that the site offers, encouraging users to use the site and maybe encourages them to share the site with other’s.
Design affordance
This feature is useful because users can see that there is more to explore & scroll.
Progress tracker
This feature is useful because users can see how many more things there are to see and how many they have looked at.
Kid’s website
Separate website for kids
This feature is useful because it is designed
for kids. It gets them engaged with the brand
in a way that is exciting for them.
The Barbie Movie
Top of homepage
Hamburger menu
This feature is useful because it’s intuitive and familiar to users to know where they would find the website navigation.
Playlist & selfie generator
These features are useful because they encourage the user to interact with the brand. And most likely share it with other’s too!
Social media links
This feature is useful because so many users connect through social media and get their news or updates from social media.
Call to action button
This feature is useful because it encourages the user to either buy tickets or buy the movie.
Where to rent or buy
This feature is useful because it draws attention to users to buy the movie so they can watch it immediately when it’s released.
Videos and trailers
This feature is useful because users and audiences want to view trailers and watch little sneak peaks of the movie. It helps to market and advertise the movie.
Bottom of homepage
Gallery
This feature is useful because it’s a gallery of the different characters on the movie poster with catchy, funny little sayings.
Watch party marketing
This feature is useful because it includes free downloads for users to share with friends and encourages them to spread the word and invite others over to watch the move. Includes a social media hashtag.
Personas
Sam is 40 years old. He represents users who saw the first Space Jam movie but didn’t visit the website until they heard from a friend that it still existed many, many years later. This type of user feels nostalgia when viewing the site. They have kids & want to share a part of their childhood with them. This type of user gets a good laugh from the 1996 Space Jam website and feels like it’s main goal is to be funny and just for people who like Space Jam to have some fun.
Ashli is younger and learned about the Space Jam movies when Space Jam:The Legacy came out. This type of user has never browsed movie websites before. They typically see trailers through social media, rotten tomatoes, or IMDB. This type of user believes that marketing is the main goal of this website.
“This is what the internet looked like when I was a little boy. I would have been 12 years old and in the prime of my internet browsing.”
Sitemap
I designed my sitemap so that users could easily access and see what there is to explore on the website. I noticed a common issue that kept coming up during user interviews. Users were unsure how to navigate the site. The redesign is more intuitive and user-friendly design by updating the website with common user interface.
Features set & Solutions
Homepage
Users liked the nostalgic feel of Space Jam 1996 and liked how interactive it is. However, they noted that the background made the text hard to read and the layout overall felt overwhelming.
Solution: By updating the background and creating a more intuitive, modern-day design users are able to navigate more clearly.
Behind the Tune-iverse
Users noted how interactive Space Jam 1996 was. Behind the Tune-iverse is everything behind the scenes for Space Jam. An interactive way to explore the making of the movies and have some fun.
Solution: Users can select the category they want to explore with just one-click saving them time while still learning about behind the scenes in a fun way.
Kid Jam
The movies span generations, from a parent to their child. Kid Jam is a separate website designed to allow young kids and teens to explore Space Jam.
Solution: A prompt for Kid Jam appears when users select kid jam in the navigation bar. From here, users get to make the choice of entering the site or closing out/cancelling and staying on the normal website. Designed with a kid in mind, the fun colors and icons make for a kid-friendly website.
The Lineup
Users wanted a way to view all the characters instead of going to Tweety bird’s page as the default character.
Solution: To give users a choice, I created a page that displays the different characters. With images and names, users can navigate to their favorite character.
Character Page
Users mentioned that the main goal of Space Jam 1996 was to have fun while learning about Space Jam. They noted that they would want more information about characters than what they saw on the original site.
Solution: Adding a biography of the character and an image and video gallery gives the user the extra information they want.
Mobile screens
Mid Fidelity
High Fidelity
My process of designing from a low or mid fidelity allows me to see the bones of the design before applying visual design. By doing this, I am able to look at the function and usability of the product.
Homepage
Behind the Scenes
The Lineup
Testing
Moderated Usability Testing
5 users who have searched for a therapist tested the end to end user flow
Usability testing was completed over video chat and in-person.
Succes Metrics
Is it intuitive? Easy to use?
What is the overall vibe? Does it provide nostalgia like 1996 does?
For those with kids, could they see their kids engaging with the site?
Testing outcomes
were confused about the lineup and character navigation
3/5
4/5
ranked overall ease of use a 4 or 5 on a scale from 1-5
3/5
did not chose Junior Jam when selecting the kid’s website, instead the Tune-iverse
Priority Revisions
Updated name of kid’s site to Kid Jam to clear up any confusion as to what is the kid’s website.
Title “Behind the Tune-iverse” instead of “explore.”
Removed text on category card and shortened card length.
Added text describing what users can expect to find on the page.
Created a lineup page with all characters instead of only a default character page.
Do a competitive analysis of the site I’m redesigning. I wish I would have also done one for the newer Space Jam movie as well. I think it would have really helped me think more about specific features I could design.