UI

PlayStation
‍UI Redesign

Setting
Timeframe
Deliverables
PlayStation Website Mobile & Desktop Redesign
3 Months
Solo Project for Digital Product Design
Challenges
The current PlayStation website is unorganized due to the use of multiple sub-webpages that offers different product & services. This creates makes navigating around PlayStation’s website confusing for new users.
Solution
Create a modern and clean UI to unify all information while emphasizing organic flow and consistency throughout the PlayStation website on both desktop and mobile.
The Process
The redesign of the PlayStation focuses on delivering the best experience when users are browsing through the website. The simple and sleek UI and visuals help guide users to find the product that they are looking for without clutter and confusion. The overall goal was to create a redesign that would not only look fresh and updated, but functional and with user expectations in mind.
Persona
Helen M.

Age: 45
Occupation: Real Estate Agent
Location: Dallas, TX
Helen is a mother of two young boys. She’s a very relaxed mother and not very strict on her kids. On her free time, she likes to watch Blu-ray movies and Netflix on the PlayStation 4 with her kids. Helen wants an easier time finding new games for her kids when browsing on the PlayStation website.
Example User Flow & Scenario
Mobile Version
Home & Menu
A component card greets the user & added emphasis on the headline captures the user’s attention.
PDP & Add To Cart
PDP includes a main video helps with engagement. Add to cart slides in from the right side, making the check-out process more seamless. The cart is also in a fixed position while scrolling.
Find A Product & PDP
The different categories are still accessible via the icons on top, creating an organic, seamless task flow.
Desktop Version
Home & Menu
A giant headline greets users when they visit the side—marking emphasis on the newest promotional content. Users can quickly learn more about the promotional content on the home page.
Find A Product
The product selection page includes relevant products for the category. The products are organized in a way that is easy to navigate and seems appealing to user by using the white background to create contrast. The filtering system is user-friendly and straight to the point for the desired category of products.
PDP
The PDP page has a significant emphasis on the trailer relevant to the product. There is an importance in the hierarchy levels to make sure that users see the relevant information first. Users can add to cart, read reviews, and access important information about the product.
Review
An overlay opens with the reviews for the product. The overlay is seamless and does not send the user to another page. Users can quickly close the review overlay by clicking the “X” or clicking the background to go back to the PDP page.
Add To Cart
The add to cart and checkout page are integrated. By clicking on the cart icon, users will be sent to this page. This page shows all the items added to the cart and also shows the quantity and total price.
Mobile PrototypeDesktop Prototype
Design System
Presentation Deck
Moving Forward
There are still a lot of improvements that can be made to the overall feeling of the website. Since this project was created before the PlayStation 5, the assets and visual direction available were limited. Thus, I believe that the UI can be made more visually attractive. Overall, the robust and sleek design is what I originally intended, and I think my vision for a PlayStation website that felt different and looked different was achieved.