Case Study

CommiMe, la première application de commissions sans frais pensée pour les artistes.

Démarrage

Pour mon travail de fin d’année, j’ai réfléchi longuement à un sujet qui pourrait m’intéresser, et auquel je puisse apporter ma contribution. C’est dans un éclair d’inspiration que j’ai trouvé mon sujet — les commissions digitales !

Qu’est-ce qu’une commission ?

Une commission est une requête adressée à un artiste afin d’obtenir une œuvre personnalisée contre rémunération. Ce terme est surtout utilisé dans le monde du dessin digital anglophone, mais il a été adopté par la communauté artistique francophone avec le temps.

En ayant moi-même déjà acheté et vendu, je suis rapidement devenue consciente des problèmes de ce processus, autant pour les artistes que pour les clients : avoir de la visibilité est difficile, il est ardu de communiquer avec un étranger, les prix ne sont pas toujours abordables par rapport à notre budget, …

J’ai donc décidé de me pencher sur le sujet, avec pour ambition de faciliter ces échanges.

The Beginning ™

Tweet demandant à des artistes et des clients de commissions de répondre à une enquête.
Tweet de recherche de volontaires pour une interview.

Il a fallu trouver quelque part où commencer, un point sur lequel me tenir afin de visualiser les chemins sur lesquels je pouvais avancer. Mon idée était née, désormais, je devais m’interroger sur le public qui l’accueillerait. L’hypothèse qui découla de ce questionnement était que je devais principalement poser des questions à des artistes en recherche de visibilité, donc moins connus, ainsi qu’aux clients qu’ils possèdent déjà.

Pour ce faire, j’ai posté un message sur mon compte Twitter de dessin où j’avais déjà fait des commissions en demandant aux personnes qui acceptaient de répondre à des questions de se manifester, en séparant les clients des artistes. Avec les résultats obtenus, j’ai remarqué un certain nombre de choses.

Artistes

Les plateformes déjà existantes sont peu utilisées car…
  • il y a des frais sur les ventes ;
  • elles sont inconnues pour la personne interrogée ;
  • la personne a son confort sur les réseaux sociaux ;
  • elles semblent plus orientées pour les designers ;
  • la personne ne recevait pas de commande sur ces plateformes ;
  • il n’y a pas de moyen pour se mettre en avant.
Les points positifs des plateformes existantes
  • possibilité de connaître tous les détails (le temps estimé, prix, options, …) avant de commander ;
  • possibilité sur Ko-Fi de recevoir des petites sommes en grande quantité.
Ce qui pourrait les pousser à changer de plateforme
  • plus de visibilité / plus de clients ;
  • pouvoir prédéfinir des formulaires à faire remplir aux clients ;
  • pouvoir mettre en avant différents « articles »(différents types de commissions) ;
  • pas de pourcentage de frais sur les ventes ;
  • une simplicité d’utilisation ;
  • une sécurité quant à la fiabilité du client ;
  • une fiche de commission facilement modifiable ;
  • la mise en place de tags et catégories.

Clients

Comment les artistes à qui passer des commissions sont trouvés
  • bouche-à-oreille ;
  • stands en convention ;
  • réseaux sociaux (Twitter, Instagram, …) ;
  • cercles de fandom ;
  • amis ;
  • l’ATTA (Art Tournament) ;
  • des artistes déjà connus qui ouvrent leurs commissions ;
  • vidéos YouTube ;
  • serveur Discord d’art.
Ce qui pose problème dans le processus d’achat de commission
  • savoir le rythme auquel l’artiste progresse ;
  • savoir où en est l’artiste dans le processus ;
  • trouver un artiste qui corresponde aux besoins de la personne ;
  • manque de communication ;
  • pas à l’aise pour communiquer ;
  • savoir si la commission va aboutir.
Leur avis sur les plateformes de commissions
  • trop chères ;
  • pas de connaissance de ces plateformes ;
  • pas le besoin de les utiliser ;
  • si l’artiste à qui ils veulent acheter une commission utilise une autre plateforme, ils sont prêts à s’y pencher.

