02 / WEB · COMMERCE & OPERATIONS
Gbskincare
A multi-region skincare platform connecting product discovery, regional pricing, payments, inventory and fulfilment.
THE PRODUCT
Built around a real need.
I designed and built Gbskincare as a solo project: a premium skincare storefront connected to an admin operations dashboard. The system brings customer shopping, regional and bottle-size pricing, payment confirmation, inventory and shipment tracking into one workflow.
- Regional pricing and product variants
- Verified payments and atomic inventory updates
- Customer tracking and admin operations
MY CONTRIBUTION
From problem to working product.
Solo project · Product design · Full-stack development · System architecture
I designed and built Gbskincare as a premium, multi-region commerce and operations platform. Working solo, I connected the customer storefront with regional pricing, payments, inventory, fulfilment, tracking and an admin workspace so the business could manage the complete order journey in one system.
The customer journey
- Discover & select a region
- Choose a variant
- Pay & confirm stock
- Fulfil & track
- Deliver & support
01A premium, responsive product experience
The problem
The brand needed a distinctive skincare shopping experience alongside practical tools for its operations team.
What I built
I established an editorial visual direction with warm neutrals, gold accents, refined typography and black operational surfaces. I built separate storefront and admin experiences, responsive navigation, mobile card views for large tables, and page motion refined to avoid blur, clipping and broken layouts.
02Discovery and customer self-service
The problem
Customers needed to understand products, keep their selections and follow orders after checkout.
What I built
I built search, sorting and collection/concern browsing, product pages with benefits, ingredients, directions and bottle-size variants, and real review aggregation. Persistent carts, wishlist-to-cart handling, accounts, order history, notifications and tracking support the wider customer journey. Support links lead to the contact form for complaint logging.
03From demo products to a real catalogue
The problem
Placeholder products and imagery could not support a controlled retail launch.
What I built
I imported the supplied PDF/DOCX catalogue and normalised names, sizes, descriptions, benefits, ingredients, directions, NGN prices, variants and categories. Imported products remain Draft until reviewed. Admins can upload images to Supabase Storage, preview them before saving and use image URLs where needed; branded placeholders replace misleading fallback photography.
THE TECHNOLOGY
How it comes together.
Customer & admin interfaces
React
Responsive storefront and operations dashboard, with persistent carts, customer accounts and multilingual storefront UI.
Application API
Node.js · Express
Server-side quotes, payment verification, fulfilment, notification events and operational APIs.
Data & media
Supabase · PostgreSQL
Catalogue, regional pricing, orders and operational records, Storage for product media, and an RPC for atomic inventory updates after payment confirmation.
Payments
Bachs · Paystack
Bachs is implemented and processing live payments. The platform also includes Paystack initialisation, verification and signed, idempotent webhook processing.
Storefront languages
i18next · react-i18next
English, French, Spanish and Italian UI with a saved language preference. Product content remains in its source language.