Excaliberpc
Official website for purchasing high-performance gaming laptops and custom-built PCs.
Client
Academic Project
Team
Solo UX Designer
(Ganesh Jegan)
Industry
E-commerce
Duration
4 Months
Service
User Research
UI design
Usability testing
Challenge
I stumbled upon ExcaliberPC’s website and noticed it was full of usability hiccups. When my roommate mentioned his own frustrating experience buying a laptop there, I knew I had found the perfect challenge! It was a great chance to dive in and transform a clunky user journey into a seamless, enjoyable one.
Results
The ExcaliberPC redesign addressed key usability issues with improved navigation, a cohesive design system, and a streamlined checkout process, boosting navigation efficiency by 30% and usability score by 18%. A kiosk prototype further bridged digital and in-store experiences, enhancing the user journey
30%
Enhanced user flow and navigation clarity.
80%
Simplified product discovery process.
18%
Improved overall design and accessibility.
User Research
Research
Heuristic Evaluation
User Survey
User interviews
Is Your Product Description Helping or Confusing?
Product details are overly technical and lack clarity, making it difficult for users to understand features and make informed decisions.
Gaming keyboards and mice, highly sought after by users, are not prominently featured or marketed effectively.
The site doesn’t effectively highlight performance filters, despite it being the top priority for 90.9% of users selecting laptops.
Important information, like performance highlights or standout features, isn’t immediately visible.
63.6% of users rely on online reviews to make purchase decisions, highlighting the importance of integrating customer feedback and expert opinions.
"As a gaming enthusiast, I want a website where I can easily find the best-performing products, read reliable reviews, and explore accessories that match my interests, so that I can make confident and informed purchase decisions."
User
Persona
After evaluating, and performing user research, I created 3 personas for each kind of user that would be the audience for the website. This persona creation helped in having a deeper understanding of the user's needs and requirements.
Usability testing
Usability testing
Test planning
Issues identification
Task performance tracking
Preferred solutions
Is Your Website Usable or Frustrating?
I analyzed usability testing data to simplify product descriptions, enhance navigation, and streamline the checkout process, addressing user struggles with clarity and usability to improve their overall shopping experience.
6
Usability Issues
5
Participants
76.7%
Success Rate
5
Areas Tested
Brainstroming and Ideation
Ideation
Sketching
Low- fidelity design
High- fidelity design
Tool Used: Figma
Approach: Using the HTML-to-Figma plugin, I imported the website structure into Figma and sketched a redesign based on user insights. After refining the design to meet requirements, I conducted another round of usability testing, focusing on major updates to the homepage, product listing, product display, and checkout pages.
Homepage Idea
Dynamic Product
Highlights
Help users discover what they need effortlessly with trending products, tailored recommendations, and exclusive deals, all showcased through dynamic banners that guide them seamlessly.
Product Display Page Idea
Key Specifications
at a Glance
Show key product specs clearly and make comparing similar products effortless with a side-by-side feature.
Project Description Page Idea
Crisp and clear information
Presented product descriptions in a clean, straightforward format, focusing on what users care about most: key features, performance highlights, and practical benefits.
Added Features
Introducing our new Product Comparison Table and Recommendation Section!
Easily compare key specs like performance and pricing side by side to find the perfect fit for your build. Plus, get personalized suggestions for compatible upgrades and accessories, making your custom build experience smoother than ever!
Reflections
This project was a great learning experience in identifying real-world usability issues and developing solutions that focus on user needs. I was able to enhance the overall user experience and improve website functionality, leading to an increase in user satisfaction.
Official website for purchasing high-performance gaming laptops and custom-built PCs.
Client
Academic Project
Team
Solo UX Designer
(Ganesh Jegan)
Industry
E-commerce
Duration
4 Months
Service
User Research
UI design
Usability testing
Challenge
I stumbled upon ExcaliberPC’s website and noticed it was full of usability hiccups. When my roommate mentioned his own frustrating experience buying a laptop there, I knew I had found the perfect challenge! It was a great chance to dive in and transform a clunky user journey into a seamless, enjoyable one.
Results
The ExcaliberPC redesign addressed key usability issues with improved navigation, a cohesive design system, and a streamlined checkout process, boosting navigation efficiency by 30% and usability score by 18%. A kiosk prototype further bridged digital and in-store experiences, enhancing the user journey
30%
Enhanced user flow and navigation clarity.
80%
Simplified product discovery process.
18%
Improved overall design and accessibility.
User Research
Research
Heuristic Evaluation
User Survey
User interviews
Is Your Product Description Helping or Confusing?
Product details are overly technical and lack clarity, making it difficult for users to understand features and make informed decisions.
Gaming keyboards and mice, highly sought after by users, are not prominently featured or marketed effectively.
The site doesn’t effectively highlight performance filters, despite it being the top priority for 90.9% of users selecting laptops.
Important information, like performance highlights or standout features, isn’t immediately visible.
63.6% of users rely on online reviews to make purchase decisions, highlighting the importance of integrating customer feedback and expert opinions.
"As a gaming enthusiast, I want a website where I can easily find the best-performing products, read reliable reviews, and explore accessories that match my interests, so that I can make confident and informed purchase decisions."
User
Persona
After evaluating, and performing user research, I created 3 personas for each kind of user that would be the audience for the website. This persona creation helped in having a deeper understanding of the user's needs and requirements.
Usability testing
Usability testing
Test planning
Issues identification
Task performance tracking
Preferred solutions
Is Your Website Usable or Frustrating?
I analyzed usability testing data to simplify product descriptions, enhance navigation, and streamline the checkout process, addressing user struggles with clarity and usability to improve their overall shopping experience.
6
Usability Issues
5
Participants
76.7%
Success Rate
5
Areas Tested
Brainstroming and Ideation
Ideation
Sketching
Low- fidelity design
High- fidelity design
Tool Used: Figma
Approach: Using the HTML-to-Figma plugin, I imported the website structure into Figma and sketched a redesign based on user insights. After refining the design to meet requirements, I conducted another round of usability testing, focusing on major updates to the homepage, product listing, product display, and checkout pages.
Homepage Idea
Dynamic Product
Highlights
Help users discover what they need effortlessly with trending products, tailored recommendations, and exclusive deals, all showcased through dynamic banners that guide them seamlessly.
Product Display Page Idea
Key Specifications
at a Glance
Show key product specs clearly and make comparing similar products effortless with a side-by-side feature.
Project Description Page Idea
Crisp and clear information
Presented product descriptions in a clean, straightforward format, focusing on what users care about most: key features, performance highlights, and practical benefits.
Added Features
Introducing our new Product Comparison Table and Recommendation Section!
Easily compare key specs like performance and pricing side by side to find the perfect fit for your build. Plus, get personalized suggestions for compatible upgrades and accessories, making your custom build experience smoother than ever!
Reflections
This project was a great learning experience in identifying real-world usability issues and developing solutions that focus on user needs. I was able to enhance the overall user experience and improve website functionality, leading to an increase in user satisfaction.
Official website for purchasing high-performance gaming laptops and custom-built PCs.
Excaliberpc
Challenge
I stumbled upon ExcaliberPC’s website and noticed it was full of usability hiccups. When my roommate mentioned his own frustrating experience buying a laptop there, I knew I had found the perfect challenge! It was a great chance to dive in and transform a clunky user journey into a seamless, enjoyable one.
Results
The ExcaliberPC redesign addressed key usability issues with improved navigation, a cohesive design system, and a streamlined checkout process, boosting navigation efficiency by 30% and usability score by 18%. A kiosk prototype further bridged digital and in-store experiences, enhancing the user journey
30%
Enhanced user flow and navigation clarity.
80%
Simplified product discovery process.
18%
Improved overall design and accessibility.
Brainstroming and Ideation
Tool Used: Figma
Approach: Using the HTML-to-Figma plugin, I imported the website structure into Figma and sketched a redesign based on user insights. After refining the design to meet requirements, I conducted another round of usability testing, focusing on major updates to the homepage, product listing, product display, and checkout pages.
Homepage Idea
Dynamic Product
Highlights
Help users discover what they need effortlessly with trending products, tailored recommendations, and exclusive deals, all showcased through dynamic banners that guide them seamlessly.
Product Display Page Idea
Key Specs
at a Glance
Show key product specs clearly and make comparing similar products effortless with a side-by-side feature.
Added Features
Easily compare key specs like performance and pricing side by side to find the perfect fit for your build. Plus, get personalized suggestions for compatible upgrades and accessories, making your custom build experience smoother than ever!
Project Description Page Idea
Crisp and clear information
Presented product descriptions in a clean, straightforward format, focusing on what users care about most: key features, performance highlights, and practical benefits.