Sur Ko-Fi :

  • Plus de simplicité ;
  • Plus rapide ;
  • Plus de liberté pour l’artiste ;
  • Accessibilité en terme de prix ;
  • Certains artistes ne proposent que cette plateforme ;
  • L’interface sur téléphone n’est pas agréable ;
  • Très peu de clients y vont par eux-mêmes, ils y sont dirigés par l’artiste qui les intéresse.
Ce qui les convainc d’acheter une commission
  • une envie de coucher une idée sur papier ;
  • le style de dessin ;
  • le prix ;
  • la rapidité d’exécution ;
  • le fait d’aider une personne avec peu de moyens ;
  • l’envie de soutenir un ami.

Grâce à ces réponses, je confirmais mon hypothèse initiale : le processus des commissions pouvait être amélioré si l’on se penchait sur tous les problèmes récurrents que j’ai pu sortir de mes interviews. Le site web que je souhaitais développer avait donc une raison d’être.

Statistiques

Avec les informations que j’avais obtenues, je pouvais continuer sur ma lancée et rebondir en lançant un Google Forms avec des questions portant sur l’intérêt et le besoin des utilisateurs concernant mon projet.

Environ 75% des personnes interrogées étaient intéressées, et ce pourcentage montait à 85% dans le cas où aucun frais ne s’appliquait sur les achats et ventes. Il est ressorti que les artistes avaient beaucoup de problèmes à trouver des clients, alors qu’eux, à l’inverse, ont donné des réponses assez mitigées.

Statistique des artistes ayant des difficultés à trouver des clients.
Sondage sur la difficulté pour les artistes de trouver des clients.
Statistique des clients ayant des difficultés à trouver des artistes.
Sondage sur la difficulté pour les clients de trouver des artistes.

Découvertes

De manière assez surprenante, 55% des utilisateurs trouvaient ardue la communication entre artiste et client.

Concernant la customisation des fiches de vente de commissions, 80% la trouvent essentielle, cependant, mais 73% des artistes interrogés considèrent son entretien pénible.

Grâce à ces informations, j’ai pu cibler les objectifs principaux de mon service :

  • une absence de frais ;
  • une fonctionnalité permettant de faciliter la communication entre artiste et client ;
  • une fonctionnalité permettant d’entretenir et de customiser ses fiches de commissions en réduisant les efforts nécessaires pour.

J’ai donc su comment me diriger et comment m’y prendre par la suite.

MVP

Mon MVP (Minimum Viable Product) avait pour objectif de démontrer qu’il existait une demande pour le service que je proposais, c’est-à-dire un moyen pour les artistes et les clients de se trouver et d’échanger de manière plus simple. J’ai eu pour idée de mettre en place un serveur Discord, et ainsi, de mesurer le nombre de personnes intéressées et le nombre de ventes effectuées. Mon hypothèse était la suivante :

« Les petits artistes digitaux sont en recherche d’une solution simple pour gagner en temps et en visibilité sur leurs commissions, et les amateurs d’art digital seraient intéressés par une solution simple pour acheter des représentations de leurs personnages. »

J’ai pu estimer qu’elle serait confirmée si j’avais au minimum 10 artistes, 10 clients et 3 commissions achetées. Mes attentes ont été complètement dépassées — je me suis retrouvée avec 17 artistes et 31 invités !

Nombre d'invités et d'artistes pour mon MVP.
Total d’artistes et d’invités.

Comment ai-je mis cela en place ?

Ce fut très simple. J’ai contacté des artistes dans mon entourage, et presque l’intégralité d’entre eux a montré un intérêt pour mon projet. Je ne m’étais pas limitée à eux, cependant, et ai également contacté des personnes qui m’avaient laissé leurs informations de contact sur mon Google Forms. Pour chaque artiste, j’ai demandé un nom, un pseudo et un dessin de leur choix afin de réaliser une étiquette personnalisée pour chacun d’entre eux. J’ai ensuite créé des channels individuels où chacun pouvait déposer sa fiche de commission et disposer d’un chat public qui leur appartenait.

