Générateur de graphiques EPFL

L’EPFL voulait mettre à disposition des organisateurs d’évènements et conférences sur son campus un outil permettant de créer des affiches riches et vibrantes.

Banner image

UX and Design

:ratio

Development

Cruncher

Des centaines de conférences, séminaires, expositions et concerts ont lieu chaque année sur le vaste campus de l'EPFL, organisés par des étudiants, du personnel, des facultés, des start-ups, des partenaires de recherche, etc.

Jusqu'à présent, les organisateurs chargés de la promotion des événements ont été laissés à eux-mêmes pour générer des posters et moyens de promouvoir leurs évèments.

MediaCom, l'unité de communication EPFL, a chargé Cruncher et :ratio de créer un outil permettant à tous les organisateurs d'évènements de créer des affiches et images de partage sur les réseaux sociaux afin de promouvoir leurs évènements dans le respect de la charte graphique de l'EPFL.

Édition d'une affiche A3/A4

Lors de la conception de l'interface utilisateur, il est vite apparu que pour créer un outil familier (et donc facile à utiliser), nous avions besoin d'un environnement d'édition qui se comporte un peu comme une application de bureau, avec des objets qui peuvent être sélectionnés, puis modifiés par le biais de panneaux d'édition contextuels. Plutôt que d'avoir des objets mobiles, nous avons opté pour une collection de modèles de conception où les objets modifiables ont des positions définies, selon une série de "templates", un sélecteur de couleurs où les couleurs sont tirées des couleurs de la marque, et un sélecteur de polices. Tout cela contribue à ce que les visuels résultants restent fidèles à la charte EPFL.

D'un point de vue technique, nous avons choisi SVG comme format "natif" de l'éditeur, alors que HTML aurait entraîné des différences de rendu du texte entre les navigateurs et que <canvas> aurait impliqué une dépendance de résolution et la mise en œuvre d'une couche de détection du pointeur de la souris vers l'objet. Cela pose un petit problème. Les images doivent être exportées au format PNG. Alors qu'avec <canvas>, cette opération peut être effectuée dans le navigateur, ce n'est pas le cas avec SVG.

Nous avons du coup développé un micro-service qui reçoit un SVG et retourne une série de fichiers PNG et JPEG et les upload sur un point de stockage S3 dans le cloud pour héberger les images générées.

Pour développer l'interface utilisateur, nous avons utilisé notre librairie de templating dynamique, Literal.

La première version livrée (notre 'MVP') exporte vers trois formats

Contact

Courriel hello@cruncher.ch Telephone +41 21 546 68 00

Plus de projets

Stojan
Générateur de graphiques EPFL
Générateur de graphiques EPFL
Galerie 1 2 3 Galerie 1 2 3
Galerie 1 2 3
Site internet de l'ECAL
Site internet de l'ECAL
Swiss Typefaces Swiss Typefaces
Swiss Typefaces
EPFL Newsletter EPFL Newsletter
EPFL Newsletter
Nendaz Nendaz
Nendaz
Touring Machine
Touring Machine