Multimedia

{
SUMMARY
}

I was the Lead UX/UI Designer responsible for: research, user flow, ideation, wireframing and high fidelity prototype.

I helped build MultiMedia, a provider of live streaming platforms with 900 Million page views a week, a game streaming platform for their broadcasters & viewers that resulted in an estimated 40% increase in viewer sessions length, 28% increase in broadcaster session length and grew revenue $100M for the organization.

FINAL ASSET: Game Selection: Search Field, Featured Game Carousel, Hover Interaction (expand Game Details), Game Selected.

FINAL ASSET: Game Developer Portal -Dashboard

FINAL ASSET: Game Developer Portal Website

{
PROBLEM
}

MultiMedia, a provider of live video streaming platforms (NDA protected) where broadcasters share their passions and earn money by recurring follower subscriptions and tips, lost revenue and faced user churn due to restrictions on video game streaming, causing broadcasters to switch platforms.

“We want broadcasters to stream video games with our members, not someone else’s”

-C-Level executive
MULTIMEDIA

Multimedia's platform 'MyLyfe' (platform name NDA) prohibited video game streaming.

{
SCOPE & AUDIENCE
}

On kickoff I began to narrow the business goals and KPIs speaking with C-level stakeholders. Constraints included: this project must be an MVP only, there wasn't much runway with Dev and any solution created needed to fit within existing patterns.

This was a large project with multiple user groups and user interfaces. Broadcasters and game developers were our primary users. Viewers were secondary users of our feature. We reached out to 3 high performing broadcasters (& 2 game developers) who had shown to play games during their stream for 1:1 remote interviews.

“Everyones requesting games, so I've been switching to Twitch. It sucks because I lose my ‘room’ here [number of viewers on their stream] and have to wait till they follow me and fill up my other room [audience on Twitch]. I just started jumping on Twitch at the same time as you guys [dual broadcasting] But I know I could get banned for that.”

-Broadcaster
(600K followers)

What are our Broadcasters needs to stream video games?

{
USER REQUESTS & COMPARATIVE ANALYSIS
}

I uncovered user demands through 1:1 interviews and by analyzing "new feature" request tickets for video game streaming. This highlighted an unmet need and solidified our understanding of user expectations for stakeholders.

I conducted thorough research on game developer needs on platforms like Twitch, Facebook Games, Steam & Giant Bomb, including signing up as a game developer on Twitch to understand their onboarding and requirements. And tested the game information uploading process from Giant Bomb to Twitch.

How do industry leaders add games to their library?

{
Double Diamond method
}

● I led the 2 person design team

● Conducted daily scrums

● Communicated directly with stakeholders

{
KEY FINDINGS
}

●Our primary users were: Broadcasters & Game Developers; Secondary users were viewers.

● Broadcasters had an experience expectation due to using other game streaming platforms.

● Game developers needed to be able to register with the company and catalog their games.

● Platforms like twitch use a opt-out system to catalog their games and use a web crawler for the site Giant Bomb to build their catalog.

● MulitMedia, wanted developers to OPT-IN instead, giving them clear permission to broadcast their copyrighted games and music.

“Any chance to get people to find my game really helps me out. Just don’t make me make multiple accounts to upload the meta data.”

-Indie Game Developer

Our users had an established mental model created by industry leading best practices.

What support do game developers need from a platform?

{
Define & Decide
}

MulitMedia restricted live video game streaming, causing broadcasters and their viewers to switch platforms when they wanted to stream games.

How might we leverage trends in live streaming, allowing game developers access and giving broadcasters permission to stream video games so that we increase revenue and session lengths?

{
research:
HEURISTIC UX Audit
}

I used ‘Nielsen Norman 10 Usability Heuristics for User Interface Design’ to conduct a heuristic UX evaluation of the current app. Using Severity Ratings to evaluate, I identified 50 pain points over 15 screens and supplied stakeholders with detailed reports to gather feature buy-in.

1: (Severity Rating: 3) Lack of clarity, may not follow standard common ‘profile setting’ standards ‘Edit’ needs to be represented differently

2: (Severity Rating: 4.5) Inaccurate validation of system status, Notification Badge seems to disappear at random

3: (Severity Rating: 5) Lack of user control, calendar has no integration with messaging, including reminders

4: (Severity Rating: 4) Lack of consistency and inaccurate system status, No notification of messages, alerts/emergencies in activity feed

{
Decide: HMW...
}

How might we improve Brightwheel’s messaging system so that it helps build trust, confidence, and accountability between educators and parents?

Must have core design values for our solution:
● Transparency: Who are the messages being sent to and coming from?

● Accountability: How confident are users that the messages are being received and/or read?

● Responsiveness: The system must inform users that an action was taken.

{
IDEATION & USER FLOWS
}

I designed a comprehensive user scenario that tackled both the broadcaster's and game developer's needs, resulting in well-defined user flows. The involvement of developers from the outset ensured a smoother building process, as dependencies were proactively addressed.

I modeled the game developer portal flow after an internal support page and the broadcaster flow after an existing pattern used to select broadcast settings options.

Game developer signup & game approval flow

Game developer user flow

{
GAME DEVELOPER PORTAL MVP (v1.0)
}

I designed a game developer portal within a video streaming site for registered game developers to add games, manage teams, edit assets, and track game approvals.

Visit the prototype >

Building the game developer portal prototype.

Game developer portal v1.0 built within the existing style guide.

{
BROADCASTER GAME STREAMING MVP (v1.0)
}