Fiches personnalisées pour les artistes participant.
Cartes pour identifier les artistes.
Aperçu du serveur Discord ayant servi de MVP.
Aperçu du serveur Discord.

Au final, 5 commandes ont été passées via ce serveur, j’ai donc atteint le nombre requis afin de valider mon hypothèse. Les retours que j’ai obtenus étaient les suivants :

01.

Le serveur était très clair et fonctionnel.

02.

Organiser des activités aurait été un plus.

03.

Un channel avec les commissions finies pour montrer les travaux réalisés a été demandé.

04.

Les participants auraient aimé davantage d’artistes et davantage de clients.

05.

Un élément un peu plus marketing, comme une vidéo pour attirer du monde, a été réclamé.

Mise en place de l’UX

Mon MVP, malgré quelques faiblesses, avait été un succès. C’est donc sans plus tarder que je me suis penchée sur le réel produit que je souhaitais réaliser — un prototype fonctionnel sur Figma. Je suis retournée vers les notes que j’avais prises au cours de mes interviews, j’y ai ajouté les suggestions des artistes et des clients qui ont participé à mon MVP, et j’ai finalement pu commencer à mettre en place mes prototypes.

Sincèrement, j’étais fière de ce que je commençais à mettre en place. Tout s’emboîtait petit à petit, et graduellement, quelque chose de concret montrait le bout de son nez.

À cet instant, j’étais satisfaite ! Afin de combler les défauts les plus évidents, j’avais entamé des User Journey de mes fonctionnalités. Or, j’avais oublié un détail important, qui allait mettre en péril tout mon travail.

Choix de police.

*défiler horizontalement

Vendredi 13

Nous étions un vendredi 13, ou plus précisément, le vendredi 13 mai. Alors que je commençais à voir la lumière au bout du tunnel, une secousse est passée et a ébranlé toutes mes convictions. La veille, une toute nouvelle plateforme nommée Haru avait annoncé son arrivée. Quelle fut mon horreur en voyant que celle-ci défendait les mêmes valeurs que la mienne et avait un concept extrêmement similaire !

Aperçu de la landing page de Haru.
Landing page de Haru.
Aperçu des arguments de Haru.
Argument de Haru.

Il m’a fallu passer par toutes les étapes du deuil — j’étais dans un premier temps dans le déni, puis en colère que ce soit arrivé à ce moment précis, et ensuite dépitée à l’idée de continuer. J’ai bien cru abandonner. Cependant, j’ai tenu bon, et je me suis remise au travail après une crise de nerfs bien méritée. Je ne pouvais pas analyser le site en lui-même, car il était seulement annoncé pour le moment. Cependant, quelques aperçus d’écrans étaient disponibles avec des commentaires des développeurs, j’ai donc pu établir sur quels points je faisais une différence.

  • Ils n’ont pas de version mobile ;
  • Il y a des frais pour les clients ;
  • Les commissions ne sont pas la première chose visible, ce sont les œuvres ;
  • Il n’y a pas de tarif visible directement ;
  • Le site utilise le dollar, il causerait donc des frais de conversion vers l’euro sur Paypal pour les utilisateurs de l’Union Européenne.

Finalement, j’ai su tirer une force de ce problème. En effet, à son lancement, Haru a mis en place un serveur Discord ouvert aux suggestions des utilisateurs, et ce projet ayant généré beaucoup d’engouement, j’ai pu récolter des requêtes de fonctionnalités par les utilisateurs sans avoir à interroger qui que ce soit.

  • la possibilité de définir un nombre de slots ;
  • un système d’abonnement ;
  • une indication de la progression au client ;

User Journey

Premier User Journey.
Troisième User Journey. Troisième User Journey.

Test utilisateur

