Montbéliard SVG

Réalisation de trois animations SVG en représentant 3 bâtiments importants de la ville de Montbéliard.

logo du pays de montbeliard

Le projet

Lors de ma première année en DUT MMi à Montbéliard, j'ai dû réaliser un travail d'infographie en représentant 3 bâtiments important de la ville de Montbéliard en SVG accompagné d’animations CSS.

J'ai choisi de réaliser cette exercice sous la forme d'un blueprint essentiellement pour garder la particularité architecturale des bâtiments de Montbéliard. Les bâtiments sont la paroisse Saint-Paul, l'UTBM et l'agglomération de Montbéliard.

batiment Paroisse Saint Paul
batiment UTBM

Ce que j'ai appris

Les bâtiments ont été réalisés sur Illustrator en reprenant des photos des bâtiments de Montbéliard en assez simplifié en reprenant le style des blueprints.

Pour animer les bâtiments j'ai utilisé la librairie SVG Vivus qui permet d'animer les lines, les paths et les polylines. Cette librairie utilise la fonction native en css, stroke dashoffset et dasharay. Vivus automatise l'animation en simplifiant et en raccourcissant énormement le code utilisé.

batiment agglomeration de montbeliard