Plan global · App icon
Master normalisé 1024 × 1024. Fond Ink Plum, trajectoire corail et jalons issus des couleurs sémantiques. Utilisation réservée au produit et à ses raccourcis d’application.
Digital Experience Strategy
Design System & BrandPixwell
Pixwell est la marque professionnelle de Mathieu Bouchard. Elle structure une pratique de diagnostic et de stratégie d’expérience numérique — avec l’IA comme amplificateur, jamais comme substitut au jugement humain.
PIXWELL SIGNALAI-ENHANCED
AI
ENHANCED
ENHANCED
Strategy
UX
Brand
Growth
About / Profile
AI-Enhanced Digital Experience Strategist
Strategy · UX · Brand · Growth
Mon parcours relie design, branding, marketing numérique et expérience utilisateur. J’aborde les projets avec une logique stratégique et structurée : comprendre le problème, connecter les bonnes disciplines et transformer les idées en expériences numériques cohérentes.
Après plusieurs années en design, en entrepreneuriat et en stratégie numérique, j’intègre aujourd’hui l’UX, le product thinking et l’IA à ma méthode afin d’accélérer la recherche, l’analyse, l’idéation et l’exécution — sans remplacer le jugement humain.
Pixwell n’est pas une agence : c’est ma marque professionnelle, mon laboratoire de méthode et mon portfolio. Elle soutient mon objectif de contribuer dans un rôle stratégique au sein d’une agence ou d’une entreprise, en collaboration avec les spécialistes requis.
Professional positioning
AI-Enhanced Digital Experience Strategist
Strategy · UX · Brand · Growth · ✦ AI-Enhanced
01 / Brand DNA
PIX × WELL × SWELL.
Le nom raconte l’identité de Pixwell : numérique, réfléchi et accessible. L’IA ne définit pas la marque; elle renforce la méthode.
01 / PIX
DigitalPrécision, systèmes, interfaces et culture numérique.
02 / WELL
ThoughtfulStratégie, clarté, logique et solutions bien construites.
03 / SWELL
ApproachableUne collaboration simple, directe et agréable.
04 / METHOD
AI-EnhancedL’IA renforce la recherche, l’analyse, l’idéation et l’exécution — sans remplacer le jugement humain.
Pixwell DNA / Correlation map
Strategy · UX · Brand · Growth · AI-Enhanced
02 / Brand architecture
What Pixwell stands for.
Pixwell est une marque professionnelle personnelle : elle relie stratégie, UX, marque et croissance pour diagnostiquer les enjeux, clarifier les priorités et orienter les bonnes interventions.
Mission
Créer des expériences numériques plus claires, cohérentes et performantes.
En réunissant stratégie, UX, marque et croissance dans une même réflexion.
Vision
Réduire la fragmentation entre design, marketing et expérience numérique.
Une même logique doit connecter les besoins humains, la marque et les objectifs d’affaires.
Value proposition
Comprendre et structurer avant de produire.
Pixwell diagnostique l’expérience numérique, clarifie les priorités et oriente les expertises nécessaires sans se présenter comme une agence d’exécution.
Objectif professionnel
Contribuer dans un rôle stratégique en agence ou en entreprise.
Pixwell rassemble la méthode, les apprentissages et les études de cas qui démontrent la valeur de Mathieu Bouchard comme Digital Experience Strategist.
Core promise
Strategy × UX × Brand × Growth — réunis dans une seule perspective pour créer des expériences numériques qui ont du sens pour les utilisateurs et pour l’entreprise.
Strategic process
Discover → Diagnose → Define → Blueprint → Enable. La démarche part du contexte, s’appuie sur les preuves et se termine par une orientation claire, une feuille de route et un transfert vers les bonnes expertises.
✦ AI-Enhanced Method
Research → Analyze → Ideate → Create → Optimize. L’IA est une couche transversale de la méthode, jamais un service autonome ni le cœur identitaire de Pixwell.
02 / Imagery
Structure + people.
Cinq images intégrées directement au HTML : architecture, géométrie, technologie et collaboration. Elles ne dépendent plus d’URL externes, donc elles ne se briseront pas.
03 / Texture language
Abstract, digital, controlled.
Trois textures abstraites reprennent le langage de la v3 : elles ajoutent une couche numérique plus distinctive sans remplacer les images humaines et architecturales. Flow Mesh est réservé aux heroes et moments de marque; Digital Glass aux sections IA, produit et systèmes; Signal Waves au Growth, aux données et au mouvement.
Application au site Pixwell : Flow Mesh dans les heroes Expertise, Méthode et À propos; Digital Glass dans les sections IA et la présentation du système PIXWELL DEB; Signal Waves dans le pilier Growth et l’analyse des données de l’étape Evidence. Les photographies humaines restent distinctes. Conserver les fichiers originaux, sans recoloration, répétition ni étirement; assurer la lisibilité avec un voile aubergine et adapter le cadrage au mobile.
Flow MeshHero · Brand moments
Digital GlassAI · Product · Systems
Signal WavesGrowth · Data · Motion
04 / System
La bibliothèque Pixwell.
Les fondations et tous les composants déjà créés sont regroupés ici. Les onglets permettent de consulter le système complet sans produire une page interminable.
Identité
Official logo lockup
PIXWELL
Le mot-symbole PIXWELL est toujours précédé des quatre pixels. Leur ordre chromatique, leurs proportions et leur espacement sont fixes. Cette signature complète est utilisée dans tous les en-têtes, produits et instances Pixwell. Pour les favicons et les icônes macOS, les quatre pixels sont utilisés seuls, dans les mêmes couleurs et proportions, sur un arrière-plan entièrement transparent.
Violet
100
#8C62FF80
#A381FF60
#BAA1FF40
#D1C0FF20
#E8E0FFCorail
100
#FF735F80
#FF8F7F60
#FFAB9F40
#FFC7BF20
#FFE3DFMagenta
100
#E456A880
#E978B960
#EF9ACB40
#F4BBDC20
#FADDEECyan
100
#69D6D080
#87DED960
#A5E6E340
#C3EFEC20
#E1F7F6Neutres
Ink Plum
#100C18Aubergine
#181020Deep Plum
#21172FMuted
#B9AEC2Lavender
#EEE9F6Warm Mist
#F3EEEBInk Light
#F7F3FALight Ink
#241B2BRègles sémantiques
Digital Experience Strategy
Le corail porte le positionnement stratégique.
#FF735F · Coral✦ AI-Enhanced
Le violet 80 identifie les mentions IA sur fond sombre.
#A381FF · Violet 80Data · Tech · Interaction
Le cyan est réservé aux données et états technologiques secondaires.
#69D6D0 · CyanSource unique et synchronisation
Le site Pixwell, PIXWELL DEB, le Plan global et ce document chargent les mêmes variables et primitives. Toute modification du système conçue dans un outil, un site ou une autre instance Pixwell doit aussi être documentée dans cette page. Lorsqu’elle devient une norme partagée, elle doit être centralisée dans les sources communes afin que toutes les instances puissent en hériter.
Shared/pixwell-design-tokens.cssShared/pixwell-components.cssPolice principale
Inter
Famille officielle de Pixwell
Inter est utilisée pour les interfaces, les contenus et les titres. La pile de remplacement est SF Pro Display, Segoe UI, Arial, puis sans-serif. Les graisses sont centralisées dans les variables partagées.
Inter est utilisée pour les interfaces, les contenus et les titres. La pile de remplacement est SF Pro Display, Segoe UI, Arial, puis sans-serif. Les graisses sont centralisées dans les variables partagées.
Light
300 · grands textes éditoriauxRegular
400 · paragraphes et lectureMedium
500 · navigation discrèteSemibold
600 · emphase et donnéesBold
700 · boutons et sous-titresExtraBold
800 · H1, H2, H3 et labelsHiérarchie typographique
Digital experiences,thoughtfully engineered.
Design System & Brand Pixwell
Distinctively digital.
Une perspective intégrée.
Pixwell connecte stratégie, UX, marque et croissance pour créer des expériences numériques plus claires.
Le texte courant privilégie la lisibilité, les lignes modérées et un contraste mesuré. Le texte secondaire utilise Muted; le contenu principal utilise Ink Light.
Digital Experience Strategy
04 / System
04 / System
Norme iconographique
Une grille, un trait, trois formats.
Les pictogrammes sont dessinés dans un viewBox carré, sans remplissage, avec un trait de 1,75, des extrémités arrondies et la couleur héritée du contexte.
Grille32 × 32 ou 48 × 48, toujours carrée
Trait1,75 · round cap · round join
Formats20 px · 32 px · 48 px
CouleurUne couleur sémantique, jamais décorative
Bibliothèque actuelle
DNA et piliers stratégiques
Les huit pictogrammes développés à ce jour utilisent désormais la même primitive centrale.
PIX / DigitalSystèmes, interfaces et précision numérique.
WELL / ThoughtfulClarté, réflexion et équilibre.
SWELL / ApproachableDimension humaine et collaboration.
AI-EnhancedIA comme accélérateur transversal.
StrategyDirection, positionnement et décision.
UXPersonnes, parcours et interaction.
BrandForme, identité et système visuel.
GrowthMesure, progression et optimisation.
Actif d’identité
La marque quatre pixels n’est pas une icône fonctionnelle.
Elle est réservée au logo, au favicon et à l’icône macOS. Ses couleurs, proportions et ordre ne changent jamais. Elle ne remplace pas les pictogrammes d’interface.
Identités de produit
Plan global et PIXWELL DEB
Les produits restent rattachés à Pixwell tout en possédant un signe secondaire distinctif.
PIXWELLDEB
Favicon PIXWELL DEB
SVG · 512 × 512 · transparentPIXWELL DEB · Product lockup
Le logo Pixwell reste intact. Le suffixe DEB devient un module produit compact, avec fond aubergine et contour violet. Le favicon conserve les quatre pixels officiels; le nom de l’onglet distingue le produit.
Actions
Boutons
Hiérarchie primaire, secondaire et état indisponible.
Sélection & métadonnées
Tags, chips et tokens
Éléments courts pour expertise, statut, filtre et propriété.
StrategyUXBrandGrowth✦ AI-EnhancedDiscovery
Saisie
Champs de formulaire
Étiquettes visibles, aide concise et focus cyan.
États interactifs
Navigation locale
Les onglets indiquent clairement l’état actif et demeurent accessibles au clavier.
Vue d’ensembleDécisionsLivrables
DefaultHoverFocusDisabled
Surfaces
Panels et cartes
Niveaux de surface fondés sur Aubergine et Deep Plum.
Panel
Surface standard
Contenu regroupé et bordure discrète.
Elevated
Surface élevée
Accentue une information prioritaire.
Progression & statut
Suivi d’activité
Utilisé dans DEB, Pulse et les outils de diagnostic.
DiscoveryEn cours
8 observations capturées68 %
Patterns métier
Discovery & livrables
Familles spécialisées déjà disponibles dans la couche partagée.
RecorderMeeting frameworkClient guideReview statsExport cardClosing summary
Contenu & expertise
Cartes éditoriales
Variantes utilisées pour présenter expertises, principes, projets et profils.
DNA cardPillarExpertisePhoto cardManifesto
Patterns PIXWELL DEB
Lundi · avant les outilsBusiness Customer Marketing Data
01 02
Entretien, questions et progression
Ces trois structures forment le langage principal de l’outil Discovery. Elles conservent leur hiérarchie, leur contraste et leur logique responsive.
Comprendre ce que le client veut accomplir.
La première rencontre clarifie quatre dimensions avant toute recommandation.
Revenus · acheteurs · cycle de vente · marchés prioritaires
Client réel · rôles · influenceurs · problème déclencheur
Acquisition · volume · qualification · rôle du site
Conversions · fiabilité · accès · données produit
BUSINESS → CUSTOMER → PROBLEM → JOURNEY → ACQUISITION → CONVERSION → MEASUREMENT
Préparé pour le client
Questions spécifiques
Questions issues de la recherche et du guide d’entretien.
Meeting frameworkDiscovery cueClient guideClient questionSidebar navigationProgress state
05 / Strategic pillars
Four disciplines. One perspective.
Le même principe que le graphique hero : la valeur vient de la corrélation entre Strategy, UX, Brand et Growth.
Strategy
Positioning · Discovery · Digital Strategy · Product Thinking
UX
Research · Journeys · Architecture · Prototyping
Brand
Brand Strategy · Positioning · Systems · Direction
Growth
Acquisition Strategy · SEO/SEM Analysis · Conversion · Measurement
✦ AI-Enhanced — Research → Analyze → Ideate → Create → Optimize
Pixwell principle
Enhanced by AI.
Driven by human judgment.
Application au site · 30 août 2026
Portfolio, navigation et respiration.
Évolutions locales du prototype Pixwell. Les choix éditoriaux sont implémentés pour révision; ils ne remplacent pas automatiquement les signatures de marque validées.
Surfaces
Aubergine et pauses claires.
Expertise et Méthode alternent les surfaces neutral-mist, neutral-20 et les aubergines. À propos conserve ses photos et ajoute une section claire pour les outils. Les cartes sombres conservent leur propre texte clair, même dans une section pâle.
Couleurs sémantiques
Des accents porteurs de sens.
Magenta : marque, dimension humaine et collaboration. Cyan : états d’interface, données et repères de preuve. Corail : positionnement stratégique. Violet 80 : mentions IA sur fond sombre. Aucune nouvelle palette ni modification des jetons communs.
Traitement C validé par Mathieu le 31 août 2026 : les petits labels du site sur fond pâle utilisent coral-80 sur une pastille opaque neutral-80 (contraste 8,37:1). Les labels IA utilisent violet-80 sur le même fond (6,32:1). Padding 8 × 11 px, rayon 6 px, largeur ajustée et retour à la ligne permis. Les labels généraux déjà lisibles sur fond sombre sont conservés. La variante de corail soutenu B n’est pas adoptée. Cette application reste locale au site; les feuilles partagées sont inchangées.
Images
Structure + people préservé.
Les cinq photographies de cette référence sont extraites sans modification vers les actifs du site. Expertise associe architecture et usages; Méthode utilise la collaboration. Les trois dossiers emploient des visuels d’ambiance explicitement provisoires, jamais des preuves de réalisation. Flow Mesh, Digital Glass et Signal Waves restent des originaux distincts.
Navigation
Deux regroupements lisibles.
Approche : Expertise et Méthode. Portfolio : sous-menu Études de cas contenant Vue d’ensemble, DVOX, Boumgrafik et Carpool App; Archives visuelles reste à côté. Ce sous-menu des trois dossiers est demandé explicitement par Mathieu. À propos, Articles et Contact restent au premier niveau. Les sous-menus utilisent des éléments natifs ouvrables au clavier; la page courante porte aria-current="page" et ses groupes parents sont soulignés. Les URL existantes sont conservées.
Francisation · proposition
Des expériences numériques, pensées avec soin.
Traduction appliquée au site pour la demande de francisation. Les signatures historiques « Digital Experience Strategy » et « Digital experiences, thoughtfully engineered. » restent archivées comme décisions validées. L’adoption permanente de la traduction française est à confirmer par Mathieu. « Articles » remplace provisoirement « Analyses » pour expliciter le type de contenu, sans promesse SEO.
Composants locaux
Documenter sans surpromettre.
Gabarit d’étude de cas, repères de preuve et cartes de liens. Pour les outils : icône existante, nom, niveau textuel et usage concret remplacent les barres sur 10. Les niveaux explicitement confirmés par Mathieu priment sur les anciennes propositions issues des scores; les outils non évalués restent sans note. Les couleurs propres aux marques sont conservées dans les pictogrammes, sans élargir la palette de l’interface. Le violet souligne le groupe IA. Les groupes complémentaires séparent plateformes Web, relation client/gestion, acquisition, présence locale et environnement technique; la pratique directe est distinguée de la coordination. Une fréquence d’utilisation ne devient pas un niveau de maîtrise. Un groupe Réunions et visioconférence réunit les outils déclarés; le repère Expérience antérieure pour les services arrêtés reste distinct d’un niveau de connaissance.
Dans À propos, six cartes de responsabilités précèdent les outils : un exemple CMG et cinq volets confirmés directement par Mathieu. La grille passe de trois à deux puis une colonne; l’accent magenta souligne le volet humain et créatif. Le titre professionnel « Stratège en expérience numérique — Marque, UX et pilotage de projets » est validé. Ces variantes restent locales au site tant qu’une promotion dans les composants partagés n’est pas validée.