Web Design & Development

Sílvia Jesus Art Gallery

The Sílvia Jesus website is a full e-commerce platform spanning three distinct product lines — customizable handcrafted notebooks, decorative plaster pieces, and drawings/prints priced by paper size — unified in a single coherent store. Shoppers search and filter a live, Firestore-backed catalog (category, paper size, price range, availability, sorting), customize notebooks through a 4-step wizard with live price calculation, read customer reviews with star-rating breakdowns, and check out with MB Way, Multibanco, or card.

Completed Date: September 2026
Visit Live Site
Project Details

Overview

Industry

Arts & Crafts / E-commerce — Handmade Artisan Goods

Scope

Complete e-commerce platform: Firestore-backed product catalog across 3 categories, a 4-step notebook customization wizard, advanced filtering and search with URL-synced filters, a customer reviews and ratings system, authenticated user accounts with order history, a shopping cart, and checkout with Portuguese payment methods (MB Way, Multibanco, card)

Timeline

Phased development from May to September 2026 (~4.5 months), from initial build through Firebase backend integration

The Problem

Challenge

Sílvia Jesus, a handmade-art maker working across three very different product types — customizable notebooks, decorative plaster pieces, and drawings/prints priced by paper size — needed all three unified in a single, coherent online store. She also needed checkout built around Portuguese payment habits (MB Way, Multibanco) and a way for customers to track their orders after purchase.

Our Approach

Solution

We built a custom React and Firebase platform with category-specific product logic — a customization wizard for notebooks, paper-size-based pricing for prints — backed by a live Firestore catalog and an authenticated account and order-history flow, all wrapped in an animated, mobile-first interface matching the artist's visual identity.

What's Included

Key Features

Shopping Cart & Online Ordering
Firebase Firestore Integration
Product Customization Wizard
Customer Reviews & Ratings
Category Filtering & Search
User Accounts & Order History
Portuguese Payment Methods
Framer Motion Animations
Performance

Results

100/100
Best Practices Score
Google Lighthouse, production build
0
Cumulative Layout Shift
Google Lighthouse — zero visual instability while loading
88/100
Accessibility Score
Google Lighthouse accessibility audit
3
Product Categories
Notebooks, plaster pieces, drawings & prints
Technology

Tech Stack

React 19
Vite 6
TypeScript 5
Tailwind CSS 3.x
React Router DOM 7
React Hook Form
Zod
Radix UI
Framer Motion
Firebase (Auth, Firestore, Storage, Functions)
Get Started

Ready to Start Your Project?

Let's discuss how we can create a stunning website tailored to your business needs.

Sílvia Jesus Art Gallery | Portfolio | low-key solutions