top of page
.png)
UI Case Study
Role/Team
Graphic Design Student
1 Person Project
Tools
Duration
4 Months
Jan 2023 - Apirl 2023
Problem Statement
There are many websites and applications out there that suffer from outdated, visual designs that are there to help guide users. For this Graphic Design project, I was tasked with locating a system I deemed in need of a visual makeover, for that I chose Hobi.
Problem Objectives
-
Choose an application in need of redesign.
-
Figure out the functions behind the app.
-
Develop potential new functions between users.
-
Determine the users why and how they would use it.
-
Construct new wireframes for better navigation.
Design Process
.png)
Product Users
Qualitative Research
To start the research I began to document different types of media consumers and see how they would go about their day-to-day life watching shows. Things I took into consideration were:
-
Issues finding media
-
Looking for new media interests
-
How often do they watch shows/movies
-
Sharing media with friends
User Scenarios
"I am a binge-watcher looking to complete a couple of seasons of Yellowstone!"
"We are Nostalgic Viewers looking to rewatch some episodes of Adventure Time from my childhood!"
"I am a Casual Viewer looking to watch my shows for the week, but forget which episodes I need to watch."
A binge-watcher is someone who likes to watch a run of a program or movie for a quick amount of time. At the speed at which they each view they may want to update Hobi on their status. A motivational goal for the user would be to use the app as much as possible to not only keep track of their current progress but also show others who may be following to see what's going on. This may lead to likes on the update or comments talking about the piece of media.
The Nostalgia viewers are people who watch old content purely for the sake of reliving old memories. In terms of Hobi and what features it could offer, an extensive database might be in order. There is no telling what everyone watched growing up. Ensuring that the media database Hobi is pulling from is not only larger, but clearer on the browsing page as well to show as many options. Another section could also include recommendations to help the user find other similar media around that time they may have watched.
Finally, the casual viewer is just any one of us trying to get on to watch something, either old or new, with maybe a little trouble finding it. Features like those mentioned earlier could involve Hobi adopting a social area where a user can create a more defined profile. This profile can be linked and followed between accounts and other users of the application.
Site Map
After collecting data from the users who watched all kinds of media, I began to work on a skeleton framework by designing a site map based on the redesign of Hobi.
.png)
Sketches
Once the skeletal frame had been done, I began working on early sketches of a new design layout for the Hobi app. This took the previous user data collected to try and make a more streamlined approach with enhanced options.
Click on sketches to learn more!
Low-Fidelity Mockups
High-Fidelity Mockups
Click any of images with an "*" to see what changes I made to the design. Screens without "*" were made completely new by me!
Landing Page
Homepage - Filter*
Create Account*
Search/Quick Add*
Homepage*
Activity Page
.png)
Watchlist Page*
Most Popular - TV Shows*
.png)
Profile Page*
Challenges & Conclusion
By the end of the project, I was able to cover the general scope of what I wanted to capture for the redesign of Hobi. Well, taking some inspiration from other apps and websites I believe I was able to craft a well-structured streaming tracking app that benefited multiple kinds of media.
General challenges they face on the project, usually stem from a lack of identity or visual clarity on where certain objects and items should look and feel. However, I believe by the result, I was satisfied with the conclusion of this project, as it felt like a combination of all my efforts at University.
bottom of page