MyOrca
Redesigning to modern standards
Summary
In order to keep my skills fresh I decided to find ways to improve the MyOrca Website to improve clicks by creating and incorporating micro-interactions.
Role
UX Designer
Tools
Figma
Duration
Jan 2026
Read Length
8 min
What did I do?
UX Research
User Interviews
Web Design
Wireframing
Prototyping
Usability Testing
Overview
Currently the myOrca website is static and and dated. The information presented is dull and most users tend to overlook the information.
Current Orca Website
Defining the Problem
"It takes a bit of time for me to find what I'm looking for. I have to constantly click and look around."
Customers have trouble finding specific products in the website.
Other than the main products, there is no catalog or specific information on detailed products and availability on those products. There is a lack of product discovery which reduces the chance of a purchase.
Pain Points
Users can't find specific products
The website only shows generic titles and lacking details.
Lack of product info creates uncertainty
No product descriptions, details, specs, or images means users can’t make informed decisions.
Inconsistent colors causes distractions
Too many colors create visual noise and weaken the hierarchy, making it difficult where to focus attention.
Poor Navigation Slows Down the Shopping Experience
Generic titles with no hierarchy force users to click blindly
Objectives and Goals
Transforming Confusion into Clarity for a Seamless Shopping Experience
Goal 1
Help users quickly find what they are looking for.
Goal 2
Give users the information they need to feel confident and informed when choosing a product.
Goal 3
Create a clean, modern visual system that improves readability and guides user attention.
Research and Insights
Finding the Sweet Spot Between User Needs and Business Goals
Interviews
I interviewed employees and customers to understand the space and learn the perspectives of what information customers are looking for and what the business needs out of the website.
Push back
"Cards and Product prices shift like the stock market."
I suggested adding a product catalog. It raised push back as they had tried to implement one in the past and that it was difficult to maintain.
What they tried
Manually update prices
Third-party app price updater
Why it didn't work
Time-consuming and inefficient as card prices change every day
Became too expensive to keep
Advocating for the user
I shared a story with the owner …
This was to give them an idea of what customers go through and help them empathize what users go through when using their current website. This helped with easing in the suggestion of a good product catalog which could help avoid future customer frustrations.
Exploring
Jordan tried to buy a Black & White Pokémon booster bundle online for his son who's been asking for almost 3 months.
Lost
He checks the website which only showed brands such as Magic, One Piece, and Pokémon but they didn't provide information on which bundles.
Calling
After navigating vague categories and finding nothing, Jordan called and learned the cards were in stock at a nearby store.
Hopeful
With newfound hope they drove across town excited to buy the long awaited cards.
Frustrated
That hope quickly faded when they arrived to find the store had none, leaving Jordan frustrated and his son disappointed.
Respecting business constraints with user needs
Collaboration and compromise
The primary reason for avoiding a product catalog was maintaining up-to-date pricing. Continuously updating prices or paying for automated pricing services would add unnecessary cost and operational effort.
To strike a balance, I proposed removing price tags from the potential product catalog. Instead, the site would emphasize product details such as available card sets or expansions and the condition the product to spark interest and curiosity. This encourages customers to call or visit the store, increasing foot traffic and the likelihood of in-store purchases.
Ideation and Concepts
"Definitely in need of a visual facelift."
I did a visual heuristic evaluation of the current website to help lay out a plan of what the new design of the website would like and pointed out the following that needed improvements
Heuristic Evaluation
Visual
Hierarchy
Layout
&
Structure
Color
Principles
Improve
Consistency
Spacing
Branding
placement
User Focus
Competitive Analysis
I pulled inspiration through viewing numerous card websites. I focused on three that provided better visual hiechary which I adopted and adapted into my design solutions.
West Coast Sports Cards
Pros
Strong Visual Hierarchy
Product cards that show product details
Cons
Hero ad takes a large part of the site.
Numerous colors to take in
DJ's Sports Cards
Pros
Minimal Navbar
Easy to view
Cons
Needs improvement in spacing and alignment
Northwest Sports Cards
Pros
Strong layout
Product cards that show product details
Cons
Hero ad takes a large part of the site
Solutions
3 key points to solve
Work within the business goals
Enable technicians to view only the most relevant, actionable information at a glance.
Using Users’ Language
Clearly presenting all available product options to users so they can make informed choices with their purchases.
Familiar intuitive consistency
Creating social proof by showing customer reviews and ratings on products to build trust and support confident purchasing decisions.
Usability Testing
MVP
Solution 1
Visual Hierarchy - Familiarity
Created a layout that displayed product information in order for users to find the products they were looking for.
Solution 2
Improved navigation
Implemented bread crumbs, horizontal scrolling between products within categories.
Solution 3
Information that matters
Designed the product page that displays all the information the customer needs and created call to action buttons to assist user further to purchase products at the store.
Challenges
Implementing the solution in real time.
Due to budget constraints the owner opted not to adopt the designs that I had although there were metrics to validate that my design solution would increase foot traffic and provide return on investment.
Impact
Efficiency, clarity, and ease of decision-making
I measured my solution with users to get some metrics. Below are the metrics I tested with users with my solution.
Task Success Rate
90%
Users were able to complete task successfuly.
Click path efficiency
5 clicks
Customers were able to find products within 5 clicks
Customer Error rate
10%
Customers had only 10% errors.
Reflection
What did I learn?
There's only so much designers can do even with sufficient statistics and metrics when defending design solutions sometimes projects fall through and it is out of our hands at that point.
I left the door open in that if they ever do decide to continue that I would be more than happy to help and assist the design solution that I presented.
Future plans
As a designer I always want to learn, grown and improve my work. I do plan to come back to this project, do usability tests to improve the navigation flow to work on the information architecture and create more micro interactions in the site.