D’un brief graphique à un objet digital
Savoir(s) | Le quotidien, nouveau média de l’université, que vous lisez en ce moment même, est accessible depuis le 8 mars. Qui dit nouveau média dit bien sûr, quel contenu pour quel public , mais aussi quelle ambiance graphique avec quel contenant ? C’est sur ce volet qu’ont travaillé Sarah Savoyen-Glass, designer graphique multimédia, Edern Appéré et Bruno Bernard, webmestres au sein du Service de la communication : un trio où l’addition des compétences a été primordiale.
Comment, à partir d’une intention graphique, souvent très sommaire, et d’un cahier des charges qui définit des fonctionnalités précises, aboutir à un média en ligne ? Pour le non averti, c’est mission impossible, pour le designer graphique et les webmestres, c’est une mission à relever qui n’a pas été semée d’embuches, mais plutôt de défis.
Tout juste arrivée à l’université, en mars 2021, j’ai été très vite associée à ce projet. Concevoir le design de ce nouveau média sur la base du langage visuel a été passionnant
(lire encadré) introduit d’emblée Sarah Savoyen-Glass. Partir d’un écosystème existant et imaginer une nouvelle manière de diffuser l’information, au travers d’un média unique, est un projet stimulant et de longue haleine. Comparé à d’autres réalisations, comme le site recherche, par exemple, nous sommes allés plus loin dans l’utilisation du langage visuel
, ajoutent Edern Appéré et Bruno Bernard.
Soigner la lisibilité
C’est sur la base d’une maquette que le travail de conception web peut commencer. La maquette proposée par Sarah est d’un format atypique. Ce n’est pas une maquette symétrique. L’adapter à un format web n’a pas été simple, notamment pour la version mobile
, explique Bruno Bernard. Si le designer graphique a sa propre boîte à outils, celle des concepteurs web n’est pas forcément la même. Chaque système a son propre fonctionnement. Le défi a été de faire en sorte que les deux systèmes se parlent efficacement, pour aboutir à un résultat concluant
, précise Edern Appéré.
Au final, c’est un nouveau site moderne, épuré, sobre, avec des espaces libres et des respirations qui facilitent la lecture. Il est très important de soigner la lisibilité d’un site. Il faut tenir compte de la spécificité du média et anticiper les besoins des lecteurs, afin d’orienter les choix graphiques, typographiques et ergonomiques, afin d’avoir un maximum de confort de lecture, en trouvant le juste équilibre entre l’alternance des contenus – textes, citations, images, encarts… J’avais bien conscience que tout ce qui avait été prévu sur la maquette ne serait pas forcément réalisable sur le net, mais au final les ajustements apportés à l’objet digital par rapport à la maquette initiale sont faibles
, explique Sarah Savoyen-Glass.
Mettre en avant les contenus
La société Améos nous a apporté son aide pour le développement de certaines fonctionnalités. Il y a bien sûr des éléments que nous aurions aimé développer plus en détails mais c’est une réalité : d’une maquette graphique à un site web fonctionnel, des ajustements sont parfois nécessaires. Dans tous les cas, l’esprit voulu est là et le résultat est un site qui a les moyens de durer dans le temps
, ajoute Edern Appéré.
Au travers de cette réalisation, le trio est en accord avec un objectif de départ : proposer une manière efficace de mettre en avant les contenus, pour mieux plonger dans ce qu’ils expriment.
Savoir(s) | Le quotidien aux couleurs du langage visuel et plus encore…
Bon à savoir
Une des missions de ce nouvel objet digital a été de donner un nouveau souffle au langage visuel
, explique Sarah Savoyen-Glass. Nous avons la chance d'avoir une identité forte, évolutive, qui laisse une grande diversité créative. En 2016, ce projet de recherche-action a été longtemps réfléchi et a laissé place à un système graphique unique, universel et intemporel. Le design n'a pas pris une ride, il évolue avec son temps et offre de multiples possibilités.
Le point départ de ce site, ce sont les fameux encadrés du langage visuel. Le design a été pensé comme un prolongement de ces encadrés, qui ont donné naissance à une grille modulaire et évolutive. C'est assez géométrique, on retrouve des lignes verticales et horizontales, ainsi que des contre-compositions. Ce principe de design m'inspire et me rappelle les œuvres de Mondrian et des membres du groupe de Stijl. Il y a volontairement un esprit Bauhaus dans le design du site : se concentrer sur le principal avec des formes simples, fonctionnelles et efficaces, avec des constructions modulaires, sans ornementations ou fioritures.
Les choix typographiques – Brill et Unistra – sont bien évidemment en harmonie avec le langage visuel de l’université. Ces deux polices de caractères varient selon le contenu : les contenus du savoir sont en Brill et les contenus de la vie universitaire sont en Unistra.
Ces deux polices de caractères représentent la complémentarité entre les savoirs et la vie universitaire qui forment ensemble l'université. C'est cette complémentarité qui est au cœur du système visuel.
Catégories
Catégories associées à l'article :Mots-clés
Mots-clés associés à l'article :