La route était longue et semée d’embûches, mais malgré tout, j’arrivais toujours à percevoir le sentier sur lequel je me trouvais. La suite du parcours me demandait d’avancer à mains jointes avec mes proches — je me suis donc reposée sur eux en leur faisant passer un test utilisateur de mon application afin de dénicher les derniers éléments problématiques de celle-ci et rendre l’expérience utilisateur la plus agréable possible et renforcer l’accessibilité du service que je proposais.

Globalement, les tests se sont tous relativement bien déroulés ! Les retours étaient très positifs, et les utilisateurs parvenaient toujours à compléter la tâche demandée sans trop d’efforts. Malgré tout, quelques points à changer ou à ajouter sont ressortis.

À changer
  • mettre les avis directement sous l’article de commission ;
  • définir la taille maximum des fichiers importés ;
  • ajouter des exemples pour les tags ;
  • ajouter un lien Carrd ou Linktree sur le profil ;
  • rendre les étapes de validation plus claires et ajouter un texte d’explication ;
  • ajouter un texte d’explication sur les champs à demander au client de remplir ;
  • ajouter un texte d’explication sur les exemples ;
  • mettre le pseudo de l’artiste en avant sur les « articles » de commission ;
  • ajouter du contenu dans l’onglet notifications.
Premier test utilisateur.
Test utilisateur avec une amie.
Premier test utilisateur.
Test utilisateur avec une autre amie.

Finalisation de l’UI

Choix d’une palette

Grâce à mes tests utilisateurs, tout ce qu’il me restait à faire était de mettre en place une charte graphique et de l’appliquer à l’ensemble de mon application, en faisant attention à respecter l’accessibilité que j’avais mise en place et en ajoutant des éléments qui rendent son utilisation esthétiquement plaisante.

Je suis partie sur une palette de variations de mauve vibrant, car cette couleur était celle qui collait le mieux à mon sujet. En effet, elle représente le luxe et la créativité — les commissions étant la mise en vente d’art, j’ai pensé qu’il s’agissait là du choix le plus adapté.

Essais de palettes.
Essais de palettes.

Choix d’une typo

Concernant la typographie, j’ai réalisé de nombreux essais avec différentes polices, graisses et interlignes afin de cibler au mieux mes couleurs de paragraphes. Finalement, après beaucoup de réflexion, je suis restée sur la Poppins Bold avec 1.3 d’interligne, accompagnée par la Open Sans Regular en 1.6 d’interligne, le tout sur une échelle de 1.250 en Major Third.

Choix de police.

*défiler horizontalement

Illustration

Une pensée m’est alors parvenue. Et si je réalisais une illustration pour ma page d’accueil ? Ce faisant, je plongerais immédiatement mes utilisateurs dans une ambiance créative et artistique. J’ai alors pris une soirée pour réaliser une image représentant un artiste s’attelant à un dessin sur sa tablette graphique.

En suivant ma charte graphique et en intégrant mon illustration, je suis donc parvenue à terminer la réalisation de mon prototype, que j’ai fait tester une dernière fois à des amis afin de régler les derniers bugs dans les liens établis entre mes pages.

Il était temps pour moi de reprendre mon périple.

Croquis de l’illustration de la landing page.
Croquis de l’illustration.
Illustration de la landing page.
Premier jet de l’illustration finale.

Landing page

En réalité, j’ai travaillé simultanément sur ma landing page et sur mon prototype, cependant, j’ai rapidement heurté un mur en réalisant que je manquais de contenu. J’ai donc dû terminer mon prototype avant de pouvoir vraiment m’attaquer à mon site de présentation.

J’étais initialement partie sur des présentations classiques d’application, en essayant d’appliquer un fil conducteur visuel qui guide le regard d’une section à l’autre, mais j’ai rapidement réalisé que cela rendait mon projet relativement impersonnel et générique.

Essais de landing page.
Premiers jets de landing page.

Suite à cela, j’ai cherché à m’orienter vers une direction artistique plus proche du sujet de mon application, à savoir, le dessin digital. Je me suis donc servie de l’illustration que j’avais réalisée, et ai ajouté des sections dont les bords étaient définis par des motifs similaires à des coups de pinceaux.

