Aiding Backstage Communication
Before a show can occur, an orchestra of communication must occur between teams in perfect harmony, Relay was conceptualized to improve it.
DURRATION
10 Weeks
ROLE
Product Designer | Home Page
TOOLS
Figma, Figma Make
STATUS
College Concept
AT A GLANCE
Before, during, and after a show, hundreds of workers are expected to work in unison with outdated technologies and practices. Information gets lost due to unclear or temporary communication where tools at hand are not built for friction or risk.
I acted as a product designer focusing on the home page of our digital interface called Relay. I owned this page primarily as well shaping the visual style of the app. This was alongside 3 other designers focusing on other parts of our solution.
-74% Decrease
Uploading screenshot time
+140.6% Increase
Confidence in preforming actions
+175% Increase
Formatting text successfully
REDESIGN OUTCOMES
Adapting flows, not getting rid of them
A dashboard that changes with the team
On the home page of Relay, the dashboard showcasing relevant information also changed per the situation that the team is in. This is mainly seen in three stages, pre-show, show, and post show, and will update accordingly.
Confidence to complete tasks rose by 140.6%
Users went from 36% confident to 88% confident that their screenshot landed where it should. Surfacing what Steam already tracks made the outcome visible and not random guessing.
Task success for formatting rose by 175%
Swapping raw HTML inputs for modern formatting controls took success from 36% to 100%. Removing another blocker that held back from truly expressing oneself when posting.
Designing past the "designers paradise"
While it would be nice to create UI without no constraints, to fully ground this project I went back and rebuilt the prototype against their actual patterns. What came from this was a working mix of the AI-driven concept and Steam's existing system.
KEY MOMENTS
Three-step Research Process
This project put us in the minds of a researcher first before thinking of how we could design solutions. In this, we tested the current system with cross-referenced heuristic evaluations using NNG rating scales. We then ran two usability tests with the current and proposed system to provide metrics.
21 Heuristic Evaluations
(Current product)
11 Usability Tests
(Current product)
8 Usability Tests
(Proposed product)
IMPACT
Making it easier to participate
Community impact is hard to measure, but interaction we would want to track is users unfamiliar with the community; to see outside interaction outside of the power users shows that our improvements allow for more participation. Since this is a student project we can theorize, but this is what I would like to track.
(Expected Metrics to Track)
% of existing Steam users who who post/upload for the first time
% of first-time community posters who post again within 30 days
% of screenshot upload volume per active users
REFLECTIONS
To takeaway into my next opportunity
Normally I'm the one getting the tasks and giving my schedule to the PM, so this was pretty different…
Do what you love.
This may sound redundant since every Etsy poster has this on it, but seriously it changes the way you approach things. I have been a long time Steam user and being able to work on this was FUN. Talking to users and solving an issue I had stake on was so refreshing.
A team isn't built on results
While my team was absolutely jaw dropping every time we delivered our updates, it was the progress, the late night Figma calls which made it. This was the first time I truly stepped into this leader role and it felt right. While this work is on my website, it wouldn't have depth without them <3
