Assemblée Osuny #7 Réunion mensuelle ouverte

Nous organisons une réunion mensuelle ouverte, le premier jeudi de chaque mois, dans le but de rassembler toute la communauté Osuny. Cet événement est un moment d'échange et de discussions, pendant lequel l'équipe noesya présente les avancées fonctionnelles. Cet événement est ouvert, vous êtes libre de venir quand vous le souhaitez, il n'y a aucune obligation d'être présent·e chaque mois, c'est à votre convenance. Nous souhaitons co-construire l'ordre du jour de cette réunion mensuelle avec vous, donc nous sommes à l'écoute de vos remarques et/ou questions.

Ordre du jour : 

  • Présentation du travail sur le thème
  • Présentation des dernières modifications et améliorations

Accéder à la vidéoconférence Jitsi

Magali Anglès

Consultante / Formatrice Numérique

Samuel Attia

Consultant et associé, Agence O tempora // Responsable master Communication Publique et Politique, Sciences Po Bordeaux

Alexis Benoit

Nouvelle-Aquitaine

Pierre-André Boissinot

Île-de-France

Anthony Ferretti

Designer d'interface

Sébastien Gaya

Île-de-France

Marion Jolas

Yuna Orsini

Nouvelle-Aquitaine

Daniela Peñaranda

Nouvelle-Aquitaine

Clara Rigaud

Développeuse-Chercheuse chez noesya

Olivia Simonet

Thème Figma et processus de design

Présentation d'Anthony Ferretti, designer indépendant, fondateur de Praticable (anciennement collectif Bam) prônant l'écoconception et l'accessibilité

Anthony présente le projet du laboratoire de l'école de design CY. Le site présente les différents programmes de recherche par le laboratoire. Nous avons une présentation des projets, qui utilise le module portfolio d'Osuny. Présentation du lab, de l'équipe, des partenaires, des outils proposés par le lab et des programmes de recherche. Anthony souligne le plaisir d'utiliser Osuny, qui répondait parfaitement aux besoins du laboratoire, notamment grâce au système de publications. Ce projet lui a offert l'opportunité de contribuer sur Figma et de comprendre la méthode de travail côté design. 

Arnaud souligne l'importance de l'intégration d'Osuny dans le processus de design, ce qui a également des implications pour la relation client. Anthony a apporté des éléments intéressants. Il ne s'agit pas seulement d'une méthode unique, mais de différentes méthodes en fonction des clients et des pratiques des designers.

Au début, Anthony ne savait pas comment travailler avec Osuny. Le client demandait une charte graphique, une identité, etc. Il a établi un devis sans trop savoir quand Osuny reviendrait. Il y a eu des discussions pour améliorer certains éléments dans le Figma, une vraie réflexion de l'amélioration du Figma d'Osuny.Dans le thème Osuny, il y a de nombreuses variables, ce qui est le premier sujet à aborder. Ces variables concernent les couleurs, contrastes, tailles, etc. et constituent les fondamentaux graphiques d'Osuny. Il existe une collection sur les formats, desktop, mobile : typographie, taille, grilles. Ces variables sont utilisées dans les styles, les grilles et surtout dans les composants, comme les boutons. Chaque composant utilise les variables et a ses propres options. Si on duplique les fichiers et modifie les variables, on peut facilement les adapter.Certains blocs ont été retravaillés. Dans un bloc, on utilise des composants, et le style s'applique à tous les fichiers. Les blocs ont des options, par exemple, avec ou sans image.Il y a une logique atomique de travail sur les blocs.
Anthony précise qu'il a présenté le thème au début avec toutes ses options, ils ont ensuite élaboré le plan du site. Il a créé des maquettes haute fidélité avec les composants actuels d'Osuny, au lieu de les réaliser sur Figma ou Figjam. "Il est plus agréable pour le client de voir les éléments dans Figma plutôt que dans l'interface d'administration. Ici, nous pouvons discuter, commenter et même modifier un bloc, travailler avec les composants." Il précise qu'il est intéressant de travailler sur ce fichier, c'est très rapide, contrairement à l'interface d'administration où le temps de mise à jour est plus long. "Pour faire une nouvelle page dans le Figma, là dans assets, j'ai les blocs et les composants, et je peux construire ma page très facilement et rapidement. Cela respecte la grille en autolayout. La différence, c'est que là, le thème Figma, on l'utilise plus comme des designers et on peut rapidement maquetter." 
Anthony souligne qu'on peut aussi prototyper rapidement les wireframes. "La maquette va très vite et nous avons un prototype haute fidélité qu'on donne au client. Les avantages : ça va vite, c'est quali, on retrouve toutes les étapes avec des échanges et nous obtenons un proto haute fidélité. "Pour Alex, utiliser le Figma par défaut, comme outil de travail, comme hiérarchisation, de pouvoir commenter et ensuite avoir une maquette terminée, on oublie la phase de wireframes.Anthony rajoute : "C'est puissant de faire les wireframes avec les composants directement, c'est assez puissant les wireframes avec Osuny, cela permet d'être focus sur le contenu, et de custom le site plus dans la forme."

