Disney+ and Marvel
Integrating the Marvel Unlimited comics experience into the Disney+ service.
Overview
With the growth of online streaming, and the success of the Disney+ series Wandavision, there has been an uptrend on online forums of young girls being inspired to learn more about their favorite characters from this series, and an interest in purchasing comic books.
Scope and Focus
Adding a feature to the Marvel movies collection within the Disney+ app, to let users look up comics lore. This feature would allow the user to learn more about specific characters. It would also enable purchasing of related comic books, as Marvel has a digital comics app.
Problem
Historically, comic book stores have not been welcoming places for females. How can we increase comics readership in this demographic of Disney+ subscribers?
Solution
Integrate the existing Marvel Unlimited comic book app into the Disney+ streaming service as its own category of content. Provide additional information about the characters, differentiating between their MCU and comic book representations, to increase engagement and increase comic book readership.
My Role
- UX Researcher
- UX Designer
- UI Designer
Project Duration
April - May 2021
Project Planning:
I used Notion to prepare for this design project. Having a solid organzation of tasks to complete was essential to maintaining a tight deadline. Within Notion, I provided myself one week for each UX design phase while still giving myself time to ideate and reflect on the work I completed in the previous phase.
Research
Market Research
Exploring Users Behavior Online
- Users are flocking to Reddit while watching their favorite Marvel series to share fan theories and easter eggs. Reddit has been able to create a community for fans of the MCU.
YouTube
- YouTubers have created videos where they deep dive into Marvel Content and share their knowledge on easter eggs and fan theories.
Fandom
- Fandom is filled with a lot of information about Marvel comic book characters, provided in a wiki-style format that users can collaboratively edit and share information.
Comic Beats
- Reported 46.67% of comic book fans are female.
Bleeding Cool
- In 2019, Bleeding Cool reported 37% of comic books are bought by women.
As self-reported fans of comic books, women are a growing demographic; however, purchases of comic books are still low in this group.
User Interviews
I met with 7 users who all identified as female, via Zoom to discuss their behaviors when consuming Disney+ and Marvel content.
What I was interested in learning:
- Are users interested in learning about the comic book versions of Marvel's cinematic character representations?
- Are users interested in reading comic books after viewing MCU films and tv series on Disney+?
What I learned:
- After viewing Marvel content on Disney+, users were researching comic book characters on Wikipedia and Google.
- Users who read comic books spent time in online forums engaging in discussions about the cinematic content they'd watched.
- Users who did not read comic books felt that comic books weren't accessible to them.
Define
Sketching to Solve the User's Problem
With the user personas of Sarah and Stephanie in mind, I began to sketch out ideas. Early on in the ideation phase, I explored how users would access comics on Disney+. I also sketched out the character page, as well as an Easter Egg feature embedded in the viewing experience, which I later scrapped.
Due to the time constraints and the challenge of integrating the digital comic books, I focused on developing ideas around how best to provide digital comic books within Disney+.
Below are a few of the early sketches.
Discovering the placement of the new feature
I developed a site map and user journey to help define the feature further.
While the persona of Stephanie was likely to upgrade her account after seeing the hero image, Sarah would be more likely to upgrade after viewing additional information on the character page.
Lo-Fi Wireframes and concerns over spoilers
With the site map and user journey further defined, I revised the sketches from earlier to design a set of wireframes. Early in the development of the feature, it was important to lock character profiles so as to not show spoilers.
Below are wireframes of how this feature would behave in the site. Views of the show WandaVision would unlock individual character pages after watching specific episodes.
Design
What If... you could read comics in Disney+?
Disney+ currently offers a feature called Premiere Access, which is a paid upgrade within the app, that grants access to newly released cinematic Disney titles. Let's explore how our personas would sign up to integrate Marvel Unlimited into their Disney+ accounts in a similar fashion.
Within the Disney+ streaming service, I created a new upgrade flow. From the homepage, users would be presented with a large banner advertising the Marvel Unlimited service. Clicking on that would drive them to the following screen, where they could upgrade their accounts. As Marvel Unlimited is currently an app with its own subscribers, users could also link their accounts at this point.
Easily access comics from the home page
Disney+ subscribers that have upgraded their accounts to include Marvel Unlimited content would now be able to access it through a new category on the home page.
Creating a new section for comic books on Disney+
To fully integrate the Marvel Unlimited app into Disney+, a new landing page was created where users could search for comics, with some listed recommendations and new additions. This is consistent with the design language of the rest of the Disney+ categories.
Styling the comic book details page
Once a user clicks into a comic book from the previous page, they would be presented with additional information about that title. This mirrors the design language used for the individual movie detail pages. The series issues tab is analogous to a listing of TV episodes.
Linking the movie and comic profiles
There are often key differences between the comic book characters and Marvel's cinematic representations of them. This feature allows the user to easily switch between the two profiles to compare the information.
Validate
Testing with our users
I met with three users who all identified as female via Zoom with screen sharing enabled for Usability Testing of the prototype.
What I learned:
- All users felt the sign-up page was unclear. They would like to see an additional screen where they would be providing their payment information. Also, the free trial offer requires further clarity.
- All users understood that Marvel Unlimited was an existing app and did not expect to see the new channel within Disney+.
- Two of the users wanted to click on the comic book art to start reading; however, they noticed the "Read Now" button several seconds later.
- All users responded positively to the comic and movie character profile feature. However, there were some known issues with the magic tool in the prototyping tool Framer.
High Priority Revisions:
- Redesign the upgrade flow. The review page required additional information.
- Redesign the confirmation page and look at the language regarding the new channel. Information was unclear about what the user was actually upgrading in their account.
Low Priority:
- Update the Marvel Unlimited channel homepage to display the comic book titles alongside the cover art.
- Look into the "Read Now" button hierarchy.
- Adjust the prototype transition between comic and movie profiles on the character detail screen.
The Revisions I Made:
- Removed the language regarding the app download; users who signed up felt that the upgrade would only give them access to an external app.
- Made changes to the language of the button the pricing page to indicate billing instead of confirming.
- Added in an additional billing details page with credit card information and more transparent details regarding the free trial offer.
- Removed the QR code from the completed account upgrade summary page and added in details for how the user could now access the new category within Disney+.
Final Design
View Prototype In Framer
Thanks for reading!
Here's a few more of my case studies.
Mean Street Tattoo
A responsive website design for a tattoo shop, where the artists can showcase their work and allow their clients to book appointments.