En mettant mon contenu en place, j’ai réalisé qu’il serait plus intéressant que le personnage que j’avais dessiné guide le regard de l’utilisateur vers le texte qui se trouvait à gauche, j’ai donc inversé son sens afin de pouvoir respecter cette idée.

Animation

J’avais envie d’animer ma page de manière un peu particulière, j’ai alors pensé à ajouter un scroll horizontal afin d’animer mes trois points principaux. Je me suis donc lancée dans des essais en Javascript, en essayant de comprendre comment faire rentrer un scroll horizontal dans le déroulé vertical de la page. J’ai regardé quelques articles de Codepen, mais les codes utilisés dépassaient ma compréhension et semblaient un peu trop tordus à mon goût, alors je me suis creusé la tête et ai finalement trouvé une solution en réfléchissant avec Greensock.

Il me suffisait de mettre tout le contenu ciblé dans une flexbox, de la répartir horizontalement, et d’empêcher le contenu qui dépassait de causer un scroll horizontal. Ensuite, à l’aide du ScrollTrigger, j’ai défini une translation du contenu sur l’axe X fixée sur le scroll qui se répétait en sens inverse lorsque l’on retournait vers le haut de la page.

Voir le Codepen

Tout était donc prêt pour que je commence véritablement à coder le contenu que vous lisez actuellement.

Arrivée à destination

Après un périple riche en rebondissements et en caféine, je suis finalement parvenue à atteindre mon objectif, à savoir, un projet de fin d’année qui me convenait et dont j’étais fière.

Améliorations

Bien que je sois fière de la production de mon application, je reste consciente qu’elle peut être améliorée dans le futur. Il serait intéressant d’ajouter une sauvegarde des tags pour chaque commission ou œuvre ajoutée, par exemple, afin de gagner du temps en posant la suivante. Comme il s’agit d’une application disponible pour toute l’Europe, une proposition de traduction automatique des conversations serait un grand plus afin de rendre le produit accessible à toutes les personnes moins à l’aise avec l’anglais. Pour aller plus loin encore, la possibilité que le nom de l’acheteur reste anonyme lorsque la commission finale est postée favoriserait l’engagement des artistes et des clients à la recherche de dessin érotique.

Il serait également intéressant de pouvoir épingler des messages ou en rechercher dans la boîte de messagerie. Afin de permettre aux clients de soutenir les artistes si l’envie leur en prend, l’occasion de donner un pourboire lorsque l’illustration finale est envoyée serait intéressante. En guise de bonus, un système de badges attribués en fonction de la satisfaction des utilisateurs et du nombre de commissions achetées ou vendues pourrait encourager l’utilisation de la plateforme.

Finalement, afin de protéger les œuvres des artistes et d’empêcher d’annuler la commande à la dernière minute ou de paralyser l’argent, les étapes intermédiaires seraient protégées par un filigrane, et de qualité réduite. Il ne serait possible pour le client d’obtenir le fichier de bonne qualité qu’une fois la production achevée et validée par ce dernier.

Point final.

Grâce à mes efforts acharnés, j’ai atteint mon objectif premier, à savoir, produire une application fonctionnelle qui remplisse le rôle que souhaitaient mes utilisateurs. J’en ai tiré un grand nombre d’enseignements. D’abord, une bonne préparation rend le parcours plus agréable — grâce à mes premières interviews, j’ai pu paver un chemin plus sûr devant moi qui correspondait réellement à ce dont mon public cible avait besoin. Ensuite, ma constante remise en question, que ce soit grâce à mes observations, aux conseils de mes professeurs ou à mes tests utilisateurs, m’a été très bénéfique afin de rendre mon travail encore meilleur. Finalement, et c’est une leçon importante, des pauses espacées de manière régulière me permettent d’être bien plus productive qu’un travail ininterrompu. Je pense donc que CommiMe était une aventure qui m’a énormément apporté dans la découverte du monde du Web.

Découvrez le prototype :

Regardez la vidéo sur le processus :