Nouveautés du thème

Olivia et Alex présente les nouveautés : https://github.com/osunyorg/theme/releases

Sur la v6.0.9 : 

  • Améliorer les choses dans le détail
  • Possibilité de lister les projets sur une page "Personne"
  • Nouvelles options sur les layouts d'actualités: options d'affichage des catégories, des personnes, des résumés...
  • Bloc contact : nouvelle apparence
  • Page campus/location: nouveau layout
  • Bloc de lien: nouveau bloc
  • Page projet: nouvelle apparence du hero

Exemple sur le site de la revue EnCommuns : https://www.encommuns.net/.
Nous avons un nouveau système de notes. Nous avons eu une réflexion autour des numéros, du rich text, nous avions, en exemple, des notes intéressantes dans le Monde ou encore la revue Esprit.  Sur cette revue, nous avions besoin de ce système de notes très académique.

Exemple sur le site de la Criée, centre d'art contemporain à Rennes, très engagé dans l'écoconception. https://www.la-criee.org/fr/
Questionnement autour des archives. Au final, nous avons des pages très légères, avec plus d'archives que prévu au départ. Nous avons un module agenda, des actualités. Du côté des projets, les projets ont des backlinks qui vont permettre de renvoyer aux personnes concernées. Dans la page d'une artiste, nous avons des actualités, des œuvres et des projets. Le design a été réalisé par un collectif de designer Alias Sandi, puis transposé sur le web par Violenn Simon. Il y a beaucoup de personnalité dans ce site. C'est un travail de maintenir tout cela cohérent avec un énorme volume de contenu. Olivia et Alex ont beaucoup travaillé pour que cela reste complètement accessible. Arnaud précise que comprendre les problématiques web et les problématiques de charte graphique à traduire, cela n'a pas été tout simple, mais le résultat est chouette. Le temps de projet a été très long, il y a eu des problèmes de compréhension sur l'architecture du web, des compromis ont été faits, il y a eu beaucoup d'adaptations techniques. Pour Yuna, "c'est une jolie ref pour les designers dans le showcase, c'est très joli !"

Olivia présente ensuite la refonte du bloc contact
Le bloc contact. Elle précise qu'il est prévu de rajouter les réseaux sociaux. Arnaud souligne que c'est un bloc pas facile, c'est très lourd, très varié, il y a beaucoup de cas. Il est rangé, mais ce n'est pas encore fini.

Présentation des campus
Arnaud rappelle l'historique : "Nous sommes en train de faire le site de l'IUT de Bordeaux, un très grand IUT avec quatre sites physiques, quatre campus. Nous avons développé les pages campus, avec un bloc campus, qui vont lister les différents diplômes, rôles avec les contacts. Nous pouvons remonter des rôles. Il y a un plan, une carte en fin de page. Il s'agit de présenter campus par campus et nous avons la possibilité dans l'admin de lier les campus aux formations. C'est un bloc niche pour le moment."

Nouveau bloc : bloc de liens
Il s'agit d'une demande initiale de Justin Puyo. Nous avons deux affichages avec et sans images : l'idée est d'afficher une liste de liens externes et internes. Mais, il faut faire attention avec le bloc pages. En effet, les blocs pages fonctionnent par référence alors que les blocs liens sont en dur. Exemple avec le bloc organisations, les liens sont enregistrés ou en dur et le fonctionnement est plus dur à gérer. Cela peut être bizarre pour l'utilisateur. Peut-être faut-il ajouter le mode externe pour le bloc page ?

Layout des projets : bloc projets
Modification des layouts, c'est redevenu une petite liste légère. Nous avons le bouton "partager", nous avons affiné la sélection, nous pouvons choisir sur quel réseau nous souhaitons partager, choisir celui que nous souhaitons. En layout, nous avons la liste, la grille (par défaut), le format en alternance et la version en grand. Un travail est en cours sur l'index des projets. L'ambition derrière cela est de permettre à des créatifs de faire des sites portfolio de façon simple.

Travail sur l'optimisation

Il y avait un grand nombre de tâches en attente pendant trois à quatre jours, ce qui empêchait la mise à jour des sites. Nous avons travaillé intensivement pendant une semaine pour améliorer la situation, ce qui a permis de résoudre ce problème. Les tâches sont désormais traitées plus rapidement qu'avant.

Il y avait une quantité importante d'objets indirects sur le site de la Criée et le site Réseau Excellence, ce qui a entraîné beaucoup de temps de compilation. De plus, tout le monde effectuait des mises à jour simultanément, comme les archives de la Criée et le remplissage des données de l'entreprise du Réseau Excellence.

Concernant la présentation des tâches sur le tableau de bord "Good job", nous avons changé l'état des tâches et avons réfléchi aux tâches d'arrière-plan. Nous avons des files d'attente pour chaque catégorie.

Ces modifications ont eu des effets de bord positifs, notamment une réduction de l'utilisation de la RAM et de la taille du serveur. Notre système est maintenant très stable jusqu'au prochain changement d'échelle.

Nouveaux sites

Arnaud présente les nouveaux sites :