UpNext
UpNext
Role
UX Designer
UX Researcher
Visual Designer
Contributions
User Interviews
User Journey Map
Wire-framing
High-Fidelity Prototyping
Tools
Figma
Nebo
SurveyPlanet
Task
User Journey Map
User Research
Usability Test
Wireframe
Prototyping
Competitive Audit
User Flow
Duration
February 2024 - September 2024
Overview
This gaming e-commerce app brings simplicity and ease to purchasing products. With the ability to share what the user has purchased.
Issue
User feels that they have difficulty in locating the latest gaming items. With the inability to share the product they purchased or liked.
Research
Preliminary research was conducted to determine the need and space for this to be made with pain points and a competitive audit.
Pain Points
Competitive Audit
Competitive Audit Goal:
Compare the quickness and effectiveness of a gaming product reaching the user that they can share.
Key Competitors:
Amazon Direct
Walmart Direct
Steam Indirect
Playstation Indirect
Xbox Indirect
Type and quality of competitors' products:
Amazon : A direct competitor that has a vast range of quality gaming products.
Walmart : Is a direct competitor that has a basic range of quality gaming products.
Steam : Is an indirect competitor that has a very large range of a specific type of gaming products and the quality varies.
Playstation : Is an indirect competitor with very good specific quality gaming products.
Xbox : Is an indirect competitor and has good quality gaming products.
Competitors market position:
Amazon has themselves in a high position in the market due to their ability to get the product out quickly. What they could improve on is the initial front page of the app. It has information overload. Their audience is targeted to millennials. Age range from 13-55.
Walmart has themselves in a good average position due to their affordable prices. They should improve the variety of products they offer. Their audience is targeted at families and single person households. Age ranges from 13-75.
Steam is in a dominant position offering a large range of products for a singular platform. Could improve with better organization of their website due to the vast majority of games they offer on a singular platform. The audience Gamestop attracts is avid gamers and single individuals. Determined age range is 17-45.
Playstation’s position in the market is steady because they have good quality products that attract their audience. Due to their success in branching out to one platform they could begin to branch out to another. The audience they have relates to families and single individuals. Age range is 13-40.
Xbox's position in the market is unique due to what they currently offer. The improvement they could do is to better visualize their marketplace. The audience they have relates to families and single individuals. Ages range from 13-40.
Competitors talk about themselves:
Amazon sees themselves as being a top company because they offer the quickest availability to getting the customer their product. The app's products feature and benefits a subscription service with exceptional delivery time. With the product value being explained as a very cost efficient product. That enables its users to receive their product as fast as possible through their yearly subscription service.
Walmart talks about themselves as offering the best affordable prices in the market. The app’s features and benefits include a reasonable subscription service with a clean and concise app visualization. Their product value can be explained as offering affordable products with a subscription service that adds to their overall experience. With reliable delivery and an app with iconic user visualization.
Steam sees themselves as the dominant marketplace that fixates on one platform. Their website and app’s product features and benefits providing good products through discounts and offering a very organized app. The product's value is explained to be enriched with a large catalog, good sales and an in-depth app to find what you’re looking for.
Playstation sees themselves with great success with being able to solidify their own community. Their app’s features and benefits as a valuable subscription service and has high quality products that leaves the customer coming back. The app’s value is explained to be high quality and signifying great branding.
Xbox views themselves as a unique and innovative with never before seen subscription service with consistent branding. Their app’s features and benefits offer a very beneficial subscription service with iconic visual design that’s plated from generation to generation. Overall the app’s value is explained as having a groundbreaking subscription service model with consistent visual design throughout the years.
Competitors' Strengths:
Amazon's strengths are having an unparalleled subscription service that gives you the product within 2 days and an easy to use website/app interface.
Walmart's strengths would be in its ability to have discounts on multiple products, iconic branding and welcoming website/app design.
Steam's strengths are having the largest gaming catalog for one specific platform, always having great discounts on games and a very in-depth application.
Playstation's strengths are having high quality products that keep their audience wanting more and a very creative and unique app unlike any competitor.
Xbox's strengths include offering a subscription service model that gives its audience the best deal and consistent app design that is familiar to their audience.
Competitors' Weaknesses:
Amazon's weaknesses include its subscription service being at a high price and an information heavy interface.
Walmart's weaknesses are not having a bigger catalog and lower tier quality items available.
Steam's weaknesses would be that they don’t offer delivery services for games (only have digital games) and their website looks outdated and needs a modern touch.
Playstation's weaknesses would include that they only offer the majority of their products on one platform and their interface may be to difficult for the average user to use.
Xbox’s weaknesses are that their products have diminished in quality, not enough unique products to maintain a good foothold for their subscription service, and none innovative user interface on their website.
Gaps the competitors have:
Amazon has a gap with needing a more welcoming website/app that’s not information heavy. Also could offer better features for users who are not interested in the subscription service model.
Walmart's gap occurs where its website is currently only being shown in English only. Alongside there being no voice to text for the search bar.
Steam's gap is with its lack of innovating a new look to their app with margins and space that can be filled. The next gap is that their text is very small and hard to read. Also the search bar is difficult to find.
Playstation's gap comes in where they could offer better thing for their subscription service, begin to branch out their exclusive content to other platforms and simplify their mobile app more welcoming to newer users.
Xbox has gaps in a stagnant UI on their website/app, not enough sales or discounts being displayed, and overall better quality items.
Viable Opportunities:
Some opportunities that UpNext can take advantage of is having a voice to text in the search bar, a valuable subscription service that offers not only a great deliver time but also good discounted products and finally a good UI layout that is not only unique and creative but easy to use.
User Journey
Meet Matthew Bean
User Journey Map
User Flow
Early Design Ideation
Paper Wireframe Sketches
I drew 5 different baseline sketches with one having a combination of them with best possible feel and look that would make it accessible for the user. To determine this I referred to looking at different apps that suited the user.
Low-Fidelity Wireframes
Below represents this wireframe showcases a user flow for an e-commerce platform, focusing on the purchase journey and profile management. There is a clear navigation structure with a persistent bottom navigation bar for quick access to core sections like 'Equipment', 'Deals', and 'Clothing'. The flow begins with browsing on the 'Home Page', leading to a 'Selecting Equipment' screen with a detailed product view and 'Add to Cart' functionality. The 'Order Screen' then allows users to adjust quantities and view a subtotal. 'Order Preview' provides a summary before the 'Checkout Info' screen finalizes the purchase with shipping and payment details, culminating in a confirmation message. A separate 'Profile Page' mockup outlines key account management features like order history and payment details. The consistent use of placeholder imagery and generic '$$$' pricing allows for a focus on layout and functionality.
User testing Low Fidelity wireframes
This bar graph below illustrates the results of a low-fidelity wireframe usability test, showing the number of participants who understood each of the three tested prompts. Prompt 1 had the highest comprehension with 6 participants, while Prompts 2 and 3 were understood by 5 out of 6 participants each.
High Fidelity
Sticker Sheet
This sticker sheet demonstrates attention to visual hierarchy with varied typography. I also took into consideration for users with low vision that has explicit color contrast information. I've provided color palette needs to be evaluated for WCAG compliance in its intended use. Overall, I recognize the visual organization in this sticker sheet, I also see that the accessibility requirements need to be more explicitly stated.
High Fidelity Usability Test Results
Audience
For the usability test research was conducted towards finding an audience to be tested on. That consisted of age, hours the user spends on gaming related apps and engageability. Came along to have 5 users that were between the age of 23 and 44. With the average age being 29.2, all having more than 5 hours on a gaming related app. All with different backgrounds and careers.
Methodology
The method that was done for this test was done remotely to ensure convenience. To have real world context with the participants very own hardware and this gives me a wider participation pool.
Results
A scoring method was used during the Usability Test from 1 to 5. 1 being that the participant strongly disagrees while 5 means that the participant strongly agrees. I had 8 questions in total during the usability test with 7 of them being scoring quetions and the final one being a open ended question asking if they had any feedback to give.
Takeaway
Challenges
This project presented the dual challenge of requiring rapid proficiency in a novel software application alongside the logistical complexities of recruiting and executing usability testing within a constrained timeline.
What I Learned
From this project I have learned a considerable amount of information that has reinforced my adaptability, curiousity, time mangement and most importantly emphasizing my design process.