Pico | High-End E-commerce Platform for Mosaic Tiles by Capi ProductPico | High-End E-commerce Platform for Mosaic Tiles by Capi Product
Built with Webflow

Pico | High-End E-commerce Platform for Mosaic Tiles

Capi Product

Capi Product

Verified

Project Overview:

Pico is an importer of high-end mosaic tiles, requiring a clean, modern, and easy-to-navigate e-commerce website that aligns with the brand's aesthetic.
The website must be scalable and allow for ongoing product updates.
Hero Section
Hero Section

Challenge:

a. Managing Dual Pricing Levels

The primary challenge was to show different prices to different customers. Pico needed a way to keep wholesale (trade) prices hidden from the general public, only revealing them to approved partners after they register and log in. This required a secure system that differentiates user types without making the website difficult to navigate for regular visitors.

b. Manual Invoicing and Data Sync

Before the new site, handling invoices and purchase orders was likely a manual task. The goal was to eliminate this friction by connecting the website directly with Xero. The challenge lay in ensuring that every order automatically generates the correct paperwork, reducing the risk of manual errors and saving the team hours of administrative work.

c. Scaling a Minimalist Interface

Maintaining a "clean and modern" look is difficult when you have over 50 different product SKUs and complex shipping requirements. The challenge was to keep the interface very simple—using a strict palette of white, grey, and beige—while still including custom order forms and automated email triggers without making the site feel cluttered or overwhelming on mobile screens.

Our Role:

UI Design: Developing the information architecture, design concepts and custom interfaces for guest and registered users.
Webflow Development: Building a high-performance, responsive website based on the approved designs.
Sign in screen
Sign in screen

Process:

Phase 1: Website UI Design

Sitemap & Information Architecture: Developed a logical site structure to ensure a seamless navigation flow for both retail visitors and trade partners.
Visual Concept & Style Guide: Created two distinct design directions for the Homepage and established a comprehensive style guide to maintain brand consistency across the platform.
Full-Site UI Design: Designed detailed layouts for all pages, including custom interfaces for guest visitors and dedicated portals for registered trade customers.

Phase 2: Webflow Development

Core Site Development: Built over 15 custom pages in Webflow, ensuring high performance and a fully responsive experience across all screen sizes.
System Integration: Integrated the platform with Xero for automated invoicing and configured secure user account management for trade-only access.
Interactions & Animations: Implemented subtle animations and transitions to enhance the premium feel of the product collections while maintaining fast loading speeds.
QA & Technical Setup: Conducted full site testing based on internal checklists and performed foundational SEO setup before final delivery.
Product section
Product section
Transaction UI
Transaction UI

Result:

The final product is a sophisticated, high-performance e-commerce platform that successfully translates PICO’s premium brand into a digital experience. By streamlining the trade registration process and automating the invoicing workflow through Xero, we have significantly reduced manual administrative tasks for the PICO team. The website now provides a seamless, tailored journey for both retail and wholesale customers, featuring a minimalist aesthetic that lets the beauty of the mosaic collections stand out while driving measurable business growth.
Like this project

Posted Apr 23, 2026

A minimalist Webflow e-commerce site featuring Xero integration and a custom trade portal, blending premium design with seamless business automation.

Likes

1

Views

0

Timeline

Mar 19, 2025 - Ongoing

Clients

Pico