The Magick Cauldron
Redesigning a mystical e-commerce experience to improve usability, clarity, and trust while keeping the magic intact
Duration:
3 Weeks
Project at a Glance
This project focused on redesigning The Magick Cauldron, a local metaphysical shop in Houston that sells crystals, candles, books, and other spiritual tools. The existing e-commerce site had over 20 products but suffered from usability and navigation challenges. My goal was to restructure the site to make it more intuitive, aesthetically aligned with the mystical brand, and accessible for both new and returning customers. As part of my UI/UX bootcamp, this project required me to independently research, design, and test a fully functioning e-commerce prototype.
My Role
UX Designer
Researcher
Project Manager
Industry
eCommerce
Metaphysical shops
Challenge
The original website overwhelmed users with cluttered layouts, unclear navigation, and missing product details. Users had difficulty finding items, trusting product information, and completing checkout without frustration.
Through my evaluation, three main pain points emerged:
Disorganized navigation created confusion.
Product pages lacked clear information (uses, ingredients, reviews).
The cart and checkout process was long, unstructured, not mobile friendly.
How Might We create a simplified, trustworthy, and visually appealing shopping experience that encourages both discovery and purchase?
Design Process
Research
Competitive Analysis
Feature Analysis
Pluses and Deltas
Competitive Matrix
Business Analysis
User Interviews
Design
Wireframe
Hi-Fidelity Designs
Prototype
Synthesize
Affinity Mapping
User Persona
User Journey Map
Test
Usability Testing
Conclusion
Future Concept
Ideate
User Flow
Information Architecture
Research Techniques
Heuristic Evaluation
Audit of the current site
Stakeholder Interviews
Staff
User Interviews
4 user interviews and light usability testing
Affinity Mapping
UX Analysis
Business Research
C+C Analysis, Feature/Element Comparison
Research Phase-Listening to Users
I began with a heuristic evaluation and competitive analysis of other small e-commerce metaphysical shops. Then, I conducted user interviews with people who frequently purchase crystals and candles online. Finally, I tested the original site’s usability to observe where participants struggled.
Key insights included:
Users wanted fewer categories and less clutter on the homepage.
Trust came from clear product descriptions, reviews, and testimonials.
Shoppers appreciated guided paths like “Shop by Intention” to discover items.
A smooth and editable checkout process was essential for reducing cart abandonment.
Affinity Mapping-What did we hear from users?
Navigation & Findability
Users struggled with long, unclear drop downs
Preferred browsing by intention (e.g., “protection,” “abundance”)
Search didn’t always return expected items
Product Information & Presentation
Descriptions were inconsistent or vague
No usage guidance or customer reviews
Images didn’t always match user expectations
Trust & Checkout Experience
Checkout felt outdated and untrustworthy
Users unsure if payment went through
Visual design affected perceived legitimacy
Mobile Usability & Layout
Layout was hard to navigate on mobile
Buttons/menus were small or difficult to tap
Cart and filters were hard to find
User Persona-Who are we designing for?
Luna is a beginner in the metaphysical space who seeks clarity, trust, and emotional balance through her purchases. While she’s comfortable shopping online, she often feels overwhelmed by unclear navigation and a lack of trustworthy information. Her behavior emphasizes the need for intention based categories, clear descriptions, and a seamless checkout flow.
Key Points:
Motivation: To find calming, meaningful products that align with her emotional and spiritual needs.
Pain Points: Confusing site navigation, vague product descriptions, and no reviews to build trust.
Behaviors: Shops mainly on mobile, browses by aesthetic or feeling, and often abandons cart if checkout is unclear.
Needs: Clear guidance through intention based categories (e.g., “relaxation,” “cleansing”), trustworthy visuals, and easy navigation.
Goal: To confidently purchase items that support her emotional well-being without second-guessing or external research.
User Journey Overview - A Day in the Life
The user journey map illustrates how a first-time shopper discovers The Magick Cauldron, explores products, and navigates challenges before finally completing a purchase. The process revealed emotional highs and lows from curiosity and confusion to tension and eventual satisfaction highlighting where design improvements were most needed.
Key Insights:
Users felt curious yet unsure upon first landing on the homepage.
The cluttered layout caused confusion during product browsing.
Lack of reviews and clear product details led to hesitation.
The mobile checkout process was frustrating but ultimately successful.
Post-purchase, users expressed relief and satisfaction, suggesting potential for repeat buying if the experience were smoother.
Information Architecture- Improving Navigation with Card Sorting
Most users understood and used the categories correctly
Some items (like pendulums and sprays) caused confusion due to overlapping uses
Clearer product names and optional tags could improve navigation
Overall structure aligns well with user expectations
Sketches → Wireframes
I began with sketches and low fidelity wireframes to test layout options. Mid fidelity prototypes validated navigation structure, and high-fidelity designs brought in branding elements like patterns and typography.
Key design decisions included:
A clean navigation bar replacing overwhelming menus.
Card layouts with spacing for product lists.
Inclusion of testimonials and social media icons to build credibility.
A patterned footer to balance aesthetics with functionality.
Clickable Prototype
A reimagined e-commerce experience rooted in clarity and charm
High Fidelity Wireframes
Click to enlarge wireframes
Usability Testing
High-Fidelity Testing (Round 2)
The hi-fi prototype introduced final branding, imagery, and refined micro-interactions.
Testing verified whether aesthetic elements enhanced or distracted from usability.
Findings showed:
Improved color hierarchy and spacing made call-to-actions clearer.
Product pages with reviews and descriptive content increased user trust.
Checkout completion time decreased as users understood the process more intuitively.
Outcome: The final design balanced clarity with The Magick Cauldron’s magical aesthetic, creating a more trustworthy and efficient shopping experience.
Mid-Fidelity Testing (Round 1)
The mid-fi prototype focused on validating layout structure, navigation clarity, and checkout flow before investing in visuals.
Participants were asked to locate a product, add it to the cart, and complete checkout.
Findings revealed:
Users appreciated the simplified navigation and clear product categories.
Some confusion occurred around button hierarchy and the lack of visual feedback in the checkout process.
Several participants expected trust elements such as reviews and ingredient details on the product page.
Key takeaway: The structure worked, but users needed stronger visual cues and confirmation steps to feel confident completing purchases.
Implementing a Style Guide
Next Steps
If I could develop this design further I would:
Full mobile hi-fi designs for every page
Accessibility audit to meet WCAG standards
A/B testing homepage variations
Expanding the “Shop by Intention” section with curated bundles
Adding a blog or “Learn” section for deeper engagement when time allows
Lessons Learned
This project transformed The Magick Cauldron from a confusing site into a magical yet streamlined shopping experience. Deliverables included site maps, wireframes, prototypes, user flows, usability reports, and final hi-fi screens.
Lessons learned:
Balancing aesthetics with usability is crucial. While mystical branding was important, users needed clarity first. Testing early revealed that even small improvements like adding reviews or cleaning navigation had a big impact on trust and usability.
Looking ahead, I plan to apply these lessons to future e-commerce projects, ensuring designs remain both intuitive and engaging.