Crafting responsive web design with UI and UX in mind. Here are my crafts. Originally sound engineer, i was reconverted to web design and front-end development, getting inspiration from sound, music, cinema and photography. Here is my resume.

fr

Je conçois des interfaces web responsive avec une approche UI et UX. Voici mes réalisations. Anciennement ingénieur du son, je me suis reconverti dans le web design et le développement front-end, m'inspirant du son, de la musique, du cinéma et de la photographie. Voici mon parcours.

^{CSS | Javascript}

IT Automotive Design System est un ensemble de composants CSS et Javascript permettant de créer rapidement des interfaces web responsives.

• CSS
  • c-dis.scss
    Composant CSS dédié aux dimensions et comportements liés à la taille des éléments.
  • c-dim.scss
    Composant CSS dédié à la propriété display des éléments.
  • c-pos.scss
    Composant CSS dédié aux positionnements des éléments.
  • c-txt.scss
    Composant CSS dédié aux textes.
  • c-skin.scss
    Composant CSS dédié aux aspects et apparences des éléments.
• Javascript
  • c-toggle.js
    Librairie JS dédiée à la bascule d’état des classes CSS d’un élément.
  • c-tabs.js
    Librairie JS dédiée à la gestion d'onglets et tabulations.
  • c-scrollsyncbar.js
    Librairie JS permettant d'afficher/masquer des éléments HTML progressivement en fonction du sens de défilement de la fenêtre.
  • c-scrollspy.js
    Librairie JS dédiée à la détection de la position d'un élément DOM dans la fenêtre de visualisation.
  • c-preview.js
    Librairie JS dédiée à l'affichage et des fichiers sélectionnés sur un input type="file"

^{HTML | CSS | Javascript}

Popular Leaflet plugins and map providers bundled into a single customizable HTML file with its API. SEEMAP - for Standalone EmbEddable Map - is a single HTML file bundled of useful and popular Leaflet/OpenStreetMap resources in a easy way to embed.

Website | Github

^Javascript

Scroll Btween uses scroll position of document - or any DOM element - to tween CSS values on any DOM element.

Website | Github

^Javascript

Animate sequences of still frames on any DOM element in relation with its position into the viewport.

Website | Github

^{Jekyll Theme | Liquid | HTML | CSS | Javascript}

A Jekyll documentation theme with built-in search and playground.

Website | Github

^{HTML | CSS | Javascript}

Web cinematics inspired from La Casa de Papel serie (Money Heist) start credits. Showcase for Scroll Btween and Scroll Frames.

Launch | Github

Bonus Tokyo and Rio

^{HTML | CSS | Javascript}

Web cinematics inspired from D A R K serie opening credits. Showcase for Scroll Btween and Scroll Frames.

Launch | Github

^{PHP | HTML | CSS | Javascript}

Unreleased GoPro initiative, a responsive interface of the project Paris 26 Gigapixels

Launch | Github

^{HTML | CSS | Javascript}

GoPro VR HTML5 prototypes pages for production (discontinued).

Launch | Github

List of pages:

• Create
• Browse
• Category
• Log in
• Create account
• FAQ
• Upload step 1
• Upload step 2
• Upload success
• Deprecated style guide
• 404
• Error

^{PHP | HTML | CSS | Javascript}

Creation and design with HTML, CSS, Javascript + GRAV CMS template creation. ForgeJS is a powerful open-source framework that brings immersive media-driven experiences to life.

Launch

^{HTML | CSS | Javascript}

Kolor | GoPro Panotour Pro 2.0 template.

Launch | Github

^{HTML | CSS | Javascript}

Kolor | GoPro Panotour Pro 2.0 template.

Launch | Github

^{HTML | CSS | Javascript}

HTML5 media written on DVD - only for desktop - as extra content for Mathieu Le Lay's movie https://mathieulelay.com/fr/film/des-gypaetes-et-des-hommes

Launch | Github

^Photoshop

Hi-fi mockups of the unreleased Kolor|GoPro Panotour 3 virtual tour creation software.

View all

^Photoshop

Portfolio of various graphic design crafted in relation with the web and the print.

View all

Logo design example 1	Logo design example 2

Movie booklets design 1	Movie booklets design 2

^{Personal photography artworks}

Personal photo works on Animals, Landscapes and Photoshop.

Animaux	Paysages	Photoshop

Hybrid UI/UX | Front-end developer
_{@ at your company? contact me}

Front-end developer at BYmyCAR
Crafting responsive web design with UI and UX in mind.
_{@ https://bymycar.fr}

fr

Je crée des interfaces web responsive avec une approche UI et UX.

UX Designer at GoPro
Discover the world's most versatile action cameras + accessories.
_{@ https://gopro.com}

fr

Découvrez les caméras d’action et accessoires les plus polyvalents au monde.

Web designer | Content editor at Kolor
Kolor develops image-stitching software, virtual tour software and 360-degree video software, and offers a selection of the best equipment for panoramic photography and video on its online store.
_{@ https://kolor.com}

fr

Kolor développe des logiciels d'assemblage d'images, de visites virtuelles et de vidéos à 360 degrés, et propose une sélection des meilleurs équipements pour la photographie et la vidéo panoramiques sur sa boutique en ligne.

Web designer at Optique Sergent
Le bonheur de bien voir
_{@ https://optique-sergent.com}

Sound engineer at Dolby Cinema Belgium
Adjusting, balancing and equalizing sound in theatres in accordance with SMPTE standards.
_{@ https://professional.dolby.com/cinema/}

fr

Réglages, équilibres et égalisations le son dans les salles de cinémas conformément aux normes SMPTE.

Diplôme IAD at Institut des Arts de Diffusion
Let's start a sound engineer career until i discover the web!
_{@ https://www.iad-arts.be/formations/son}

fr

Début d'une carrière d'ingénieur du son jusqu'à ce que je découvre le web !