Comme vous le savez (si vous lisez régulièrement ce blog), nous avons beaucoup d’ambition pour WiziShop, notre solution e-commerce.

Après 22 mois d’existence, notre outil a convaincu plus de 650 e-commerçants (voir quelques exemples de boutiques), nous avons mis en ligne environ 170 nouveautés (nouvelles fonctionnalités, partenariats, etc.) et triplé la taille de l’équipe (nous sommes passé de 4 à 12 personnes).

Pour nous, ce n’est qu’un début. Nous avons bien l’intention de nous développer encore plus rapidement lors des prochains mois. L’interface d’administration va encore évoluer et proposer de nouveaux outils innovants. Mais ces dernières semaines, nous avons également travaillé sur la partie visible des sites (front office). Nous souhaitions proposer une nouvelle génération de design accessible gratuitement pour tous nos clients.

Une nouvelle série de designs plus belle, performante et réunissant un ensemble de bonnes pratiques pour augmenter le taux de transformation et le panier moyen.

Une nouvelle série de designs qui s’adapte à de nombreux paramètres et qui regroupe toutes les caractéristiques d’un très gros site de e-commerce (dont la création dépasse souvent les 100 K€).

Le premier design de la série vient d’être publié et je ne résiste pas à la tentation de vous le présenter !

Bienvenue au design « Light Gray« .

Vous pouvez tester ce nouveau design sur notre boutique de démonstration. Ce design est également accessible gratuitement pour tous nos clients via leur interface d’administration, rubrique « Apparence & Personnalisation ».

Voici un tour d’horizon des spécificités de cette charte graphique « nouvelle génération » :

1. Les menus déroulants

Le menu horizontal du haut présente les différentes catégories principales de votre catalogue produit. Si vous possédez des sous-catégories, une petite flèche apparait et propose un menu déroulant permettant à votre visiteur d’accéder directement à la sous-catégorie de son choix.

Le menu déroulant s’adapte visuellement en se mettant sur une, deux ou trois colonnes selon le nombre de sous-catégories.

2. Panier interactif

En haut à droite, le panier est automatiquement mis à jour. Il suffit au visiteur de survoler le panier pour voir apparaitre les différents produits sélectionnés, naviguer entre eux (ils sont présentés deux par deux) et finaliser la commande !

3. Mises en avant et listes de produits

Il est possible de commander le produit directement depuis la sélection. Une bulle d’information au survol du produit affiche plus de renseignements (la description courte du produit), le contour du bloc est également renforcé pour bien mettre en valeur le produit survolé. Dans les listes produits, on utilise une plus grande image (150 x 150 px) pour mieux mettre en valeur vos articles.

4. La fiche produit

A l’instar des plus grands sites marchands, nous avons décidé d’épurer la fiche produit pour ne pas « dissiper » l’attention du visiteur. Ainsi, la fiche produit prend toute la largeur de la page, les menus et les éléments de la colonne se retrouvant en pied de page.

On retrouve, avant le fil d’ariane, un bouton permettant d’accéder à la catégorie supérieure pour choisir facilement un nouveau produit. Les boutons de partage prennent moins de place que sur les anciens designs et ouvrent une fenêtre lors du clic.

La description du produit et les caractéristiques sont présentées sous forme d’onglets pour passer facilement de l’un à l’autre. En haut de la fiche produit, le début de la description (ou la description courte si elle existe) permet d’avoir un petit aperçu du produit. Le lien « En savoir + » renvoie vers la description complète située plus bas dans la page.

5. Le pied de page

Selon le nombre de liens, les informations à afficher et la page parcourue par le visiteur, le pied de page s’adapte pour donner du contenu cohérent.

Exemple du pied de page qui met le blog en avant :

Le même pied de page dans une fiche produit :

6. Le panier

Tout comme la fiche produit, le panier prend toute la largeur pour capter toute l’attention du futur client. Les étapes sont clairement identifiées et des boutons permettent de modifier très facilement la quantité des produits désirés.

