Completed project
Theory Sabers
Redesigned product, mystery box, and cart flows with immersive UI and 3D visuals.
Project Scope:
UX/UI Design
Web Design
Tools:
Figma
Photoshop
Year:
2025
![](data:image/svg+xml,<svg display="block" role="presentation" viewBox="0 0 7 9" xmlns="http://www.w3.org/2000/svg"><g d="M 7 9 L 0 9 L 0 0 L 7 0 Z M 2.813 3.768 C 2.312 3.169 1.788 2.303 1.242 1.167 L 2.193 1.167 C 3.31 2.487 4.499 3.464 5.757 4.098 L 5.757 4.573 C 4.499 5.207 3.31 6.184 2.193 7.504 L 1.242 7.504 C 1.788 6.369 2.312 5.502 2.813 4.903 Z" fill="transparent" height="9px" id="itWK_lza3" width="7px"><path d="M 7 9 L 0 9 L 0 0 L 7 0 Z" fill="transparent" height="9px" id="BKWQFdJ3U" width="7px"/><path d="M 1.571 2.601 C 1.069 2.002 0.546 1.135 0 0 L 0.95 0 C 2.068 1.32 3.256 2.297 4.515 2.931 L 4.515 3.406 C 3.256 4.04 2.068 5.016 0.95 6.337 L 0 6.337 C 0.546 5.201 1.069 4.334 1.571 3.736 Z" fill="rgb(254, 251, 247)" height="6.33664px" id="jWM_PyynS" transform="translate(1.242 1.167)" width="4.51485px"/></g></svg>)
Project Scope
Scope:
Tools:
Timeline:
Collaboration:
Project Goals
Modernize the site experience, highlight product uniqueness, and make the site easier to explore — while keeping it on-brand and functional inside Webflow.
✦ Refresh visuals & improve layout structure
✦ Simplify complex shopping experience
✦ Create new landing pages (e.g., Colors, Mystery Box, Saber School)
✦ Optimize for desktop & mobile
Challenges
Theory Sabers had a unique product and passionate audience, but the existing website didn’t reflect the cinematic quality of the sabers. The old design was cluttered, outdated, and lacked structure. Additionally, complex product variations made the shopping experience overwhelming for new users.
Solution
I reimagined the entire user journey — breaking down complex product categories into modular, digestible sections. Pages were rebuilt with breathing room, focus-driven visuals, and smooth scroll interaction. I also added new educational and gamified experiences like Saber School and Mystery Box to increase engagement and brand personality.
Design Strategy
The visual direction was inspired by sci-fi interfaces and immersive product brands. I used dark themes, sharp typography, and consistent spacing to create visual depth. Layouts were made component-based to fit seamlessly with Webflow’s system, making future updates easy. Every detail — from hover states to iconography — was crafted to reflect the elegance and power of a lightsaber brand.
Live Link / Status
Status:
Live preview:
Let’s Build Something Great
Have a project in mind or just want to chat? Book a call or drop me a message. I’m always open to new ideas, collaborations, or helping you level up your product.
or