-- Privacy-friendly analytics by Plausible -->

Identité · Direction artistique · Développement

Fullcode, conçu comme on travaille.

Nous voulions un site qui ne se contente pas de raconter ce que nous faisons. Il devait le démontrer : une direction forte, du code écrit sur mesure et des interactions qui font partie de l’idée.

Création forte Code sur mesure Système maintenable

Le point de départ

Comment faire un site de studio qui ne ressemble pas à un site de studio ?

Nous ne voulions ni d’un portfolio interchangeable, ni d’un empilement d’effets gratuits. Le site devait avoir une personnalité propre tout en restant clair, rapide à faire évoluer et suffisamment souple pour accueillir des projets très différents.

Le parti pris a donc été simple : ne jamais séparer artificiellement design et développement. Ici, le mouvement, la structure, les transitions et les composants sont dessinés autant par le code que par la maquette.

Identité Fullcode

Une identité capable de vivre dans l’interface.

Climate Crisis donne le ton aux grands messages. 42dot Sans prend le relais pour les contenus et l’interface. La palette crée le contraste entre énergie, chaleur et technicité.

Violet#522A6F
Prune#8A2476
Jaune#FBCF4F
Beige#FAEADD
Charbon#222023
Climate Crisis 100% VOUS.
42dot Sans

Une typographie pensée pour les contenus, les interfaces et tout ce qui doit rester net quand le reste prend de la place.

Notre terrain de jeu

Créatif quand il faut imaginer.
Technique quand il faut résoudre.

Déplacez le curseur. Ce n’est pas un choix entre deux métiers : c’est précisément leur rencontre qui construit Fullcode.

Fullcode vit ici.

50 % créatif · 50 % technique

Le développement fait partie du design

Le code n’arrive pas après la création.

Certaines idées n’existent que parce qu’elles ont été pensées en même temps que leur implémentation. Le serpent du hero, les transitions, le catalogue feuilletable ou les scènes animées ne sont pas des couches ajoutées après coup.

01

Hero snake

Un SVG animé qui transforme la première impression en geste de marque.

/animations/hero-snake.js
02

Plongée

Une séquence narrative qui fait du scroll un élément du récit.

/animations/dive-sequence.js
03

Catalogue Dieco

Navigation clavier, swipe et pages animées dans un composant réutilisable.

/components/catalogue.js
04

Scènes projet

SVG injectés, animations au scroll et comportements isolés par page.

/animations/…

Sous le capot

Vivant ne veut pas dire impossible à maintenir.

Les composants globaux, les animations et les points d’entrée de page sont séparés. Chaque projet peut avoir son propre comportement sans transformer le site entier en bloc monolithique.

/assets/js/
assets/js/
├── core/
│   └── site-core.js
│
├── components/
│   ├── interface.js
│   ├── catalogue.js
│   └── contact-form.js
│
├── animations/
│   ├── hero-snake.js
│   ├── dive-sequence.js
│   ├── sensipark-scroll-snake.js
│   └── tennis-parallax.js
│
└── pages/
    ├── contact.js
    ├── dieco.js
    ├── padel-barrio.js
    └── fullcode.js

Le site comme système

Ce qu’on voit compte. Ce qui relie tout le reste aussi.

01

Composants partagés

Header, navigation, catalogue, formulaires et comportements communs vivent dans des modules réutilisables.

02

Pages autonomes

Chaque page importe uniquement ce dont elle a besoin, ce qui limite les dépendances et garde l’évolution du site maîtrisable.

03

Parcours cohérent

Les CTA transmettent le contexte jusqu’au formulaire pour éviter de demander à l’utilisateur de recommencer son histoire.

04

SEO & structure

URLs propres, canonical, données structurées, sitemap, contenus hiérarchisés et balisage sémantique font partie du projet.

05

Accessibilité

Navigation clavier, états de focus, textes alternatifs et gestion du mouvement sont intégrés au système plutôt qu’ajoutés à la fin.

06

Pas de standard forcé

La structure sert les idées. Elle n’est jamais une excuse pour faire entrer tous les projets dans le même moule.

Au fond

Le standard existe déjà. Notre métier commence là où il ne suffit plus.

Ce site est notre propre terrain d’essai : un endroit pour tester une idée, écrire le code qui lui manque et garder suffisamment de structure pour pouvoir recommencer autrement au projet suivant.

Votre projet ne ressemble pas aux autres ? Tant mieux.

Identité, expérience web, interface, outil ou projet hybride : construisons quelque chose qui mérite une réponse sur mesure.

Construire quelque chose de singulier