Dreamedia

Dreamedia has been a media product on the market for two years with a freemium model that has a mobile-web experience and a mobile app for both iOS and Android. After two years of building up a user base, Dreamedia is looking to evolve features to set up for a premium (paid) product. The premium options are shown when users are signing up for Dreamedia along with displaying options through the app if the user is not a premium member.

Role: UX Researcher, UI Designer, & Usability Testing Moderator

Project Type: Personal Project, Mobile Application & Lifestyle App

Programs:

The Research

The research conducted for this project went into different business models such as freemium and subscription model. In addition to doing research into different industry leaders to gain insight into their strategies and how they offer their premium options

Persona

🎵 Tech-savy

🎵 Budget conscious

🎵 18-24 year old

🎵 Enjoy consuming different types of media

Style Guide

A style guide was created for Dreamedia to keep the design consistent. Different pages were created to hold various design elements, fonts, and colors. Check out the link for the full brand guide.

User flow

The user flow helped plan the pages needs and possible success/exit messages. Three user flows were created to see the different signup processes for premium. Going through the app, through the browsers, and through an app store.

Sketches

When beginning to design Dreamedia the home page, media page, sign up form and premium info page had low fidelity wireframes completed from the startup company. These designs were sketched and used as a reference for the other screens.

Image of Dremedia premium info page sketch

Guerilla Usability Testing

For the first set of usability testing, the method paper prototyping is utilized to test the functionality of Dreamedia. Paper prototyping is sketched wireframes on paper which the participant interacts with. The tester is responsible for changing screens and giving verbal feedback about possible animation that correlate with the action. Participants mentioned the lack of success and exit messages which in later designs were added.

Mockup

Wireflow

High Fidelity wireflows were created to see the route the user would take when creating an account with Dreamedia and signing up for a premium membership. Two variations of wireflows were created following the same task but differentiated based on the route taken.

Usability Testing

Through two rounds of usability testing, Dreamedia was able to progress with the user in mind. The first round of testing was conducted with the sketches using paper prototyping. Participants mentioned the lack of success and exit messages which in later designs were added.

The second round of testing used high fidelity mockups. Participants mention during the test the lack of a free trial opinion. Participants noted that they appreciate when products offer a free trial to test the product to see whether it’s worth their money. Participants found Dreamedia easy to use and appealing to look at.

Final Product

Throughout the process of creating Dreamedia certain elements of the UI design changes based on new ideas, trying to fit certain elements on one page and user feedback. Usability testing was a great way to test the design and functionality of the app to see what works and what needs improvement.