Skip to content

Curated African fashion, beauty, skincare and lifestyle brands.

AFFARA bridge markAFFARA

Prototype status

Implementation notes

Demonstration content — This page exists for the AFFARA team. It is excluded from search indexing and can be removed before launch.

Phase 2 — positioning, discovery and journey completion (latest pass)

  • Homepage hero rewritten to the approved positioning: 'Discover African fashion and beauty, delivered from the UK.' with a primary Shop Now action and a single, secondary For Brands route. Files: src/routes/index.tsx.
  • New 'What AFFARA offers' section states the marketplace / fulfilment split explicitly in two panels, so customers and brands both self-select without the service content taking over the shop. Files: src/routes/index.tsx.
  • Collections are now a first-class structure: rule-based edits (occasion, department, fabric, badge, price ceiling) rather than hard-coded product lists, with an index page, per-collection pages, homepage row, catalogue chips and per-brand related collections. Files: src/data/catalogue.ts, src/routes/collections.index.tsx, src/routes/collections.$slug.tsx, src/components/site/catalogue-browser.tsx.
  • Customer navigation reordered to Shop, New Arrivals, departments, Brands, Collections, Journal, About; secondary departments collapse at narrower desktop widths so the bag icon is never clipped. Files: src/components/site/header.tsx.
  • Brand pages now read as mini storefronts: monogram lockup, brand category, design philosophy, craft, size range, related collections and journal links. Files: src/routes/brands.$slug.tsx, src/data/catalogue.ts (Brand.category, Brand.philosophy).
  • Product pages gained a visible delivery/returns summary above the accordion, an 'About the brand' block and a 'Complete the look' complementary-product row derived from shared occasions across departments. Files: src/routes/products.$slug.tsx, src/data/catalogue.ts (complementaryProducts).
  • Order confirmation now explains what happens next as a five-step sequence from confirmation to returns. Files: src/routes/order-confirmation.tsx.
  • Internal documentation removed from customer navigation: implementation notes and staff sign-in now sit only in a discreet 'Internal' footer row, and the page stays noindex. Files: src/components/site/header.tsx, src/components/site/footer.tsx.

Phase 1 — audit and brand foundation

  • Homepage hero now carries AFFARA's approved positioning copy, with a secondary brand-partner route (Fulfil with AFFARA / Explore services) below the customer calls to action. Files: src/routes/index.tsx.
  • Fabricated customer testimonials removed from the homepage and replaced with review architecture placeholders, so no invented review or delivery claim is published. Files: src/routes/index.tsx.
  • Announcement bar no longer publishes delivery rates, thresholds or return windows — AFFARA must confirm carrier terms first. Files: src/data/catalogue.ts.
  • Department navigation and the homepage category grid are derived from `activeDepartments`, so a category with no approved products is never exposed. Files: src/data/catalogue.ts, src/components/site/header.tsx, src/routes/index.tsx.
  • Trust strip extended to secure checkout, clear delivery information and UK customer support only — no unverifiable superlatives. Files: src/data/catalogue.ts.
  • No routes, database fields, components or integrations were renamed or removed in this pass; mobile navigation, bottom nav and existing layouts are unchanged.

Built and interactive

  • Marketplace storefront: home, departments, brand directory and brand pages, product pages, search, wishlist, cart and guest checkout.
  • Order confirmation, order tracking timeline and account area (orders, returns, wishlist, profile, addresses).
  • Editorial journal, help centre with FAQ schema, delivery, international delivery, returns, size guide and fabric guide.
  • Brand partnership landing page and application flow.
  • Client-side catalogue filtering by department, brand, size, colour, occasion, fabric, fit, availability and price.
  • Cart, wishlist, recently viewed and currency preference persisted in the browser.

Demonstration data

  • All brands, products, prices, stock levels, measurements, journal articles, orders and returns are sample content.
  • Delivery rates, thresholds, return windows and duty handling are placeholders labelled on each page.

Live backend

  • Staff sign-in with roles: administrator and fulfilment. The admin and ops dashboards are behind the login gate.
  • Brand applications submitted from the public form are stored and appear in the admin pipeline.
  • Application stages and product publication statuses are saved server-side, restricted to administrators.
  • Every decision is written to an approval history with the account, the previous value and the new value.

Needs integration before launch

  • Customer accounts, so order history and returns are tied to a real shopper.
  • Database-backed storefront catalogue and orders, replacing the in-repository sample data.
  • Payment provider, including local wallets per market.
  • Carrier and duty calculation APIs for live rates, labels and tracking events.
  • Transactional email for order, dispatch, return and refund notifications.

Needs AFFARA information

  • Licensed brand typeface files (The Seasons is currently substituted with a serif fallback).
  • Commercial terms and any published rate card for partner brands.
  • Legal copy: terms, privacy, cookies, returns policy and accessibility statement.
  • Verified sourcing, artisan and certification claims — deliberately left unwritten rather than invented.
  • Real product photography, brand approvals and editorial sign-off.
Back to the marketplace