Our broadcaster flow followed similar patterns that they were used to, selecting custom settings before each broadcast. We kept this as familiar as possible to keep the learning curve low.

Visit the prototype >

Broadcasters are used to selecting features before their broadcast, this feature fit within Multimedia's established pattern.

{
FEEDBACK
}

Problem: What happens when you run out of resources like time and manpower?

Answer: You shelve the project.

The project was approved, but development couldn't justify the time to build the MVP while still fulfilling their responsibilities, so the decision was made to revisit it later.

Working with a Dev team with limited runway led to the project being shelved.

{
ITERATION & MVP (v2.0)
}

6 months later, new PMs picked this project to see if we could push it out.

C-level executives had changed the scope of the project: game developers would be given their own separate website to use as a dashboard with greater tools like analytics, and broadcasters would see an updated interactive game gallery to search & select their games like they’re used to seeing on other sites.

IA of the new stand alone Game Developer Portal website

Wireframe sketching for User Interface & Interaction Design

Broadcaster 'Select A Game' interaction: Search field with auto complete; game dropdown list and hover expand.

{
wireframes, prototypes, testing & stakeholder
buy-in
}

The next stage was putting our refined user tested sketches into digital wireframes. Using Figma, Sketch and InVision to accomplish this prototype I gave users the same tasks to accomplish. All users said the experience felt comfortable and easy to use.

Some key takeaways were:
Asset spacing, there was a risk of a ‘fat finger’ error when tapping buttons. Naming groups was not apparent and read receipts weren’t entirely clear.

With these changes in mind:
We created a walk through of the messaging screens used in this scenario and sent annotated wireframes to Brightwheel stakeholders to get everyone on board with the direction we were headed.

{
RESULTS
}

To date, internal user testing had been completed. Analytics estimated the company could see a 40% increase in viewer sessions length, 28% increase in broadcaster session length and grow revenue by $100M for the organization in it’s first full year.

Next steps would be to launch the MVP with a pre-populated catalog of games and few experienced broadcasters to test.

FINAL ASSET: Broadcaster game selection

FINAL ASSET: Game developer portal - analytics

FINAL ASSET: Game developer portal dashboard

FINAL ASSET: Game developer website

{
SUMMARY
}

{
PROBLEM
}

{
SCOPE & AUDIENCE
}

{
USER REQUESTS & COMPARATIVE ANALYSIS
}

{
Double Diamond method
}

{
KEY FINDINGS
}

{
Define & Decide
}

{
research:
HEURISTIC UX Audit
}

1: (Severity Rating: 3) Lack of clarity, may not follow standard common ‘profile setting’ standards ‘Edit’ needs to be represented differently

2: (Severity Rating: 4.5) Inaccurate validation of system status, Notification Badge seems to disappear at random

3: (Severity Rating: 5) Lack of user control, calendar has no integration with messaging, including reminders

4: (Severity Rating: 4) Lack of consistency and inaccurate system status, No notification of messages, alerts/emergencies in activity feed

{
Decide: HMW...
}

{
IDEATION & USER FLOWS
}

{
GAME DEVELOPER PORTAL MVP (v1.0)
}

{
BROADCASTER GAME STREAMING MVP (v1.0)
}

{
FEEDBACK
}

{
ITERATION & MVP (v2.0)
}

{
wireframes, prototypes, testing & stakeholder
buy-in
}

{
RESULTS
}

{
contact
}

REVITALIZING IN APP MESSAGING EXPERIENCE

CASE STUDY | BRIGHTWHEEL

Design a real time iOS threaded messaging system creating deeper connections between Educators and Parents.

{SUMMARY}

{PROBLEM}

{SCOPE & AUDIENCE}

{USER REQUESTS & COMPARATIVE ANALYSIS}

{Double Diamond method}

{KEY FINDINGS}

{Define & Decide}

{research:HEURISTIC UX Audit}

1: (Severity Rating: 3) Lack of clarity, may not follow standard common ‘profile setting’ standards ‘Edit’ needs to be represented differently

2: (Severity Rating: 4.5) Inaccurate validation of system status, Notification Badge seems to disappear at random

3: (Severity Rating: 5) Lack of user control, calendar has no integration with messaging, including reminders

4: (Severity Rating: 4) Lack of consistency and inaccurate system status, No notification of messages, alerts/emergencies in activity feed

{Decide: HMW...}

{IDEATION & USER FLOWS}

{GAME DEVELOPER PORTAL MVP (v1.0)}

{BROADCASTER GAME STREAMING MVP (v1.0)}

{FEEDBACK}

{ITERATION & MVP (v2.0)}

{wireframes, prototypes, testing & stakeholder buy-in}

{RESULTS}

{contact}

REVITALIZING IN APP MESSAGING EXPERIENCE

CASE STUDY | BRIGHTWHEEL

Design a real time iOS threaded messaging system creating deeper connections between Educators and Parents.

{
SUMMARY
}

{
PROBLEM
}

{
SCOPE & AUDIENCE
}

{
USER REQUESTS & COMPARATIVE ANALYSIS
}

{
Double Diamond method
}

{
KEY FINDINGS
}

{
Define & Decide
}

{
research:
HEURISTIC UX Audit
}

{
Decide: HMW...
}

{
IDEATION & USER FLOWS
}

{
GAME DEVELOPER PORTAL MVP (v1.0)
}

{
BROADCASTER GAME STREAMING MVP (v1.0)
}

{
FEEDBACK
}

{
ITERATION & MVP (v2.0)
}

{
wireframes, prototypes, testing & stakeholder
buy-in
}

{
RESULTS
}

{
contact
}