Skip to content

Web · Clothing retail

Nechma

Online boutique for a Souk Ahras clothing store

Visit the siteAll projects
The Nechma home page in Arabic, laid out right to left: a photograph of the shop interior with clothing rails and shelves, a language toggle offering Français and عربية, a search field and a cart in the header.

  1. The business

    A clothing shop in Souk Ahras with customers walking in every day, and none of them able to buy from it online.

  2. The problem

    The shop's customers read Arabic first and French second, and shop on their phones. A template store would have spoken one language, laid out for the wrong reading direction, and left every sale to a message thread.

  3. What we built

    A storefront built for its customers: Arabic by default and laid out right to left, French a toggle away with the same pages re-laid rather than translated in place. Browsing by category, filters for price, size and colour, a cart, cash on delivery and nationwide shipping. The design system was drawn first — colours, type in both scripts, the product card in every state — and the site built from it.

  4. What changed

    A shop that traded on the street now takes orders from the whole country, in the language each customer chooses, and delivers to the door. The team manages products and orders themselves.

05Screens

The product,screen by screen.

the live storefront

  • The home page in Arabic, right to left: a photograph of the shop interior, a language toggle offering Français and عربية, a search field and a cart in the header.
  • The new-arrivals row on the home page, above a strip of photographic category thumbnails.
  • A split section pairing a photograph of a craftsman at work with a line about going from the heart of the city to your wardrobe, above a bestsellers row of four garments.
  • The foot of the home page: a three-part strip on authentic goods, cash on delivery and nationwide shipping, an Instagram row of six photographs, and the dark footer with quick links, contact details and opening hours.
  • The products index with the filter panel open: category checkboxes, a price range slider, size buttons and colour swatches beside a grid of garments priced in dinars.
  • A product page for a linen shirt: a discount badge beside the price, size and colour choices, a quantity stepper, an add-to-cart button, and a model photograph with a thumbnail rail.
  • The categories page: large photographic tiles for men, women, accessories, shoes and children, each captioned in Arabic.
  • The about page: the wordmark over an opening paragraph, a heading about starting from a single shop with two columns of body copy, three value cards, and a photographic strip beneath.
  • The contact page: a heading and an invitation to write, above a form for name, email, phone, subject and message.
  • The same contact page scrolled to its footer, showing the shop address, its telephone and email, the opening hours day by day, and a map panel.
  • The home page switched to French, the navigation reading Accueil, Produits, Catégories, À propos and Contact, with a delivery banner running across the top.

design system

  • The desktop home artboard: a right-to-left header carrying the NECHMA wordmark, a full-width hero over a photograph, a row of six category tiles, new-arrival and bestseller product rows with prices in dinars, a delivery and payment strip, and an Instagram grid.
  • The mobile home artboard: a header with a cart badge and a menu button, a full-bleed hero marked as a lifestyle photograph, category tiles annotated as a six-tile snap scroll, and a new-arrivals pair of product cards at a 4:5 crop.
  • The product page artboard: a breadcrumb, the garment name and a discounted price, size and colour choices, a quantity stepper, a primary add-to-cart button with a secondary action beneath, collapsible detail sections, a large image with a thumbnail rail, and a related-products row.
  • The design system artboard: the colour roles as swatches with their hex values, a type scale pairing Poppins for Latin and numerals with the Arabic face and specimen text at each size, the button matrix across its variants and states, input fields, badges, and the product card in five states.
  • The about page artboard: the wordmark over a heading about starting from a single shop, a paragraph of body copy, three value cards, a wide image band, and a row of three figures with their captions.

Next project

Hand & NeedleCouture atelier storefront and back office
All projects

Start a project

Tell us whatyou're solving.

One conversation is enough to know whether we are the right team. We answer with questions, not a sales deck.

Start a project
Email
contact@fivex.dev
Phone
+213 558 78 01 31
+213 778 53 58 19