Yifan Yu / Gloria Hu / Hongyang Zhou
Final Project for CS 5356 Building Startup Systems (2024SP):
Full-stack development including front-end, back-end, API, and database hosting.
Yifan Yu / Gloria Hu / Hongyang Zhou
Final Project for CS 5356 Building Startup Systems (2024SP):
Full-stack development including front-end, back-end, API, and database hosting.
Steam AIO - A functional, customizable library to enhance sense of ownership and gaming experience.
Steam AIO - A functional, customizable library to enhance sense of ownership and gaming experience.
PROTOTYPE & DESIGN
PROTOTYPE & DESIGN
Web Application: Yifan Yu, Gloria Hu, Hongyang Zhou
UI Engineering: Gloria Hu
Figma Design: Gloria Hu
Front-End Development: Gloria Hu
Web Application: Yifan Yu, Gloria Hu, Hongyang Zhou
UI Engineering: Gloria Hu
Figma Design: Gloria Hu
Front-End Development: Gloria Hu
TOOLS
TOOLS
Figma
HTMl, CSS, and JavaScript
Visual Studio Code
MongoDB
Steam API
AWS Elastic Beanstalk
Figma
HTMl, CSS, and JavaScript
Visual Studio Code
MongoDB
Steam API
AWS Elastic Beanstalk
BACKGROUND
As gaming became more personal, the existing Steam platform had limited space for users to craft their own game world. Gaming should be exciting, fun, and customizable, but users lacked a true sense of ownership.
TARGET
We targeted active Steam users and used various design methods to develop a customizable library that enhances their gaming experience.
BACKGROUND
As gaming became more personal, the existing Steam platform had limited space for users to craft their own game world. Gaming should be exciting, fun, and customizable, but users lacked a true sense of ownership.
TARGET
We targeted active Steam users and used various design methods to develop a customizable library that enhances their gaming experience.
HYPOTHESIS
HYPOTHESIS
We hypothesized that current Steam users may want a customizable game library.
We hypothesized that current Steam users may want a customizable game library.
METHODOLOGY
METHODOLOGY
To test our hypothesis, we sent surveys and did interviews with various Steam users to see if their preferences and pain points matched our assumptions.
To test our hypothesis, we sent surveys and did interviews with various Steam users to see if their preferences and pain points matched our assumptions.
FINDINGS
FINDINGS
We asked if they wanted a customized game library, and 29 out of 32 survey users said yes. In the in-depth interviews, participants felt the same way. Here are quotes from our user interviews:
We asked if they wanted a customized game library, and 29 out of 32 survey users said yes. In the in-depth interviews, participants felt the same way. Here are quotes from our user interviews:
ALEX
As a daily Steam user, it's tough to keep track of my games. I often lose sight of what I own and what I want to play.
JORDAN
I use Steam to relax after work, but the current game profile interface doesn't feel personal. I want it to feel like I own a cool collection, not just a list of purchases.
YANGYI
The lack of good organizational tools on Steam is super frustrating. I need a way to customize my library to match my gaming habits and preferences.
ALEX
As a daily Steam user, it's tough to keep track of my games. I often lose sight of what I own and what I want to play.
JORDAN
I use Steam to relax after work, but the current game profile interface doesn't feel personal. I want it to feel like I own a cool collection, not just a list of purchases.
YANGYI
The lack of good organizational tools on Steam is super frustrating. I need a way to customize my library to match my gaming habits and preferences.
Why is it significant for Steam users
to have a customized game profile?
Much like designers using Figma to create personalized workspaces,
gamers desire a similar level of customization for their game libraries.
Much like designers using Figma to create personalized workspaces, gamers desire a similar level of customization for their game libraries.
DESIGN PRINCIPLES
DESIGN PRINCIPLES
01. Design
01. Design
Sketch and design user workflows and wireframes in Figma, ensuring an accessible and personalized game library experience.
Sketch and design user workflows and wireframes in Figma, ensuring an accessible and personalized game library experience.
02. Developement
02. Developement
Iterate through development, seamlessly integrating Steam's API and building the front-end, back-end, and database hosting to create a fully functional platform.
Iterate through development, seamlessly integrating Steam's API and building the front-end, back-end, and database hosting to create a fully functional platform.
03. Integration
03. Integration
Provide interactive features such as customizable game posters, ratings, and tagging to enhance game management, making it enjoyable and intuitive.
Provide interactive features such as customizable game posters, ratings, and tagging to enhance game management, making it enjoyable and intuitive.
HOW MIGHT ME
HOW MIGHT ME
Design an interactive and customizable library for Steam users that enhances their gaming experience by offering personalized visuals, a sense of ownership, and full control of game management?
Design an interactive and customizable library for Steam users that enhances their gaming experience by offering personalized visuals, a sense of ownership, and full control of game management?
OUR APPROACH
A web platform that introduces three key features to enhance the gaming library experience.
OUR APPROACH
A web platform that introduces three key features to enhance the gaming library experience.
1 /
GAME POSTER/GRID
1 /
GAME POSTER/GRID
Users can change their game grid posters, capturing and displaying favorite moments. This adds a personal touch and enhances the visual appeal of profile pages.
Users can change their game grid posters, capturing and displaying favorite moments. This adds a personal touch and enhances the visual appeal of profile pages.
2 /
GAME RATING
2 /
GAME RATING
Users can rate games directly on their profile page to remember favorites and improve their experience. After adding a rating, the "Rating" button changes to "Delete" for easy management.
Users can rate games directly on their profile page to remember favorites and improve their experience. After adding a rating, the "Rating" button changes to "Delete" for easy management.
3 /
GAME TAG
3 /
GAME TAG
Users can add tags or categories to organize their game library. Each game gets one tag, and the "Add Tag" button changes to "Delete" for simple updates or removal.
Users can add tags or categories to organize their game library. Each game gets one tag, and the "Add Tag" button changes to "Delete" for simple updates or removal.