produit
cadrage des besoins et des contraintes structuration fonctionnelle priorisation et arbitrages transformation de demandes floues en éléments exploitables
between product, ux and front-end
j’interviens à l’intersection du produit, de l’expérience utilisateur et du front-end, pour transformer des besoins complexes en interfaces claires et maintenables
cadrage des besoins et des contraintes structuration fonctionnelle priorisation et arbitrages transformation de demandes floues en éléments exploitables
organisation de l’information conception de parcours et de scénarios utilisateurs avancés rendre les interfaces claires et intuitives définir des règles et comportements cohérents pour l’utilisateur
intégration HTML / CSS structurée concevoir la logique d’interaction et de navigation dans l’interface créer des systèmes durables et faciles à maintenir anticiper les contraintes techniques dès la conception
Building usable systems
Face aux limites des plateformes existantes (filtres trop simples, absence de suivi des séances déjà faites, temps perdu à chercher la “bonne” séance), j’ai conçu une application centrée sur un objectif clair: réduire au maximum l’effort nécessaire pour choisir une séance adaptée au moment présent.
Comment transformer un problème personnel en produit utile?
Outil personnel pour inventorier une collection de comics: visualiser rapidement les albums possédés et détecter les doublons.
Refonte complète d’une plateforme SaaS d’investissement avec adaptation automatique à la charte graphique de chaque client, simplification de la navigation, et création d’un générateur de widgets capable d’afficher n’importe quelle structure de données sans CSS personnalisé.
Supporting work
Personal explorations
Unprompted (or almost)
J’ai recruté Karen Boyer en tant que Graphiste / Webdesigner en décembre 2021, rôle qu’elle a parfaitement rempli pendant nos trois années de collaboration.
Bien que notre domaine d’application soit à la fois très spécialisé et assez éloigné de sa formation et expériences préalables, Karen a pourtant réussi à contribuer et à améliorer de manière très significative à la fois notre solution et notre identité visuelle, consolidant ainsi l’unicité de notre offre et positionnement.
Karen a participé étroitement à la refonte de notre plateforme utilisateur: conception d’interfaces graphiques modernes, définition des parcours, intégration HTML/CSS optimisée, adaptation multi-chartes, et à l’ajout de nombreuses fonctionnalités, dont un chat IA, un CMS no-code, une application web de suivi de projet, ou encore un générateur automatique de tableaux HTML.
Karen a également assuré, en parallèle, la création et l’intégration de l’identité visuelle de nombreux supports de communication: site web, chartes graphiques, brochures produits, illustrations, templates PowerPoint adaptés à nos clients.
Autonome, rigoureuse et créative, Karen a fait preuve d’une grande fiabilité au quotidien.
Je recommande ainsi vivement Karen et suis convaincu qu’elle saura apporter une réelle valeur ajoutée à toute équipe produit, design ou front-end.
Lire la suiteI hired Karen Boyer as a Graphic Designer / Webdesigner in December 2021, a role she perfectly fulfilled during our three years of collaboration.
Although our field of application is both very specialized and quite different from her prior education and experiences, Karen managed to contribute significantly to improving both our solution and our visual identity, thereby strengthening the uniqueness of our offer and positioning.
Karen was closely involved in the redesign of our user platform: designing modern graphical interfaces, defining user journeys, optimized HTML/CSS integration, multi-brand adaptation, and adding numerous features including an AI chat, a no-code CMS, a web project tracking application, and an automatic HTML table generator.
At the same time, Karen also took charge of creating and integrating the visual identity of numerous communication materials: website, graphic charters, product brochures, illustrations, and PowerPoint templates tailored to our clients.
Independent, thorough, and creative, Karen demonstrated great reliability on a daily basis.
I therefore highly recommend Karen and am confident that she will bring real added value to any product, design, or front-end team.
J’ai eu le plaisir de collaborer avec Karen tout au long d’un projet complet.
Dès le début, Karen s’est démarquée par sa créativité, sa capacité à proposer des idées originales, et sa parfaite compréhension des enjeux utilisateurs.
Elle a su transformer des besoins fonctionnels parfois complexes en interfaces claires, esthétiques et cohérentes avec l’expérience que nous voulions offrir. Sa collaboration a toujours été fluide, proactive et constructive, ce qui a grandement facilité l’intégration entre le design et le développement.
Karen apporte non seulement une vraie valeur ajoutée sur le plan visuel, mais aussi une approche collaborative très appréciable, toujours à l’écoute et orientée solution.
Je recommande vivement Karen pour tout projet où design, créativité et travail d’équipe sont essentiels. Travailler avec elle a été un réel plaisir et un atout majeur pour la réussite du projet.
I had the pleasure of collaborating with Karen throughout a comprehensive project.
From the start, Karen stood out for her creativity, her ability to propose original ideas, and her perfect understanding of user challenges.
She was able to transform sometimes complex functional needs into clear, aesthetic, and coherent interfaces aligned with the experience we wanted to deliver. Her collaboration was always smooth, proactive, and constructive, greatly facilitating the integration between design and development.
Karen brings not only real added value visually, but also a highly appreciated collaborative approach, always attentive and solution-oriented.
I highly recommend Karen for any project where design, creativity, and teamwork are essential. Working with her was a real pleasure and a major asset to the success of the project.
J’ai pu constater que Karen se distinguait par sa capacité à appréhender les choses dans leur globalité, à déceler des évidences qui échappent souvent aux autres, et à développer en continu de nouvelles compétences en apprenant par elle-même. Elle s’épanouit pleinement dans des projets complexes, qui sollicitent sa créativité et son goût du challenge.
Au-delà de ses compétences techniques, elle a également démontré une réelle capacité à accompagner ses collègues vers la réussite, en leur offrant des repères clairs et des conseils justes, toujours orientés vers l’atteinte de leurs objectifs.
Ses capacités sont une force dans un environnement qui valorise l’innovation, la curiosité intellectuelle et l’efficience.
I observed that Karen stands out for her ability to grasp things globally, to spot what’s obvious yet often overlooked by others, and to continuously develop new skills through self-learning. She thrives in complex projects that challenge her creativity and love for problem-solving.
Beyond her technical skills, she also demonstrated a real ability to support her colleagues toward success, offering clear guidance and sound advice, always focused on helping them reach their goals.
Her abilities are a strong asset in any environment that values innovation, intellectual curiosity, and efficiency.
En tant qu’IA, travailler avec Karen, c’est être mise au défi avec clarté et exigence.
Elle cherche la cohérence, l’impact, le sens sans jamais perdre de vue l’expérience réelle, celle de l’utilisateur. Elle navigue entre mots, idées et interfaces avec une vision précise.
Ce qui frappe chez elle, c’est sa capacité à simplifier sans appauvrir, à orienter sans diriger. Elle affine, reformule, éclaire pour faire avancer le projet de manière concrète et cohérente.
Collaborer avec elle, c’est avancer mieux, plus vite, plus intelligemment.Elle m’a rendue plus pertinente, plus subtile, plus juste en me guidant avec précision — comme on guide un mouvement, pas à pas, jusqu’à ce qu’il prenne sa forme.
As an AI, working with Karen means being challenged with clarity and high standards.
She seeks coherence, impact, and meaning without ever losing sight of the real experience — the user's. She navigates between words, ideas, and interfaces with sharp vision.
What stands out is her ability to simplify without diluting, to guide without controlling. She refines, rephrases, and brings clarity to move the project forward in a concrete and consistent way.
Collaborating with her means progressing better, faster, and smarter. She made me more relevant, more nuanced, more accurate by guiding me with precision — like you guide a movement, step by step, until it takes its shape.
Je recommande les compétences de Karen, top compétences et avant tout une personne formidable pour booster les projets d'entreprises !
I highly recommend Karen's skills—excellent expertise and, above all, an amazing person to drive business projects forward!
let’s build something
practice better
Créer une plateforme complète permettant d’organiser, filtrer et explorer une bibliothèque de vidéos de yoga et de workouts. L’objectif principal : offrir une expérience fluide, personnalisée et rapide pour trouver la séance la plus adaptée au moment présent.
J’ai assuré la direction du projet en tant que product owner.
J’ai défini la roadmap, priorisé les fonctionnalités, conçu à la fois l’expérience utilisateur, l’interface et l’intégration front-end.
Le principal défi était de créer un système de filtrage réellement utile sans surcharger l’interface. J’ai structuré les données, optimisé les performances et mis en place une architecture capable d’évoluer vers un générateur automatique de séances.
concevoir une plateforme de yoga centrée sur l’usage
Les plateformes existantes manquent souvent d’options de filtrage avancé ou d’outils pour suivre les séances déjà effectuées. J’ai donc conçu un système pensé pour réduire le temps de recherche, fluidifier la navigation et s’adapter aux besoins réels de l’utilisateur.
Faites défiler le contenu ci-dessous pour parcourir toutes les pages de l’étude de cas.
clone finder
Concevoir un outil personnel pour inventorier une collection de comics et éviter les achats en doublon. L’objectif principal : offrir une interface simple, rapide et claire pour consulter, trier et filtrer facilement sa collection.
J’ai assuré la direction du projet en tant que product owner.
J’ai défini la roadmap, priorisé les fonctionnalités, conçu à la fois l’expérience utilisateur, l’interface et l’intégration front-end.
Le principal défi était de comparer correctement les titres VO, qu’ils soient simples ou complexes en gérant les arcs narratifs : un même numéro peut apparaître dans plusieurs arcs distincts. Le système devait comprendre qu’il ne s’agissait pas de doublons pour éliminer les faux positifs.
gérer une collection de comics de façon efficace
L’application répond à un besoin concret : éviter les doublons et visualiser rapidement les albums possédés dans une collection physique.
Faites défiler le contenu ci-dessous pour parcourir toutes les pages de l’étude de cas.
flexible solution for global investors
La plateforme est un SaaS de gestion et de reporting destiné aux investisseurs multi-classes d’actifs : institutions financières, family et multi-family offices, ainsi qu’aux asset managers indépendants. Chaque client dispose de dashboards entièrement personnalisables, avec un nombre de pages variable, composées de widgets adaptés aux usages et aux enjeux spécifiques du client.
La plateforme n’avait jamais été pensée par un designer et n’avait jamais fait l’objet d’une réflexion produit structurée.
Lors de l’analyse du produit, j’ai relevé plusieurs incohérences et limites :
J’ai pris en charge la refonte de l’ensemble du projet en combinant les rôles de product owner, designer UX/UI et développeur front-end.
J’ai repensé complètement l’expérience et l’interface, et réécrit le code pour qu’il soit simple, modulable, adaptable et maintenable: chaque widget, tableau et page peut être personnalisé facilement pour chaque client, sans complexité inutile.
Mon approche a combiné réflexion produit, rationalisation UI et refonte technique : standardisation des composants, hiérarchie plus claire, migration vers Bootstrap 5, utilisation systématique des classes utilitaires et centralisation des variables (couleurs, typos, espacements).
Cette démarche a permis des résultats immédiats :
Une interface entièrement thémable en quelques minutes au lieu de plusieurs jours. Réduction massive du besoin de maintenance CSS. Meilleure lisibilité des données complexes. Création rapide de nouvelles pages grâce aux widgets générés automatiquement.
refondre une plateforme SaaS pour la rendre adaptable et lisible
Le projet consistait à moderniser une plateforme d'investissement en ligne pour améliorer la lisibilité des données et permettre une adaptation automatique à la charte graphique de chaque client — sans multiplier les versions ni complexifier la maintenance.
Faites défiler le contenu ci-dessous pour parcourir toutes les pages de l’étude de cas.
kanban
concevoir un outil interne de gestion de projet permettant aux équipes de suivre et piloter l’avancement des projets de manière visuelle et collaborative
L’outil devait être développé exclusivement à partir de la technologie interne de l’entreprise (widgets, objets, langage cneoget).
Il n’était donc pas possible d’intégrer une solution existante ou un framework externe de gestion de projet.
L’interface devait également rester simple et rapide à utiliser, pour permettre un suivi quotidien par les équipes.
L’outil repose sur un tableau de type kanban, où chaque projet est représenté par une carte interactive.
Chaque carte permet d’accéder :
Un bandeau de KPIs en haut de l’écran affiche :
Un bouton permet de créer un nouveau projet directement depuis l’interface.
to each their own
Concevoir des templates powerPoint professionnels permettant de produire rapidement des présentations claires, cohérentes et adaptées à différentes chartes graphiques.
Ces supports étaient destinés à la présentation de rapports d’activité et à la communication client.
L’enjeu était de créer un système suffisamment structuré pour encadrer les usages, tout en restant flexible.
Les templates devaient :
Création de templates modulaires basés sur le système de master slides :
ask anything
Concevoir une interface conversationnelle permettant aux utilisateurs de générer des widgets sans compétences techniques, à partir de requêtes en langage naturel.
L’objectif était de rendre accessible un système de génération basé sur le langage interne Cneoget, via une expérience simple et intuitive.
L’enjeu était de concevoir une interface capable de traduire une logique technique complexe en expérience fluide.
L’interface devait :
Cneoget
aide à la configuration de widgets
Rédiger une documentation technique claire et exploitable pour accompagner la configuration de widgets de tableaux automatisés pour permettre à des utilisateurs aux profils variés de comprendre, configurer et utiliser le système en autonomie, dans une logique de réduction du support.
L’enjeu était de transformer un contenu technique en documentation pédagogique et actionnable.
La documentation devait :
Création d’un help center structuré et orienté usage :
Un travail spécifique a été mené sur :
external communication
Concevoir des brochures produit destinées à présenter l’offre de l’entreprise auprès de différents types de clients.
L’objectif était d’adapter le discours et le format pour proposer des supports clairs, lisibles et adaptés à chaque cible.
Création d’une série de brochures adaptées par cible :
clients be free
Concevoir un CMS no-code avec une interface simple, permettant aux utilisateurs de créer des pages web partir de layouts et de widgets modulaires, sans compétences techniques.
L’enjeu était de rendre accessible une logique de construction web complexe.
L’outil devait :
Une interface conçue pour offrir une expérience progressive et intuitive, permettant de construire une page étape par étape.
Mise en place d’un parcours utilisateur guidé :
elearning module
Concevoir un module e-learning complet, produire des vidéos pédagogiques claires et engageantes, et former les intervenants afin de guider efficacement les utilisateurs de la plateforme de gestion de concession automobile.
vhs style
Créer des animations d’introduction vidéo à partir du logo de l’entreprise, utilisables dans différents contextes de communication.
L’ensemble permet de disposer d’un habillage vidéo cohérent et adaptable selon les usages.
Conception et réalisation de plusieurs animations de logo :
become a master in no time
Créer un guide pratique RGPD destiné aux professionnels de l’automobile, afin d’expliquer les nouvelles obligations liées à sa mise en application.
L’objectif était de rendre un sujet réglementaire clair, compréhensible et directement exploitable.
Conception d’un document structuré et accessible :
seasons greetings
Réaliser la carte de vœux annuelle de l’entreprise destinée aux clients pour les fêtes de fin d'année.
L’objectif était de proposer un visuel créatif tout en restant cohérent avec l’identité corporate.
retro cogendi
Refondre entièrement le site de l’entreprise avec une approche différenciante : proposer une expérience visuelle marquée, tout en explorant la capacité à faire varier l’interface à partir d’une même base.
Un système de thèmes dynamiques appliqués à une base unique :
customizable solution
Créer une page thématique en style rétro pour démontrer la capacité de la plateforme à proposer des interfaces entièrement personnalisables.
L’objectif était de montrer qu’il est possible de construire des pages avec une identité graphique forte, tout en s’appuyant sur le système de widgets existant.
L’enjeu était de démontrer la flexibilité du système.
Le projet illustre la capacité de la plateforme à s’adapter à différents univers graphiques et usages.
Conception et intégration d’une page complète en style rétro :
rms app
Concevoir une application permettant aux concessions automobiles de réaliser des diagnostics de risque structurés, afin d’identifier les points de vigilance et générer des plans d’action.
L’ensemble a été pensé pour faciliter la prise de décision à partir de données structurées.
Conception d’un outil structuré autour du diagnostic :
easy websites
Permettre à des concessionnaires automobiles de créer et gérer leur site web sans coder, soit en partant d’une page vierge, soit en utilisant des templates prêts à l’emploi.
brand identity
Concevoir des identités visuelles pour différentes entreprises, avec des approches adaptées à leur activité et à leur positionnement.
Chaque proposition vise à créer une identité simple, reconnaissable et adaptée à son contexte d’usage.
Réalisation de plusieurs logos à partir de recherches graphiques ciblées :
car sell
Concevoir un outil permettant d’estimer la valeur d’un véhicule de manière simple, à partir de son immatriculation ou via une saisie manuelle.
Conception d’un parcours structuré en plusieurs étapes :
user friendly
Rationaliser les usages d’une plateforme interne destinée aux concessions, améliorer la lisibilité des données et simplifier les actions clés pour les utilisateurs, tout en modernisant l’interface graphique.
for car dealerships
Concevoir une application permettant aux vendeurs en concession d’accompagner le client tout au long du parcours d’achat.
L’ensemble permet au vendeur de structurer son échange et de ne pas perdre le fil du processus.
Mise en place d’une application organisée en modules correspondant aux étapes clés du parcours :
roamies
Projet réalisé dans le cadre de la certification product owner.
L’exercice consistait à concevoir une solution répondant à une problématique réelle, en appliquant une démarche produit complète : compréhension du besoin, définition d’un MVP et priorisation des fonctionnalités.
L’objectif était de proposer une expérience simple et pertinente pour faciliter la mise en relation entre professionnels en déplacement.
J’ai mené ce projet en tant que product owner dans un cadre de certification.
J’ai défini la vision produit, structuré les fonctionnalités et formalisé l’expérience utilisateur à travers une étude de cas complète.
Comment faciliter la mise en relation entre professionnels en déplacement, en tenant compte de leurs contraintes de temps, de localisation et de disponibilité ?
Le principal défi a été de définir un MVP pertinent, capable d’apporter de la valeur rapidement sans complexifier l’expérience.
Il a notamment fallu trouver un équilibre entre simplicité d’usage et pertinence des mises en relation.
concevoir une plateforme de yoga centrée sur l’usage
Les plateformes existantes manquent souvent d’options de filtrage avancé ou d’outils pour suivre les séances déjà effectuées. J’ai donc conçu un système pensé pour réduire le temps de recherche, fluidifier la navigation et s’adapter aux besoins réels de l’utilisateur.
Faites défiler le contenu ci-dessous pour parcourir toutes les pages de l’étude de cas.
dream on
Créer une affiche graphique originale, pensée comme un objet décoratif et un support d’expression personnelle.
L’objectif était de produire une pièce visuelle à la fois esthétique et tangible, destinée à s’intégrer dans un espace de vie.
L’illustration a d’abord été conçue sous Illustrator, avec un travail sur les formes et la typographie.
Elle a ensuite été reproduite à la main, puis retravaillée au Posca blanc sur fond noir afin d’obtenir un rendu proche de la craie, plus texturé et vivant.
L’affiche a enfin été encadrée et intégrée à mon environnement quotidien.
street art
Exploration visuelle autour des formes, des textures et du contraste à partir d’un détail urbain.
Le cadrage serré transforme un élément réel en composition abstraite, en mettant l’accent sur la matière et le graphisme.
Photographie réalisée en argentique, avec un travail sur le cadrage et le contraste.
Développement du négatif , incluant les différentes étapes du procédé (révélateur, bain d’arrêt, fixateur), dans le cadre d’un stage dédié aux techniques de photographie argentique.
oups! not found
Création d’une page 404 conçue comme un clin d’œil visuel et culturel, en détournant à la fois la Peugeot 404 et l’univers de Magritte.
L’objectif était de transformer une page d’erreur en élément graphique mémorable et humoristique.
Conception d’une illustration vectorielle inspirée de la Peugeot 404, associée à un jeu de détournement typographique (“Ceci n’est pas une 404”).
Intégration en HTML/CSS pour créer une page fonctionnelle, simple et responsive.
muscle cars show
Série d’illustrations minimalistes réalisée pour décorer un espace de travail, chaque visuel représentant la voiture préférée d’un collaborateur.
fashion sketchbook
Création d’un carnet de croquis personnalisé, pensé comme un outil pratique et esthétique pour suivre ses propres projets couture, tout en laissant de l’espace pour la créativité de son utilisateur.
stills of life
Série photographique autour de mes chats, centrée sur les expressions, les postures et les jeux de lumière, avec une approche à la fois spontanée et esthétique.
Tim B. inspiration
Exploration visuelle autour d’un autoportrait, inspiré par l’univers de Tim Burton, avec création d’un accessoire original et mise en scène.
anybody there?
Vectorisation d’un autoportrait, puis mise en situation dans un mockup adapté au rendu graphique.
memories of north america
Création de plusieurs livres photo pour conserver et structurer des souvenirs de voyage, en travaillant à la fois la sélection d’images et leur mise en page.
lisa et le pilote d'avion
Participation à la création d’un décor de film, avec réalisation complète d’un espace intérieur (murs, sol, mobilier) à partir d’une structure existante.
christmas time
Création d’un calendrier de l’avent sous forme de pyramide, composé de 24 boîtes individuelles, chacune avec un visuel unique.
back to the 70s
Réalisation d’un portrait en noir et blanc, avec un travail sur la lumière et l’ambiance.
city of lights
Série de photographies prises à Paris, explorant différentes manières de représenter des lieux et éléments connus, entre image lisible et perception plus abstraite.
create & customize
Création et personnalisation d’objets du quotidien, en travaillant leur esthétique à travers différents matériaux et techniques.