Je rappelle pour les nouveaux venus que Wizishop est le nom d’un projet qui verra le jour d’ici quelques temps (mi-septembre). Ce projet est destiné aux commerçants qui veulent se lancer dans l’aventure de la vente en ligne. Plus précisément, il s’agit d’une plateforme e-commerce très innovante qui permettra de créer, gérer, mettre à jour et promouvoir sa boutique en ligne de façon extrêmement simple…

Chaque mardi, je dévoile une des facettes du projet et aujourd’hui, j’ai décidé de vous parler d’un élément très important : la charte graphique !

Avec Wizishop, vous avez 4 moyens différents pour choisir votre charte graphique :

1. Choisir un design librement et gratuitement

Nous mettons à votre disposition de nombreuses chartes graphiques que vous pouvez utiliser librement. Ces designs sont soit créés par Wizishop soit par des webdesigners indépendants. Dans tous les cas, vous pouvez les utiliser gratuitement pour votre boutique.

2. Acheter un design en exclusivité

Si vous trouvez un design qui vous plait parmi nos différentes propositions, vous pouvez également l’acheter en exclusivité pour qu’aucune autre boutique ne puisse l’utiliser. Les tarifs sont définis directement par les webdesigners.

3. Se faire créer une charte graphique sur mesure par un professionnel

Nous pouvons également vous aider à trouver un professionnel qui vous créera un design sur mesure et l’intègrera dans Wizishop. A terme, nous mettrons en place une véritable place de marché pour que vous puissiez passer des annonces et que les professionnels puissent vous répondre facilement.

4. Créer sa charte graphique à l’aide de notre système de template

Pour ceux d’entre vous qui ont des connaissances en HTML, il vous sera également possible de créer votre propre charte graphique. Nous avons mis en place un système de template et nous fournissons un manuel afin de bien appréhender nos différentes fonctions. Le système est vraiment très simple à utiliser puisqu’il vous suffira d’inclure des termes français du style {liste-produit} pour faire apparaitre la liste de vos produits sur la page. Plusieurs modèles et exemples vous seront fournis et vous serez ainsi totalement libre dans vos créations.

Voici quelques exemples de chartes graphiques que nous avons réalisé sur mesure pour nos premiers testeurs :

Une opportunité pour les webdesigners

Vous l’aurez compris, Wizishop est également une superbe opportunité pour les webdesigners et les agences Web. Nous proposons aux professionnels du web de créer des chartes graphiques sur Wizishop et de les proposer librement à nos clients. Si un commerçant utilise une charte graphique d’un webdesigner, celui-ci devient automatiquement son filleul. Le webdesigner touche alors pendant un an (ou le temps d’utilisation de son design) 1% sur toutes les ventes HT de la ou les boutiques filleules ! Et c’est tout à fait transparent pour le commerçant.

En proposant plusieurs designs et en imaginant que plusieurs commerçants les utilise, les sommes peuvent devenir très conséquentes. Prenons un petit exemple :

Un webdesigner met 3 designs sur Wizishop. Chaque design est utilisé par 2 commerçants. Le webdesigner a donc 6 boutiques-filleules.
Chaque boutique fait une moyenne de 8 ventes par jour d’environ 80€ HT. Au total, les boutiques génèrent 115 200€ par mois soit 1 382 400€ la première année. Le webdesigner touche donc 13 824€ dans l’année pour avoir créé 3 designs !

Lorsqu’un webdesigner laisse une charte graphique sur Wizishop, il peut également donner un tarif d’achat exclusif ou demander à devenir partenaire. Dans ce cas là, nous pouvons orienter les commerçants vers lui pour un design sur mesure.

Si vous êtes webdesigner et que vous êtes intéressé par une de ces formules, n’hésitez pas à nous contacter via les commentaires ou le formulaire de contact. Nous lancerons officiellement le système de template dans quelques jours, nous vous recontacterons à cette occasion.