Je m’appelle Mathias Moureaux, je suis formateur en web design pour plusieurs écoles des métiers du numériques, et je viens tout juste de m’inscrire sur FramaColibri.
A travers mes cours, j’essaie dés que possible de sensibiliser mes élèves à des alternatives au outils des GAFAM. Je travaille actuellement avec des étudiants sur un projet fictif de création d’un Design System pour Framasoft. Le travail attendu doit respecter et afficher les valeurs de l’association Framasoft, mais également moderniser et valoriser l’image de l’association.
En qualité de formateur, j’aimerais vous soumettre le travail de mes étudiants afin d’avoir un retour de votre communauté sur leur propositions.
Seriez vous d’accord pour que je vous transmette leur étude de cas ?
Merci pour la proposition ! Il n’y a pas de souci pour prendre Framasoft comme cas d’études, et on est clairement très intéressé·es par la production de vos étudiants.
Si ce n’est pas déjà identifié dans le cadre de leur travail, notez que le plus compliqué dans le cadre de l’uniformisation de l’apparence des sites et services que nous proposons est que les services sont tous basés sur des logiciels différents que nous ne développons pas.
Également si jamais, notre page de référence sur notre charte graphique peut être intéressante :
(cc @MCGodwin qui sera peut-être aussi intéressée par le retour, et avec qui nous faisons certains travaux avec d’autres étudiants sur Framaspace)
Merci beaucoup pour votre réponse et pour mes étudiants
J’ai encore un cours avec eux le 20 janvier pour finaliser leur projet, je vous propose de vous envoyer leurs propositions (via un lien vers Figma) à cette date.
En attendant voici le résumé des instructions qu’ils ont reçu pour effectuer le travail.
La plateforme de logiciel libre Framasoft souhaite concevoir un design system utilisable pour l’ensemble de ses services, et fait appel à vous pour débuter une réflexion sur ce projet. Dans un premier temps, votre mission consiste à explorer des pistes graphiques pour l’élaboration ultérieure d’un kit de composants UI et d’une bibliothèque de style. Vos propositions devront respecter et afficher les valeurs portées par l’association Framasoft, mais également moderniser et valoriser l’image de l’association. Vous accompagnerez vos pistes graphiques (exemples de pictogramme, de composants, choix de typographies et de couleurs…) d’une documentation détaillant votre réflexion.
Génial, merci Mathias, ça fait vraiment plaisir de voir davantage d’intervenant·es s’emparer du libre. Je ne sais pas si ton travail a un rapport avec Conviviel ?
Hâte de voir les contributions de tes étudiant·es, les miens travaillent en ce moment même sur Framaspace en 2e année, et vont s’essayer à Framadate pour les 1e année.
Merci de ton retour. Je ne connaissais pas Conviviel, mais c’est une superbe découverte que je vais partager à mes élèves dés le prochain cours :).
De manière générale j’essaie de solliciter leur esprit « technocritique » dans le cadre de leurs travaux pratiques. Je serai très intéressé par tes retours sur leur travail de Design System si tu as un peu de temps pour y jeter un coup d’oeil
Comme convenu voici les liens vers les maquettes Figma de mes 3 groupes d’étudiants. Chaque maquette comprend une page Design System et au moins une page d’exemple sur une interface d’outil et sur la page d’accueil de Framasoft*.
Évidemment, mes propres compétences pour juger l’analyse faite et les travaux produits sont assez faibles, mais je vais toutefois essayer de m’y employer (d’autres à Framasoft ou sur ce forum le feront peut-être, n’hésitez pas).
Et évidemment, cela est mon avis personnel, pas une position ou un jugement de Framasoft sur la question.
Le travail du premier groupe est intéressant, mais je trouve qu’il y manque une certaine logique dans le choix des couleurs pour les boutons (un bouton principal peut être avec le fond bleu ou fond vert) ou les icônes (qu’est-ce qui détermine le fait qu’une icône soit colorée d’une couleur ou l’autre). Le logo se rapproche plus du corbeau que du « pinchot » historique de Framasoft, mais je trouve que cela répond quand même à la question de la modernisation de l’identité. L’intégration proposée dans le service d’exemple de Framindmap est en revanche très réussie.
Le deuxième groupe a produit un travail très poussé, et la proposition, si elle n’est peut-être pas la plus révolutionnaire, est ma préférée visuellement (mais probablement biaisé car elle reprend un peu nos couleurs usuelles). De plus, le rendu fait sur la page d’accueil donne des idées assez intéressantes pour nous. C’est donc vers ce travail qu’on irait probablement si on devait choisir, en mode « évolution tranquille mais solide ».
Enfin, le troisième groupe est celui dont le design system est le plus complet et intéressant malgré les propositions très originales qu’on aurait du mal à retenir. Il me semble que le positionnement est bien compris. Toutefois, c’est assez dommage que les problèmes d’accessibilité assez évidents autour des contrastes de certains boutons n’aient pas été identifiés (peut-être par manque de temps ? vu que c’est correct sur la page recherche).
Dans tous les cas, c’est toujours très impressionnant de voir l’étendue des recherches et des productions en un si petit labs de temps, et je vous remercie vivement du travail accompli et de nous les avoir partagé.
On reste à votre disposition si jamais il y a d’autres travaux du genre.
C’est donc vers ce travail qu’on irait probablement si on devait choisir, en mode « évolution tranquille mais solide ».