Aller au contenu

Web · Prêt-à-porter

Nechma

Boutique en ligne pour un magasin de vêtements de Souk Ahras

La page d'accueil de Nechma en arabe, disposée de droite à gauche : une photographie de l'intérieur du magasin avec portants et étagères, un sélecteur de langue proposant Français et عربية, un champ de recherche et un panier dans l'en-tête.
  1. L'entreprise

    Un magasin de vêtements à Souk Ahras avec des clients qui entrent chaque jour, et aucun moyen pour eux d'acheter en ligne.

  2. Le problème

    Les clients du magasin lisent d'abord l'arabe, ensuite le français, et achètent sur leur téléphone. Une boutique sur modèle n'aurait parlé qu'une langue, dans le mauvais sens de lecture, et aurait laissé chaque vente à un fil de messages.

  3. Ce que nous avons construit

    Une vitrine construite pour ses clients : l'arabe par défaut, mise en page de droite à gauche, le français à un bouton de distance avec les mêmes pages remises en page plutôt que traduites sur place. Navigation par catégorie, filtres de prix, de taille et de couleur, un panier, le paiement à la livraison et l'expédition dans tout le pays. Le système de design a été dessiné d'abord — couleurs, typographie dans les deux écritures, la fiche produit dans chacun de ses états — et le site construit à partir de lui.

  4. Ce qui a changé

    Un magasin qui vendait dans la rue prend désormais des commandes de tout le pays, dans la langue que chaque client choisit, et livre à domicile. L'équipe gère elle-même produits et commandes.

05Écrans

Le produit,écran par écran.

la vitrine en production

  • La page d'accueil en arabe, de droite à gauche : une photographie de l'intérieur du magasin, un sélecteur de langue proposant Français et عربية, un champ de recherche et un panier dans l'en-tête.
  • La rangée des nouveautés sur la page d'accueil, au-dessus d'une bande de vignettes de catégories.
  • Une section en deux parties associant la photographie d'un artisan au travail à une phrase sur le trajet du cœur de la ville à votre penderie, au-dessus d'une rangée de quatre meilleures ventes.
  • Le bas de la page d'accueil : une bande en trois parties sur l'authenticité, le paiement à la livraison et l'expédition nationale, une rangée Instagram de six photographies, et le pied de page sombre avec liens rapides, coordonnées et horaires.
  • L'index des produits avec le panneau de filtres ouvert : cases de catégories, curseur de prix, boutons de taille et pastilles de couleur à côté d'une grille de vêtements avec les prix en dinars.
  • La page d'un chemisier en lin : une pastille de remise à côté du prix, les choix de taille et de couleur, un sélecteur de quantité, un bouton d'ajout au panier, et une photographie avec une bande de vignettes.
  • La page des catégories : de grandes tuiles photographiques pour homme, femme, accessoires, chaussures et enfant, chacune légendée en arabe.
  • La page « à propos » : le logotype au-dessus d'un paragraphe d'ouverture, un titre sur les débuts dans un seul magasin avec deux colonnes de texte, trois cartes de valeurs, et une bande photographique dessous.
  • La page de contact : un titre et une invitation à écrire, au-dessus d'un formulaire nom, e-mail, téléphone, objet et message.
  • La même page de contact défilée jusqu'au pied de page, montrant l'adresse du magasin, son téléphone et son e-mail, les horaires jour par jour, et un panneau de carte.
  • La page d'accueil basculée en français, la navigation affichant Accueil, Produits, Catégories, À propos et Contact, avec un bandeau de livraison en haut.

système de design

  • L'artboard de l'accueil desktop : un en-tête de droite à gauche portant le logotype NECHMA, une bannière pleine largeur sur une photographie, une rangée de six tuiles de catégories, des rangées de nouveautés et de meilleures ventes avec les prix en dinars, une bande livraison et paiement, et une grille Instagram.
  • L'artboard de l'accueil mobile : un en-tête avec pastille de panier et bouton de menu, une bannière pleine page annotée comme photographie lifestyle, des tuiles de catégories annotées en défilement magnétique à six tuiles, et deux cartes produit de nouveautés au format 4:5.
  • L'artboard de la page produit : un fil d'Ariane, le nom du vêtement et un prix remisé, les choix de taille et de couleur, un sélecteur de quantité, un bouton d'ajout au panier avec une action secondaire en dessous, des sections dépliables, une grande image avec une bande de vignettes, et une rangée de produits similaires.
  • L'artboard du système de design : les rôles de couleur en pastilles avec leurs valeurs hexadécimales, une échelle typographique associant Poppins pour le latin et les chiffres à la fonte arabe avec un spécimen à chaque taille, la matrice des boutons dans leurs variantes et états, les champs de saisie, les badges, et la carte produit dans cinq états.
  • L'artboard de la page « à propos » : le logotype au-dessus d'un titre sur les débuts dans un seul magasin, un paragraphe de texte, trois cartes de valeurs, une bande d'image large, et une rangée de trois chiffres avec leurs légendes.

Démarrer un projet

Dites-nous ce quevous voulez résoudre.

Une conversation suffit pour savoir si nous sommes la bonne équipe. Nous répondons par des questions, pas par une plaquette commerciale.