Se lancer dans le E-Commerce, c’est avant tout proposer un site efficace auprès des visiteurs. Pour cela, vous pouvez avoir recours à un logiciel de mockup, vous permettant de faire le maquettage de votre site.
Cette méthode de création d’un site web présente de multiples avantages, que nous allons vous présenter dans cet article, en plus des différents outils à votre disposition, s’adaptant à vos besoins.
Qu’est-ce que le maquettage ?
Le maquettage est l’une des étapes d’une stratégie d’expérience utilisateur (UX) complète. Cela permet d’établir un premier prototype, très simplifié, d’un site. Cela aide notamment à visualiser la future disposition d’une boutique en ligne et son ergonomie, par exemple en organisant les différentes zones de votre page d’accueil, prenant en compte les zones de texte, les bannières, images, …
Pourquoi créer un mockup ?
Le mockup vous sert donc à organiser la vision de votre site, et d’en optimiser l’ergonomie avant même de commencer la phase de développement. Plusieurs étapes mènent au mockup, puis au prototype fonctionnel. Celui-ci est utilisé pour développer un site from scratch, soit en le communiquant à un développeur ou en le développant vous-même. Il est également possible de chercher des thèmes pré-faits et de les comparer à la maquette que vous avez créée.
Tout d’abord, nous parlons de wireframe, représentant une première version grossière indiquant les différentes fonctionnalités à indiquer, effectué pour délimiter les zones de la page web, sans aucun effort graphique. Le mockup permet par la suite d’ajouter des détails visuels et fonctionnels. Enfin, le prototype permet de mettre en avant l’expérience utilisateur et les détails graphiques.
Le processus de prototypage permet alors de simplifier la communication des besoins entre les différentes parties et de créer une vision commune, aidant alors à gagner du temps et à éviter les erreurs humaines.
En plus de présenter des avantages pour l’UX de votre site, cette méthode de travail présente également des avantages pour le référencement naturel de votre site, spécialement en ce qui concerne l’ergonomie et le netlinking. En effet, ce wireframe vous permet également de prévoir le maillage interne que vous souhaitez créer, aidant à l’organisation et évitant ainsi au maximum les potentielles erreurs. Un bon maillage interne facilite le travail des crawlers envoyés par les moteurs de recherche sur votre boutique en ligne, et permet de mieux vous placer sur les SERP.
Quel logiciel de mockup choisir ?
Il existe plusieurs façons de créer un mockup. Tout d’abord, vous pouvez vous en remettre à la suite d’Adobe, que ce soit avec Photoshop ou Illustrator, pour créer un wireframe. Néanmoins, si vous ne souhaitez pas investir dans la suite du géant américain, il existe des alternatives en ligne, nécessitant nettement moins de compétences techniques.
Balsamiq
Balsamiq est un outil en ligne permettant de créer un wireframe très sommaire, et est développé par une équipe indépendante, ayant à cœur de proposer un site adapté à chacune des parties prenantes.
Les fonctionnalités proposées par l’outil sont accessibles grâce à plusieurs abonnements, proposés à différents prix, adaptés à vos besoins :
Balsamiq Cloud
C’est l’outil de création du mockup accessible directement en ligne. Il est proposé à 3 différents forfaits :
- 2 projets : proposé à 9$ par mois ou 90$ par an, permet de travailler sur deux projets en ligne, simultanément ;
- 20 projets : proposé à 49$ par mois ou 490$ par an, adapté aux plus grandes entreprises, prévoyant plusieurs projets en ligne ;
- 200 projets : proposé à 199$ par mois ou 1 990$ par mois.
Tous ces abonnements proposent un nombre illimité de wireframes, modifiables par un nombre illimité d’utilisateurs. Balsamiq Cloud propose une période d’essai gratuite de 30 jours.
Wireframes for Desktop
Cela représente la version logiciel téléchargeable de Balsamiq. Il est alors possible de créer un ensemble de mockups hors-ligne. Il est possible d’obtenir une licence pour un grand nombre d’utilisateurs, entre 1 (89$) et 220 (9 790$), avec un prix dégressif allant de 89$ par utilisateur à 44,5$.
Integration
L’outil de mockup est intégrable sur de grands outils de gestion de projet et de bureautique en ligne. Par exemple, il est possible d’intégrer Balsamiq sur Google Drive, Confluence et Jira. La facturation se fait au nombre d’éditeurs intervenant sur le projet.
- Google Drive : 5$ par éditeur par mois, ou 50$ par éditeur et par an ;
- Confluence : les options sont personnalisables, avec la possibilité d’opter pour la version Cloud ou Server. Il est par la suite possible de choisir un échantillon d’utilisateurs de Confluence, ou ne sélectionner qu’un échantillon, et de choisir une licence adaptée, qu’elle soit commerciale ou académique. Les prix vont de 50$ (pour 3 éditeurs sur une licence académique) à 8 000$ (pour 2 000 éditeurs sur une licence commerciale) ;
- Jira : les options et abonnements sont les mêmes que pour Confluence.
Marvel App
Marvel App est utilisé par de nombreux acteurs du numérique pour développer leurs mockups, parmi 2 millions de personnes. L’outil propose 4 différents forfaits :
- Free : version gratuite de l’outil, utilisable par une personne, travaillant sur un projet, ayant la possibilité de créer un test utilisateur unique ;
- Pro : version à 12€ par mois (9€ par mois si payé annuellement), utilisable par une personne, travaillant sur un nombre illimité de projets, ayant la possibilité de créer 3 tests utilisateurs. Les prototypes créés sont téléchargeables, et sans filigrane ;
- Team : version à 36€ par mois (27€ par mois si payé annuellement), utilisable par 3 personnes, travaillant sur un nombre illimité de projets, ayant la possibilité de créer 10 tests utilisateurs. En plus de bénéficier des prototypes téléchargeables, il est possible d’accéder au support premium. Cette version dispose d’une version d’essai gratuite de 7 jours ;
- Enterprise : forfait personnalisé, proposant des solutions adaptées aux besoins des entreprises nécessitant davantage de souplesse et de fonctionnalités.
Pour optimiser les processus de votre entreprise, Marvel App propose la création de mockup et la connection entre différents outils :
- UserFlows : outil créé par Marvel, aidant à créer un parcours utilisateur, permettant de développer une stratégie UX de qualité ;
- Maze : outil analytique créé pour étudier les prototypes ;
- Jira : outil de gestion de projet.
UXPin
Comme son nom l’indique, l’objectif de cet outil est d’optimiser l’expérience utilisateur d’un site web, grâce à un design généré par code. Comme les outils cités précédemment, UXPin propose différents tarifs :
- Basic : version à 24$ par mois (19$ par mois si payé annuellement), par éditeur. Ce forfait inclut un nombre illimité de projets et d’interactions ;
- Advanced : version à 39$ par mois (29$ par mois si payé annuellement), par éditeur. Ce forfait inclut une documentation contextuelle et une logique conditionnelle lors des tests utilisateurs ;
- Professional : version à 83$ par mois (69$ par mois si payé annuellement), par éditeur. Ce forfait permet de créer un système de rôles et de permissions pour chacun des éditeurs, et créer des systèmes de design ;
- Enterprise : version personnalisée, adaptée aux besoins des entreprises.
Et vous, avez-vous créé un mockup avant de lancer votre projet, ou prévoyez-vous d’en créer un ? Quelle a été votre expérience ? N’hésitez pas à la partager avec nous sur nos réseaux sociaux.
Crédit image : Ania Cywińska
