Overview

During my university internship from Universitat de Lleida at the creative agency Canana.studio, I independently led—supported by the agency’s in-house IT developer—the e-commerce expansion for Roger Borràs Joies, an artisan jewelry brand. Funded under Spain's Kit Digital grant program, the project aimed to integrate a fully functional online store into the brand’s existing website. The scope spanned end-to-end execution: from interface wireframing in Figma and editorial asset creation in Adobe InDesign, to technical implementation in WordPress/WooCommerce and complete client onboarding through direct meetings and custom video tutorials.

The Challenge

Digitalizing a traditional handcrafted jewelry brand presented key user experience and operational challenges:
     - Bridging Physical Product to Digital Experience: Replicating the in-store consultation experience online by eliminating purchase hesitancy—specifically solving uncertainty around ring sizing.

     - Defining Structured Web Layouts & Flows: Mapping out page hierarchies and user journeys via clear wireframes prior to development to streamline coordination with the technical developer.

     - Ensuring Client Autonomy Post-Handover: Empowering the non-technical team at Roger Borràs Joies to independently manage product catalogs, inventory stock, and order fulfillment following launch.

Our Approach

To ensure successful delivery and seamless adoption by the client, we implemented a structured four-stage methodology:
     - UX Prototyping in Figma: Architected comprehensive wireframes to define page structure, content hierarchy, and navigation flows for all key e-commerce views prior to coding.

     - Development in WordPress & WooCommerce: Worked alongside the agency developer to configure WooCommerce, setting up product categories, payment gateways, and shopping cart functionality within the existing WordPress setup.

     - Collateral Design in Adobe InDesign: Designed and formatted an interactive downloadable ring size guide to embed on product pages, providing customers with an easy visual tool to measure their fit accurately.

     - Client Communication, Video Tutorials & Onboarding: Maintained direct client communication via Mail. and conducted review meetings to present progress. Created custom, step-by-step video tutorials and led training sessions to ensure smooth operational handover.

Project Gallery

Results

     - Fully Functional E-Commerce Platform: Successfully launched the online store on WordPress and WooCommerce, meeting all compliance criteria for the Kit Digital initiative while preserving brand identity.

     - Optimized Online Shopping Experience: Reduced purchase friction and sizing inquiries through wireframed user flows and the custom ring size guide.

     - Seamless Client Empowerment: Achieved complete client autonomy in daily store operations, inventory updates, and order processing thanks to tailored video documentation and interactive training.