Le wireframing est une étape incontournable dans un projet web. Il consiste à schématiser votre site internet avant de partir pour l’étape design. Il vous permet de fixer les emplacements de vos éléments, de tester votre ergonomie et d’avoir une idée un peu plus précise de ce que sera votre site. Pour les chefs de projet, le wireframing permet de présenter au client une matrice du site afin de fixer avec lui la navigation.

Le wireframing est une étape incontournable dans un projet web. Il consiste à schématiser votre site internet avant de partir pour l’étape design. Il vous permet de fixer les emplacements de vos éléments, de tester votre ergonomie et d’avoir une idée un peu plus précise de ce que sera votre site. Pour les chefs de projet, le wireframing permet de présenter au client une matrice du site afin de fixer avec lui la navigation.

Pour créer le schéma ergonomique (aussi appelé zoning) de votre site, plusieurs outils sont à votre disposition. Plus besoin de passer par un power point approximatif ou de se casser la tête avec une pré-maquette non aboutie sur photoshop. J’ai choisi de vous parler de Mockingbird que j’utilise depuis plusieurs années. J’ai porté mon choix sur lui après avoir essayé plusieurs autres outils comme Cacoo ou Balsamiq Mockups.
mockingbird Mockingbird, le wireframing simplement

Même si l’interface est clairement moche (certains diront épurée), les fonctionnalités offertes par Mockingbird en font à mon sens l’outil de wireframing le plus simple et le intuitif niveau utilisation.

Sur la gauche une boîte à outils comprennant à la fois des éléments types: zones de textes (avec lorem ipsum préconfiguré), des menus, des listes, des éléments graphiques comme les images, des outils médias comme de la vidéo ou du podcast mais aussi des icônes réseaux sociaux. A l’utilisation, je n’ai jamais eu l’occasion de noter un manquement dans ce que propose la boîte à outils de Mockingbird.

Sur les 3/4 de l’écran, votre site. Vous pouvez créer plusieurs slides correspondants aux différentes pages de votre site. Par un simple glisser/ déposer de la boîte à outils vers la slide vous positionnez vos éléments. Petite chose intéressante, une des fonctionnalités de base de Mockingbird inclue l’alignement des éléments les uns par rapport aux autres.

Les zonings crées sont exportables au format PNG ou PDF. Niveau tarifs, Mockingbird est devenu payant depuis peu mais les tarifs sont abordables et vous ne payez que quand vous avez besoin de l’outil.