Riot Games · 2022

Concept

Testing live esports viewing

Ways to chat, switch streams and use multiview, tested with eight League of Legends fans.

Contribution: I designed the concepts and clickable prototypes, ran the sessions with fans and synthesised the findings.
Outcome: Five recommendations, received positively by Riot Games.

Role: UI/UX Designer
Platforms: Phone, TV and second screen
Timeline: Jan 2022, at Deltatre
Team: 2 UI/UX designers

Background

Testing ways to watch and react.

REN was Deltatre’s concept for watching esports, made for Riot Games. We tested which ideas matched what fans expected.

Sessions: Eight moderated sessions of about 45 minutes. Fans thought aloud with clickable prototypes.
Scenario: A pro match: cheer a play, check stats, switch to a player’s view, try multiview.
Order: The concept order changed every session.

What we tested

Two phone concepts. Three TV concepts.

Each area had two or three concepts.

Concepts tested on each screen
Area	Phone	TV
Chat input	Emoji wheel over the video Side panel with tabs	Wheel over the video Panel beside a smaller video Emoji row below
Chat feed	Inside the overlay Inside the panel	Over the video Beside the video Ticker below
Streams	Player list in the menu	Player row across the top
Multiview	Two streams side by side	Two streams side by side
Second screen	Chat and a replay card	A short alert on the match

Chat input

Wheel or panel for emoji chat.

Both used emoji only. The wheel had a send button; the panel sent picks after a short countdown.

4 of 8 fans
Chose the panel on the phone
3 Wheel · 1 Unclear
4 of 8 fans
Chose the panel on TV
3 Wheel · 1 Unclear
5 of 8 fans
Expected to type words, not only emoji

“Oh my god, that is awesome.”
P5 · Opening the wheel
“This one’s definitely more intuitive.”
P6 · The panel
“I want to discuss the game.”
P3 · Emoji-only chat

Finding 01Emoji alone felt limiting.

Fans enjoyed the playful wheel, but most still wanted to write about the game.

Video and chat

Ticker or vertical feed.

On TV, chat sat below the video as a ticker or beside it as a feed. Both made the video smaller.

7 of 8 fans
Found the ticker confusing or disliked it
4 of 8 fans
Wanted a smaller video
4 Full-size video

“When you think of live chat you would see it from the bottom.”
P1 · The ticker
“I’m not missing out on anything, the map is really important.”
P2 · The smaller video
“You’re cutting off the map.”
P3 · Chat over the video

Finding 02Chat reads from the bottom up.

Fans split on covering or shrinking the video, but both groups wanted the minimap clear.

Streams and multiview

Switching to a player’s view.

Fans switched to a player’s view, went back to the main event and tried two streams at once. On TV, OK opened the controls and ↑ showed the player row.

4 of 8 fans
Read the streams menu as a scoreboard or were unsure
6 of 8 fans
Pressed the D-pad first to open the menu
4 of 8 fans
Saw more value in multiview on TV

“I would call this the scoreboard.”
P3 · The streams menu
“If there was a back button that would be easier.”
P6 · Returning to the match
“This would be a really cool tool to use when I’m coaching.”
P3 · Multiview on TV

Finding 03Fans relied on familiar labels and buttons.

“Main event” and “Broadcast” were unclear, and on TV fans reached for the D-pad and Back first.

Second screen

Using a phone with the TV.

A linked phone handled chat. After a big play, the TV showed a short alert and the phone offered a replay.

6 of 8 fans
Liked replaying a big moment from the phone
4 of 8 fans
Found typing on a phone easier than with a controller

“You’re keeping the main view as-is and using another device to chat.”
P7 · The linked phone
“It’s so much quicker to type on the phone.”
P3 · Typing
“I’m not going to stop watching to click this.”
P3 · The replay card

Finding 04The phone talks, the TV watches.

Typing and replays felt natural on the phone, while the TV kept the match.

Outcome

Keep the familiar, then add the fun.

Fans enjoyed new ways to react, but only when the basics worked as they expected. The client received the results positively.

Pair reactions with text
Keep quick emoji, and add a keyboard and a clear send step.
Keep chat vertical
Use a feed that reads from the bottom up, and let fans hide it to clear the minimap.
Use plain labels and remote habits
Name the main stream plainly, and let any D-pad press open the controls.
Make multiview its own mode
Lead with it on TV, and keep two streams on a phone.
Let the phone do the typing
Move chat input to a linked phone, and keep replay prompts optional.

Next project

Volleyball World

Volleyball World · 2021

Concept

Thanks for stopping by.

Curious about the work? Let’s talk.

Say hello