Independent conceptNot commissioned by TMT

TMT Supermarket

A supermarket website concept with a working shop: browse departments, build a basket and complete a demo checkout for delivery or collection.

TMT Supermarket on a desktop screen
TMT Supermarket on a phone

What it enables

  • Browse departments and products, and add to a basket from any page.
  • Choose delivery or collection and a branch, with fees shown up front.
  • Complete a three-step demo checkout that ends with a local confirmation.

My contribution

Design and front-end build from a supplied asset kit, product data, checkout logic, tests and deployment.

The journey

  1. TMT Supermarket: discover products
    01

    Discover products

    An editorial homepage leads into departments and everyday favourites.

  2. TMT Supermarket: build a basket
    02

    Build a basket

    Items go straight into the basket from the shop grid, with immediate feedback.

  3. TMT Supermarket: review the basket
    03

    Review the basket

    Quantities, subtotal and the route to checkout, laid out for a phone.

  4. TMT Supermarket: complete a demo checkout
    04

    Complete a demo checkout

    Choose delivery or click-and-collect and a branch, with the fee shown before the details step.

Stack

  • React
  • TypeScript
  • Vite
  • React Router
  • GSAP

Boundaries

An independent portfolio concept. It is not affiliated with or endorsed by TMT Supermarket, and no order is placed.