Procreate : des outils créatifs centrés sur le geste
« Nous voulons que les outils créatifs les plus puissants deviennent invisibles pour que les artistes puissent se concentrer sur la création. » — James Cuda, fondateur de Savage Interactive
Procreate est l’une de ces rares applications qui a transformé une limitation matérielle en avantage de conception. Quand Savage Interactive l’a lancée en 2011, l’iPad était considéré comme un simple appareil de consommation. Procreate a prouvé qu’un écran tactile pouvait devenir un canevas créatif professionnel — non pas en portant les paradigmes du bureau vers le mobile, mais en inventant un modèle d’interaction entièrement nouveau, fondé sur les gestes, la sensibilité à la pression et les mouvements naturels d’une main tenant un stylet.
Le résultat est une application utilisée quotidiennement par des illustrateurs professionnels, des concepteurs artistiques et des animateurs. Procreate a été téléchargée plus de 30 millions de fois, a remporté plusieurs Apple Design Awards, et tout cela sans modèle d’abonnement. La philosophie de conception est sans compromis : chaque interaction doit donner l’impression que l’outil a disparu et que l’artiste travaille directement sur la toile.
Pourquoi Procreate compte
Savage Interactive, un petit studio australien, a créé Procreate comme un projet passionnel et l’a développé jusqu’à en faire l’application créative dominante sur iPad.
Réalisations clés : - Lauréat de l’Apple Design Award (plusieurs années) - Application iPad de l’année - Plus de 200 brosses artisanales entièrement personnalisables - Plus de 30 millions d’exemplaires vendus sans aucun revenu d’abonnement - Animation Assist a apporté l’animation image par image sur iPad - Standard de l’industrie pour le concept art, l’illustration et le storyboard - Fonctionne à 120 fps sur les écrans ProMotion avec une latence inférieure à 7 ms
Points essentiels à retenir
- Les gestes doivent être découvrables ET invisibles — Toucher deux doigts pour annuler est intuitif une fois appris, mais n’interrompt jamais le flux créatif
- La latence est une décision de design — Une latence stylet-pixel inférieure à 7 ms rend le numérique analogique ; tout ce qui est plus lent brise l’illusion
- Les zones tactiles des outils créatifs obéissent à d’autres règles — Les zones d’interaction d’une application de peinture doivent tenir compte du rejet de la paume, de l’angle du stylet et de la physique d’une main posée sur du verre
- La gestion des calques tactile est un problème résolu — Les contrôles par balayage de Procreate prouvent que des opérations complexes ne nécessitent pas une interface complexe
- L’achat unique fidélise — Refuser l’abonnement était une décision de design, pas seulement commerciale ; cela exprime le respect pour la relation du créateur avec ses outils
Principes de conception fondamentaux
1. L’interface invisible
La plus grande réussite de Procreate en matière de design est ce que vous ne voyez pas. En mode peinture, la toile occupe la totalité de l’écran. La barre d’outils se réduit à une fine bande qui peut être masquée. Le curseur de brosse est le seul élément d’interface permanent. Tout le reste est accessible par des gestes.
MODE TOILE (État par défaut)
┌─────────────────────────────────────────┐
│ [Galerie] [+] [⚙] [🔧] [Calques] [Couleur]│
│ │
│ │
│ │
│ │
│ Espace toile pur │
│ Pas de chrome, pas de panneaux │
│ Juste votre art │
│ │
│ │
│ │
│ ← Taille ● │
│ brosse Opacité │
│ │
└─────────────────────────────────────────┘
COMPARAISON : Application de peinture bureau traditionnelle
┌─────────────────────────────────────────┐
│ [Barre de menus] │
│ [Barre d'outils] [Barre] [Barre] │
│ ┌────┐┌─────────────────────┐┌────────┐│
│ │Pan.││ ││Panneau ││
│ │Out.││ Toile ││Calques ││
│ │ ││ (60% de l'écran) ││ ││
│ │ ││ ││ ││
│ │ │├─────────────────────┤│ ││
│ │ ││ Réglages de brosse ││ ││
│ └────┘└─────────────────────┘└────────┘│
│ [Barre d'état] │
└─────────────────────────────────────────┘
La différence est frappante. Procreate accorde 95 % de l’espace écran à la toile. Les applications de bureau en cèdent souvent 40 % aux barres d’outils, panneaux et menus. C’est possible parce que les gestes remplacent les boutons.
2. Grammaire gestuelle
Le système gestuel de Procreate suit une grammaire cohérente qui, une fois intériorisée, rend chaque opération instantanée.
RÉFÉRENCE DES GESTES
──────────────────────────────────────────
ANNULER / RÉTABLIR
Toucher à deux doigts → Annuler
Toucher à trois doigts → Rétablir
Maintien à deux doigts → Annulation rapide (parcourir l'historique)
MANIPULATION DE LA TOILE
Pincement à deux doigts → Zoom avant/arrière
Rotation à deux doigts → Rotation de la toile
Glissement à deux doigts → Déplacement de la toile
Pincement rapide au min. → Ajuster la toile à l'écran
SÉLECTION ET OUTILS
Balayage à trois doigts ↓ → Menu Couper/Copier/Coller
Toucher maintenu → Pipette (échantillonnage de couleur)
Dessiner puis maintenir → QuickShape (la ligne se redresse)
CALQUES
Balayage droit sur calque → Sélection multiple
Balayage gauche sur calque → Verrouiller / Supprimer / Dupliquer
Pincer deux calques → Fusionner les calques
Appui long + glisser → Réordonner les calques
COULEUR
Maintenir sur un échant. → Supprimer la couleur
Glisser depuis le disque → Remplissage par couleur
La grammaire obéit à des règles : deux doigts pour les opérations de toile, trois doigts pour le presse-papiers, toucher-maintenir pour l’échantillonnage et l’accrochage. Cette cohérence fait que les artistes apprennent le système, pas des raccourcis individuels.
3. Le rejet de paume, une ingénierie invisible
Sur une toile où vous posez la main en dessinant, le système doit distinguer entre une paume, un toucher du doigt, un geste du doigt et un trait d’Apple Pencil. Le rejet de paume de Procreate est si fiable que les artistes oublient qu’il existe — ce qui est précisément l’objectif.
HIÉRARCHIE DE DISCRIMINATION DES ENTRÉES
──────────────────────────────────────────
Priorité 1 : Apple Pencil
→ Toujours traité comme entrée de dessin
→ Pression, inclinaison et azimut capturés
→ Latence inférieure à 7 ms jusqu'au pixel
Priorité 2 : Gestes à plusieurs doigts (motifs reconnus)
→ Pincement/rotation/déplacement à deux doigts
→ Toucher à deux doigts (annuler)
→ Toucher à trois doigts (rétablir)
→ Reconnu en moins de 50 ms
Priorité 3 : Toucher à un doigt
→ Traité comme estompage/peinture SI « peinture au doigt » activée
→ Sinon traité comme interaction avec la toile
→ Jamais confondu avec la paume posée
Rejeté : Contact de la paume
→ Grande surface de contact + faible pression + bord de la main
→ Rejeté dès la première image tactile
→ Aucune marque, aucun geste déclenché
L’ingénierie est complexe, mais le résultat en termes de design est simple : posez votre main sur l’écran et dessinez. L’outil disparaît.
Motifs de conception à emprunter
Courbes de pression et personnalisation des brosses
Le moteur de brosses de Procreate repose sur des courbes de pression qui associent l’entrée de l’Apple Pencil au comportement de la brosse. L’éditeur de courbes est en soi une leçon de design sur la façon de rendre des paramètres complexes tangibles.
ÉDITEUR DE COURBE DE PRESSION
──────────────────────────────────────────
Sortie (Effet de la brosse)
100% │ ╱
│ ╱
│ • ← Glisser les points de contrôle
│ ╱
50% │ ╱
│ •
│╱
0% └──────────────────
0% 50% 100%
Entrée (Pression du stylet)
COURBE LINÉAIRE (par défaut) :
Pression légère → trait fin
Pression forte → trait épais
Réponse proportionnelle
COURBE EN S (pour le lettrage) :
Pression légère → très fin (trait de plume)
Moyenne → saut vers une épaisseur moyenne
Pression forte → plateau au maximum
Plus de contrôle dans la plage intermédiaire
COURBE LOURDE (pour le croquis) :
Pression légère → déjà une épaisseur moyenne
Variation minimale avec la pression
Épaisseur de trait constante
/* Équivalent web : éditeur de courbe de pression en SVG */
.pressure-curve-editor {
position: relative;
width: 200px;
height: 200px;
background: #1a1a2e;
border: 1px solid #333;
border-radius: 8px;
overflow: hidden;
}
.pressure-curve-editor .grid-line {
stroke: #ffffff10;
stroke-width: 1;
}
.pressure-curve-editor .curve-path {
fill: none;
stroke: #5ce1e6;
stroke-width: 2;
stroke-linecap: round;
}
.pressure-curve-editor .control-point {
width: 12px;
height: 12px;
background: #fff;
border-radius: 50%;
cursor: grab;
position: absolute;
transform: translate(-50%, -50%);
box-shadow: 0 0 8px rgba(92, 225, 230, 0.5);
}
.pressure-curve-editor .control-point:active {
cursor: grabbing;
transform: translate(-50%, -50%) scale(1.2);
}
/* Remplissage sous la courbe */
.pressure-curve-editor .curve-fill {
fill: rgba(92, 225, 230, 0.08);
}
Gestion des calques pour le tactile
Procreate a résolu le défi de la gestion de dizaines de calques sur un écran tactile. Le panneau des calques utilise des gestes de balayage au lieu de minuscules boutons, et la fusion se fait par un pincement physique entre deux rangées de calques.
PANNEAU DES CALQUES
┌─────────────────────────────────┐
│ Calques [+] │
│ │
│ ┌─────────────────────────────┐ │
│ │ ☑ Calque 8 (Détails) N │ │ ← Mode de fusion : Normal
│ │ [Aperçu miniature] 100% │ │ ← Curseur d'opacité
│ ├─────────────────────────────┤ │
│ │ ☑ Calque 7 (Hautes lum.) S │ │ ← Mode de fusion : Screen
│ │ [Aperçu miniature] 80% │ │
│ ├─────────────────────────────┤ │
│ │ ☑ Calque 6 (Ombres) M │ │ ← Mode de fusion : Multiply
│ │ [Aperçu miniature] 60% │ │
│ ├─────────────────────────────┤ │
│ │ ☑ Calque 5 (Couleur) N │ │ ← Balayage gauche : Verrouiller/Supprimer
│ │ [Aperçu miniature] 100% │ │ ← Balayage droit : Multi-sélection
│ ├─────────────────────────────┤ │ ← Pincer ces deux calques : Fusionner
│ │ ☑ Calque 4 (Encrage) N │ │
│ │ [Aperçu miniature] 100% │ │
│ └─────────────────────────────┘ │
│ │
│ Couleur de fond : [■ #f5f0e8] │
└─────────────────────────────────┘
GESTES :
Toucher la miniature → Basculer la visibilité
Toucher le nom du calque → Renommer
Balayage gauche → Verrouiller | Dupliquer | Supprimer
Balayage droit → Sélectionner pour opérations multi-calques
Toucher à deux doigts → Basculer le verrouillage alpha
Appui long + glisser → Réordonner
Pincer deux rangées → Fusionner les calques
Le geste de pincement pour fusionner est particulièrement élégant. Il transpose la métaphore physique de presser deux choses ensemble vers l’opération numérique de combinaison de calques. Pas de boîte de dialogue de confirmation — il suffit de pincer et les calques fusionnent. L’annulation est toujours à un toucher à deux doigts.
Animation Assist
L’Animation Assist de Procreate transforme la pile de calques en une timeline image par image. Le design réutilise des concepts existants (les calques deviennent des images) plutôt que d’introduire un paradigme entièrement nouveau.
MODE ANIMATION ASSIST
┌─────────────────────────────────────────┐
│ │
│ [Toile avec pelure d'oignon] │
│ │
│ Image courante en pleine opacité │
│ Image précédente à 25% (teinte rouge)│
│ Image suivante à 25% (teinte verte) │
│ │
├─────────────────────────────────────────┤
│ ◀ ▶ ● ○ ○ ○ ○ ○ ○ ○ ○ ○ ○ ▶▶ │
│ ↑ ↑ ↑ │
│ Lecture Image courante IPS : 12 │
│ (en surbrillance) │
│ │
│ [Pelure d'oignon] [Réglages] [Ajouter] │
└─────────────────────────────────────────┘
RÉGLAGES DE LA PELURE D'OIGNON
Images affichées : 1-4 précédentes, 1-4 suivantes
Opacité : 10%-80% par image
Couleur : Rouge (passé) / Vert (futur)
Fusion : Normal ou Multiply
La pelure d’oignon utilise le rouge pour les images passées et le vert pour les images futures — une convention héritée des tables lumineuses de l’animation traditionnelle. Les artistes formés sur papier comprennent immédiatement le système.
Flux d’exportation
Procreate prend en charge l’exportation vers tous les formats majeurs, mais l’interface d’exportation est conçue autour de l’intention de l’artiste plutôt que des spécifications techniques.
MENU PARTAGER (Basé sur l'intention)
┌─────────────────────────────────────────┐
│ Partager en tant que... │
│ │
│ ┌─────────┐ ┌─────────┐ ┌─────────┐ │
│ │Procreate│ │ PSD │ │ PDF │ │
│ │ .pro │ │Photoshop│ │ Print │ │
│ └─────────┘ └─────────┘ └─────────┘ │
│ ┌─────────┐ ┌─────────┐ ┌─────────┐ │
│ │ JPEG │ │ PNG │ │ TIFF │ │
│ │ Partage │ │ Web │ │ Archive │ │
│ └─────────┘ └─────────┘ └─────────┘ │
│ │
│ Pour les animations : │
│ ┌─────────┐ ┌─────────┐ ┌─────────┐ │
│ │ GIF │ │ MP4 │ │ PNG │ │
│ │ Animé │ │ Vidéo │ │Séquence │ │
│ └─────────┘ └─────────┘ └─────────┘ │
└─────────────────────────────────────────┘
L’exportation PSD préserve les calques, les modes de fusion et les masques — ce qui signifie que Procreate peut être l’outil de départ dans un flux de travail qui se termine sur bureau. Cette interopérabilité est un choix de design qui respecte le processus existant de l’artiste plutôt que d’exiger qu’il l’abandonne.
Le verdict
Procreate a réussi en rejetant l’idée que les outils créatifs professionnels nécessitent des interfaces d’outils créatifs professionnels. Au lieu d’entasser les 30 années d’interface accumulées par Photoshop sur un écran tactile, Savage Interactive s’est demandé ce que dessiner sur du verre devait réellement procurer comme sensation, puis a construit à partir de cette question.
La grammaire gestuelle est le fondement. Chaque décision — du rejet de paume à la fusion par pincement des calques en passant par QuickShape — sert le principe que l’interface doit s’effacer pour laisser l’artiste seul avec sa toile. Une latence inférieure à 7 ms n’est pas un chiffre de fiche technique ; c’est la différence entre « dessiner sur un écran » et « dessiner ».
Idéal pour apprendre : Comment concevoir des systèmes d’interaction gestuelle pour les outils créatifs. Étudiez la cohérence de la grammaire à deux doigts/trois doigts, l’éditeur de courbes de pression comme modèle pour rendre des paramètres complexes tangibles, et comment la gestion des calques a été repensée pour le tactile sans sacrifier les capacités professionnelles.
Questions fréquentes
Comment Procreate atteint-elle une latence stylet inférieure à 7 ms ?
Procreate utilise l’API de toucher prédictif d’Apple combinée au rendu Metal pour minimiser l’écart entre le contact du stylet et la réponse pixel. L’application prédit la direction du trait en fonction de la vitesse et de l’angle, en rendant les pixels prédits en avance sur les données tactiles réelles. Quand les données réelles arrivent, la prédiction est corrigée de manière transparente. Ce pipeline de prédiction, combiné au rafraîchissement à 120 Hz de ProMotion, crée l’illusion d’une latence nulle.
Pourquoi Procreate a-t-elle rejeté le modèle d’abonnement ?
La position de Savage Interactive est que les outils créatifs doivent être possédés, pas loués. Un achat unique crée une relation différente entre l’artiste et l’outil — une relation de propriété plutôt que d’obligation. Cette décision signifie aussi que Procreate doit apporter suffisamment de valeur dans chaque mise à jour majeure pour générer de nouvelles ventes plutôt que de compter sur des revenus récurrents des utilisateurs existants. Le résultat : des mises à jour qui font véritablement progresser l’outil plutôt qu’un découpage incrémental des fonctionnalités.
Comment fonctionne QuickShape ?
Quand un artiste dessine une forme et maintient le stylet à la fin du trait, Procreate reconnaît la géométrie et l’ajuste en une version propre. Un cercle tremblant devient un cercle parfait. Une ligne approximative devient parfaitement droite. Un rectangle maladroit s’ajuste avec des angles perpendiculaires. La durée du maintien sert de déclencheur — elle distingue la création intentionnelle de forme du croquis rapide. Le trait original est conservé dans l’historique d’annulation, permettant à l’artiste de revenir en arrière à tout moment.
Comment Procreate gère-t-elle l’inclinaison et l’azimut de l’Apple Pencil ?
Procreate associe l’angle d’inclinaison et l’azimut de rotation du stylet aux paramètres de la brosse. Un pinceau crayon tenu à un angle prononcé produit des traits fins et précis. Le même pinceau tenu à un angle faible produit des traits larges d’ombrage — exactement comme un vrai crayon. Chaque brosse peut personnaliser sa réponse à l’inclinaison et à l’azimut via les réglages du moteur de brosses, permettant aux artistes de créer des outils qui se comportent comme des médiums physiques spécifiques.
Qu’est-ce qui distingue le système de calques de Procreate des applications bureau ?
Le système de calques de Procreate offre les mêmes capacités que les applications bureau — modes de fusion, opacité, verrouillage alpha, masques d’écrêtage, groupes — mais le modèle d’interaction est entièrement basé sur les gestes. Il n’y a pas de menus contextuels ni de minuscules boutons à icônes. Le balayage, le pincement, le toucher et l’appui long remplacent chaque contrôle traditionnel. Le nombre maximum de calques est limité par la résolution de la toile et la RAM de l’appareil, ce que Procreate communique clairement lors de la création d’une nouvelle toile.