Tabu E-Commerce Website Design & Development

Client: Tabu (https://www.heytabu.com/) Industry: Health & Wellness E-Commerce Role: UI/UX Designer • Figma Designer • Shopify Developer (Replo) Tools: Figma • Shopify • Replo Page Builder

Tabu is a modern wellness brand offering intimate health products designed to empower users with science-backed essentials. Their Shopify storefront needed a fresh design system that reflects the brand’s premium identity, while delivering a seamless shopping experience across devices. Tabu

For this project, I led the design and development workflow — from crafting pixel-perfect visual prototypes in Figma to building responsive Shopify pages using Replo’s page builder. The result is a cohesive, high-performance online store that balances visual storytelling with conversion-focused functionality. replo.app

Create a visually engaging and intuitive UX/UI that aligns with Tabu’s brand positioning.

Ensure a smooth, responsive shopping experience across mobile, tablet, and desktop.

Convert Figma designs into fully functional Shopify pages with Replo.

Optimize page layouts for clarity, accessibility, and conversion.

Enable easy editing and content updates via Replo’s intuitive editor.

Full page layouts and UI design system created in Figma.

Visual hierarchy focused on product clarity, benefit-driven content, and storytelling.

Implemented the design into Shopify using Replo Page Builder to preserve responsiveness and visual fidelity.

Built custom sections and dynamic components for the homepage, product pages, and collection views. replo.app

Optimized image assets and layout structures for fast load times.

Ensured mobile–first interactions and intuitive navigation throughout the site.

Configured editable Replo components that allow the client to update banners, collections, and page content without developer assistance.

Discovery & Planning Mapped user journeys and identified key conversion pathways for products and landing sections.

Figma Prototyping Designed high-fidelity screens in Figma with consistent styles, responsive layouts, and reusable components.

Replo Integration Leveraged Figma-to-Replo workflow to translate visual designs into functional Shopify pages quickly and efficiently. replo.app

Responsive Build & QA Built pages in Replo and fine-tuned layouts for all breakpoints, ensuring interactions and visual balance on every device.

Launch & Support Delivered final pages, verified cross-browser compatibility, and provided post-launch tweaks for optimal performance.

Responsive, mobile-first design with prioritized performance.

Replo-powered Shopify pages with dynamic content sections.

High-impact product showcases and clarity-focused layouts.

Optimized shopping experience from discovery to checkout.

Content blocks that are editable without code.

A polished brand experience that strengthens customer trust and retention.

Faster development time achieved through efficient Figma → Replo workflow.

Empowered the client with edit-friendly tools to update content independently.

Enhanced product presentation that supports browsing and conversion.