développement web

Refonte du site Ciné Dyke

Dans le cadre d’un projet académique, j’ai réalisé la refonte fictive du site internet du Ciné Dyke, un cinéma local situé au Puy-en-Velay. L’objectif principal était de concevoir un site responsive en utilisant la librairie Bootstrap tout en respectant des maquettes prédéfinies. Ce travail portait sur la création de trois pages : une page d’accueil, une page “Horaires des séances” et une page dédiée au détail d’un film.

J’ai utilisé des composants Bootstrap tels que le carrousel, les cards et les grilles pour structurer les pages et garantir une expérience utilisateur fluide, quelles que soient les dimensions de l’écran. La personnalisation des couleurs et des styles a été réalisée grâce à un CSS avancé, incluant des pseudo-éléments (::before, ::after), l’utilisation de la propriété currentColor, ainsi que l’intégration de clip-path pour des designs dynamiques.

Ce projet a représenté un défi technique et créatif, me permettant de perfectionner mes compétences en intégration front-end et en design responsive.

Graphismes

Proposition de première de couverture.

Dans le cadre de mes études en BUT Métiers du Multimédia et de l’Internet au Puy-en-Velay, j’ai réalisé la couverture du magazine étudiant Interface. Inspiré par l’univers aquatique et le symbole de la coquille Saint-Jacques du chemin de Compostelle, ce projet visait à refléter la culture locale tout en respectant les règles de design.

J’ai utilisé Photoshop pour créer un fond nuancé de bleu avec des lignes dorées, évoquant l’océan et la coquille Saint-Jacques. Le logo et le QR code, en forme de coquille, sont intégrés pour maintenir le thème. Les écritures blanches, d’une police élégante, ajoutent une touche de simplicité.

Mon principal défi était de construire une identité visuelle actuelle tout en préservant le caractère sacré de la thématique.

Logiciels utilisés : Adobe Photoshop et Illustrator.

Mise en page Mario Bros- Interface.

Après avoir choisi la couverture du magazine, il fallait bien le remplir. Ainsi, ma promotion de BUT MMI s’est découpée en plusieurs groupes pour finaliser ce projet. J’ai donc intégré l’équipe de graphistes et j’ai pu réaliser deux mises en page d’articles écrits au préalable.

La première mise en page concernait un article sur Mario Bros, que j’avais moi-même écrit. Il était donc logique que je m’occupe de cette mise en page. J’ai essayé de montrer visuellement l’idée principale de l’article, qui est l’évolution du personnage de Mario au fil des années. Ainsi, j’ai représenté le premier Mario pixellisé traversant l’article vers l’autre page et se transformant en celui que nous connaissons aujourd’hui.

La deuxième mise en page portait sur l’évolution des écrans télévisés au fil des années. La direction artistique change avec des couleurs bleuâtres et de nombreuses références à la technologie. Ce changement n’est pas anodin, c’était un choix de groupe. Ainsi, le magazine se découpe en deux parties : le thème de la Génération arborant des couleurs rouges et le thème des technologies avec des couleurs bleues.

Création de plusieurs propositions de logo pour ma chaine de Podcast (Hé, tu savais ?).

Avec de nouvelles compétences en graphisme acquises lors de ma première année de formation, j’ai décidé de refaire le logo de mon podcast.

Après de nombreuses tentatives, je suis arrivé au visuel que vous voyez à gauche. Le logo symbolise un micro pendant, avec à la place de celui-ci les initiales de mon podcast « HTS » = « Hé, tu savais ? ».

Ayant l’idée globale, j’ai créé plusieurs versions. Une où le micro crierait le mot podcast, peu convaincu par l’idée, je l’ai finalement laissée de côté. D’autres en changeant la couleur du fond et des éléments. Mais finalement, j’ai décidé de rester simple avec un fond blanc, des couleurs noires et simplement le mot « Podcast » à côté du micro.

Et pour ceux qui se demandent pourquoi « Hé, tu savais ? » comme nom, il provient du fait que je voulais parler de petites questions que l’on se pose tous au quotidien, mais de manière accessible et compréhensible par tous, comme si je racontais cette histoire à un ami.

Repenser mon identité visuelle : Maex

Avec l’envie d’avoir un visuel qui me ressemble vraiment, j’ai décidé de créer le logo de Maex à mon image. J’ai principalement utilisé Illustrator pour le réaliser, mais avant ça, j’ai passé énormément de temps à chercher des inspirations. Je pense avoir passé autant d’heures sur Cosmos et Pinterest que sur la création du logo lui-même. Je voulais un style qui me parle, qui soit fidèle à ma personnalité.

Le personnage final me correspond : un style dessiné presque brouillon, assumé, imparfait…comme un gribouillis réfléchi dans un carnet. C’est ce côté un peu brut, détendu et spontané qui me plaît. J’aime ne pas me prendre la tête, et ce logo en est le reflet : comme un dessin fait au coin d’une table, sans pression, mais avec sincérité.

J’y ai ajouté quelques détails pour personnaliser le tout : les taches de rousseur, le casque audio, et une expression calme.

Pour aller au bout de cette logique, j’ai même poussé l’identité jusqu’à la typographie. J’ai créé ma propre police à partir de mon écriture manuscrite, en scannant un alphabet grâce à un générateur en ligne. C’est comme ça qu’est née Maximus Fontulus, une typographie unique qui vient renforcer le ton personnel et imparfait de l’univers Maex.

Ce logo n’est pas figé : il évoluera sûrement, comme moi. Mais pour l’instant, il reflète exactement ce que j’ai envie d’exprimer.

vidéos

Animation Vidéo Mapping : The Day Of Spirits

Dans le cadre d’un projet scolaire, j’ai réalisé une animation de vidéo mapping sur la façade du Musée Crozatier, en utilisant Blender comme principal outil de création 3D. L’objectif était d’explorer différentes techniques d’animation et d’intégrer des formes simples en harmonie avec l’architecture du bâtiment. Inspiré par la culture japonaise, mon projet plonge dans un univers spirituel où les esprits apparaissent et disparaissent au fil du cycle jour-nuit, en référence au Shintoïsme et au festival Obon.

J’ai utilisé cinq techniques d’animation 3D, notamment le morphing et la déformation liquide, pour insuffler un aspect fluide et immersif aux transitions entre les éléments. After Effects a également été employé pour affiner certains effets et assurer la mise en place globale des éléments animés. L’ensemble vise à créer une expérience visuelle poétique et onirique, en jouant avec la structure du musée pour renforcer l’immersion.

En complément, j’ai conçu un goodies en lien avec l’animation : une création réalisée sous Illustrator, puis gravée et découpée au laser. Ce support physique permet de prolonger l’expérience du projet et d’enrichir son identité visuelle.

Logiciels utilisés : Blender, After Effects, Adobe Photoshop et Illustrator.