Maquette de site web & d'application
Pour les équipes qui ont déjà un développeur : la conception complète d'une application, d'un outil métier ou d'un logiciel en ligne, remise prête à intégrer — je code moi-même, donc je ne dessine jamais un écran dont j'ignore le coût.
dès 1 200 €Demander un devis
Conception et maquettes. Facturable au forfait sur un périmètre défini, ou à la journée en renfort d'équipe.
Tréma · écrans de gestion et composants
Photo Amelie Mourichon · Unsplash
Une application ne se dessine pas comme un site. Personne n'y arrive par curiosité : les gens y viennent pour faire un travail, souvent tous les jours, souvent pressés. Le succès ne se mesure pas au temps passé sur l'écran mais au temps que l'écran fait gagner.
J'ai conçu et développé Tréma, un outil de gestion pour freelances créatifs, du premier écran jusqu'à la mise en production. Cette double casquette change la conversation : je sais ce qu'une idée coûte à intégrer, et je ne propose pas d'écran dont le coût de développement dépasse l'intérêt.
Le travail part des tâches, pas des pages. On liste ce que l'utilisateur doit pouvoir faire, dans quel ordre et à quelle fréquence, puis on dessine le chemin le plus court pour chacune. Les écrans découlent ensuite de ces chemins, jamais l'inverse.
Les états peu glorieux sont traités avec autant de soin que les autres : listes vides, chargements, erreurs de saisie, droits insuffisants. Ce sont ceux qui font juger un outil sérieux ou bricolé.
Comment ça se passe
trois à six semaines au forfait, ou en continu si c'est un renfort
Tâches
Ce que les gens doivent pouvoir faire, à quelle fréquence, et ce qui les bloque aujourd'hui.
Parcours
Le chemin le plus court pour chaque tâche, arbitré avec le développeur.
Écrans
Le dessin, avec des données réelles et tous les états peu glorieux.
Système
Les composants documentés, remis dans vos fichiers et repris avec l'équipe.
- La liste des tâches réelles, par fréquence
- Le parcours page à page, annoté
- Les écrans clés dessinés, avec leurs états
- Le système et ses règles, posés
Ce que vous recevez à chaque étape21 jours ouvrés en tout
Un système, pas une série d'écrans
Je livre un système de composants : boutons, champs, tableaux, messages, avec leurs états et leurs règles d'espacement. Votre développeur les intègre une fois, puis assemble les écrans suivants sans repasser par moi.
C'est ce qui fait la différence entre une maquette qui vieillit au premier écran non prévu, et une conception qui tient sur deux ans de développement. L'équipe peut créer une page nouvelle en restant cohérente, parce que les briques existent déjà.
Des briques réutilisables, pas des images plates
Un bon outil se juge au nombre de clics qu'on n'a pas eu à faire.
Quand c'est un site internet
La maquette d'un site internet se construit dans le même ordre, avec d'autres priorités. Le zoning du site web vient d'abord : des blocs gris qui disent où se placent le titre, la preuve et l'appel à l'action, sans une couleur ni une photo. La hiérarchie se valide à ce stade, parce qu'elle s'y corrige en quelques minutes.
Les écrans finaux suivent, dessinés pour le téléphone puis élargis, avec le même système de composants qu'une application. Votre développeur ou votre agence reçoit une maquette de site web qu'il peut intégrer dans l'outil de son choix, sans deviner ce qui se passe entre deux largeurs d'écran.
Ce qui distingue un outil d'un site
trois règles qui ne se transposent pas
Un écran vu cent fois par semaine doit être sobre et dense. Ce qui séduit à la première visite fatigue à la cinquantième, soit l'inverse exact d'une page d'accueil.
On dessine avec vos vraies données, pas avec des noms d'exemple courts et bien rangés. Un tableau tient très bien jusqu'au jour où une raison sociale fait soixante caractères.
Qui voit quoi change complètement un écran. Un même tableau n'a pas la même forme pour un administrateur et pour un collaborateur, et cela se conçoit dès le départ. Les critères d'accessibilité WCAG s'appliquent aussi : contraste, navigation au clavier, tailles de cible.
Dans vos fichiers, à votre rythme
Travailler avec votre équipe
Sur un projet qui dure, la formule à la journée fonctionne mieux qu'un forfait. Je participe à vos points, je dessine au rythme des développements, et les arbitrages se prennent à deux avec le développeur plutôt qu'en aller-retour de fichiers.
Je travaille dans vos outils et vos fichiers, pas dans les miens. Ce qui est produit reste chez vous, exploitable par la personne qui prendra la suite. J'y tiens comme à une condition de travail, non comme à un argument commercial.
Le périmètre
ce qui est compris, et ce qui ne l’est pas
Facturé à part, si besoin
- Le développement de l'application
- L'architecture technique et le choix de la base de données
- Les tests utilisateurs à grande échelle
- La rédaction de la documentation destinée à vos clients
- L'hébergement et l'exploitation
Compris dans le prix
- Le relevé des tâches réelles et de leur fréquence
- Les parcours principaux, tracés avant tout dessin d'écran
- Les écrans clés dessinés, avec leurs états secondaires
- Un système de composants documenté et réutilisable
- Les règles d'espacement, de couleur et de typographie en variables
- La disponibilité pendant l'intégration, pour trancher les détails
Le devis, avant de commencer
- Le périmètre fonctionnel réellement à couvrir
- L'existence d'une équipe de développement, interne ou non
- Le choix entre forfait sur périmètre défini et journées de renfort
- L'accès à des utilisateurs réels pour valider les parcours
Ce que ça donne
les études de cas de ce service
Questions sur ce service5 réponses
- Q.01
Intégrez-vous vous-même l'interface ?
Sur un périmètre restreint, cela peut se discuter, puisque je code. Sur une application complète, non : votre développeur connaît votre base de code et ira dix fois plus vite. Mon apport est de lui remettre une conception qu'il peut intégrer sans l'interpréter.
- Q.02
Dessinez-vous aussi des applications mobiles ?
Oui. Le design d'une application mobile part des mêmes tâches, avec deux contraintes en plus : le pouce, qui n'atteint pas le haut de l'écran quand on tient le téléphone d'une main, et les habitudes d'iOS et d'Android, que les utilisateurs connaissent sans y penser. La maquette d'application mobile se remet de la même façon, en composants, au développeur qui l'intègre.
- Q.03
Travaillez-vous sur Figma ?
Oui, et dans votre espace plutôt que dans le mien, pour que tout reste chez vous. Si votre équipe utilise un autre outil, je m'y adapte : le livrable qui compte est le système de composants, pas le logiciel qui l'héberge.
- Q.04
Que faire si le périmètre bouge en cours de route ?
C'est la norme sur un logiciel, et c'est pourquoi je propose le renfort à la journée. Au forfait, un périmètre qui s'élargit fait un avenant ; à la journée, il fait simplement partie du travail.
- Q.05
Faut-il des tests utilisateurs ?
Quelques entretiens avec de vrais utilisateurs valent mieux qu'un long protocole. Pour l'interface elle-même, un site vitrine répond à un besoin très différent, plus simple et moins coûteux. Trois personnes qui essaient de faire une tâche devant vous révèlent l'essentiel des blocages, et cela tient dans une demi-journée.
Ce qu’on en dit
avis publiés sur la fiche Google
✳︎✳︎✳︎✳︎✳︎
Il a su organiser et structurer toutes mes idées, tout en proposant un univers visuel qui correspond vraiment à mes goûts, et ce n’était pas forcément évident.
✳︎✳︎✳︎✳︎✳︎
Gaëtan est quelqu’un d’efficace, à l’écoute et qui prend vraiment le temps de comprendre les besoins de ses clients.
✳︎✳︎✳︎✳︎✳︎
J’ai eu l’occasion de travailler avec Gaëtan Gerard au cours d’un projet d’identité visuelle en 2023. Je ne peux que vous le conseiller !
✳︎✳︎✳︎✳︎✳︎
The service provided was above my expectations, we had excellent exchanges, and the end result was really good!!
Les autres services
souvent combinés avec celui-ci
Venir au bureau
Angers · 49100
138 rue de la Chalouère
49100 Angers · au-dessus de la microbrasserie Penrose ↗
10Vaillante · 100 m0510Route de Briollay · 200 mBAllonneau-Dunant · 540 mItinéraire ↗
La carte est servie par Google : la charger lui transmet votre adresse IP.
Le premier échange dure vingt minutes et n’engage à rien.