2025-12-29 11:27:47 +01:00
<!DOCTYPE html>
< html lang = "fr" >
< head >
< meta charset = "UTF-8" >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
< title > Studio Variable< / title >
2025-12-29 19:30:31 +01:00
< script src = "/assets/paged.polyfill.js" > < / script >
2025-12-29 11:27:47 +01:00
< link rel = "stylesheet" type = "text/css" href = "assets/style.css" >
< link rel = "stylesheet" type = "text/css" href = "assets/fonts/Area/stylesheet.css" >
< link rel = "stylesheet" type = "text/css" href = "assets/fonts/Geist-mono/stylesheet.css" >
< / head >
< body >
< aside class = "infos" >
2026-06-19 17:52:48 +02:00
< p > Portfolio< / p >
< p > 19 juin 2026< / p >
2025-12-29 19:30:31 +01:00
< p > contact@studio-variable.com< / p >
2025-12-29 11:27:47 +01:00
< / aside >
< header >
< h1 > Studio Variable< / h1 >
2026-01-26 17:34:34 +01:00
< h2 > Design × < / h2 >
2025-12-29 11:27:47 +01:00
< / header >
< footer >
2026-06-19 17:52:48 +02:00
< p > < p > Studio Variable – < / p > < / p >
2025-12-29 11:27:47 +01:00
< / footer >
< section id = "studio-variable" >
< p > Créé en juin 2025 et basé à Paris, Studio Variable conjugue
< strong > design graphique, design d’
full-stack< / strong > . Œuvrant principalement avec le secteur de la
recherche, de l’
avec de grands comptes qu’ < / p >
< p > Fondé par < strong > Julie Blanc< / strong > (designer-développeuse et
chercheuse en ergonomie) et < strong > Adrien Payet< / strong >
(designer-développeur issu de la philosophie), Studio Variable
développe une approche formelle et technique qui concilie
< strong > ergonomie, sobriété, accessibilité et respect de la vie
privée< / strong > .< / p >
2026-06-19 17:52:48 +02:00
< p > Nous sommes spécialisés dans la publication à source unique en
< strong > web-to-print< / strong > . Nous privilégions les projets ouverts
et engagés, avec une forte culture du ’
source.< / p >
2025-12-29 11:27:47 +01:00
< / section >
< section id = "equipe" >
< h2 id = "équipe" > Équipe< / h2 >
< div class = "people" >
< figure >
2025-12-29 19:30:31 +01:00
< img src = "images/studio-variable_Julie_small.png" alt = "." / >
2025-12-29 11:27:47 +01:00
< figcaption aria-hidden = "true" > .< / figcaption >
< / figure >
2025-12-29 14:48:30 +01:00
< h1 id = "julie-blanc" > Julie Blanc< / h1 >
2026-06-19 17:58:44 +02:00
<!-- Julie Blanc est designer, développeuse et chercheuse. <br>Docteure en ergonomie, sa thèse, soutenue en 2023, porte sur l'utilisation des technologies web par les designers graphiques. Elle est chercheuse associée à la HEAD (Genève) et mène régulièrement des interventions pédagogiques dans les écoles d'art et de design. -->
2026-06-19 17:52:48 +02:00
< p > Julie Blanc est designer, développeuse et chercheuse.
< br > Docteure en ergonomie, sa thèse, soutenue en 2023, porte sur
2026-06-19 17:58:44 +02:00
l’
notamment à travers sa contribution à la librairie open-source
Paged.js. Chercheuse associée à la HEAD (Genève), elle mène
régulièrement des ’
2026-06-19 17:52:48 +02:00
et de design.< / p >
2025-12-29 11:27:47 +01:00
< / div >
< div class = "people" >
< figure >
2025-12-29 19:30:31 +01:00
< img src = "images/studio-variable_Adrien_small.png" alt = "." / >
2025-12-29 11:27:47 +01:00
< figcaption aria-hidden = "true" > .< / figcaption >
< / figure >
< h1 id = "adrien-payet" > Adrien Payet< / h1 >
2026-06-19 17:52:48 +02:00
< p > Adrien Payet est designer-développeur et philosophe. Il enseigne
à ’
dans des contextes académiques et professionnels liés au design et à
la culture numérique. Sa pratique mêle conception d’
développement back-end et réflexion sur les usages.< / p >
2025-12-29 11:27:47 +01:00
< / div >
2026-06-19 17:52:48 +02:00
< section id = "notre-réseau" class = "people" >
< h1 > Notre réseau< / h1 >
< p > Le studio est ancré dans un réseau actif de professionnels du
graphisme et de la typographie, notamment via les < strong > Rencontres
de Lure< / strong > et le collectif < strong > PrePostprint< / strong > ,
espaces de réflexion et d’
l’ < / p >
< p > Cet ancrage nous permet de mobiliser au besoin des compétences
complémentaires (par exemple pour un travail de < strong > lettrage
< br > ou de création typographique< / strong > dans le cadre d’
logotype) en faisant appel à
lesquels < br > nous collaborons régulièrement.< / p >
< / section >
< / section >
< section id = "approche-studio" >
< h2 id = "notre-studio-et-son-approche" > Notre studio et son
approche< / h2 >
< p > Notre activité principale est la conception et le développement
< strong > de sites web, d’
éditoriales< / strong > . Nos interventions se concentrent sur une
double approche, à la fois graphique et technique, pensée comme un
tout cohérent. Nous concevons le design non pas comme une couche
séparée mais comme < strong > un travail mené directement dans
le < / strong > , afin que chaque choix esthétique s’
d’
seront donc réalisés en HTML et CSS, pour permettre de
rapidement des maquettes fonctionnelles, accessibles et déjà proches
de la version finale. Cette méthode réduit les écarts entre
intention et réalisation, et permet d’
principes d’ ’ < / p >
< p > Les sites que nous produisons sont légers, accessibles et conçus
pour durer : peu
travaillons généralement avec < strong > Kirby< / strong > , un CMS
open-source sobre et sécurisé, dont l’ ’
simple et accessible est pensée pour les équipes éditoriales plutôt
que pour les développeur·ses.< / p >
< p > Notre façon de travailler repose sur des < strong > allers-retours
réguliers< / strong > avec vous. Nous
intermédiaires pour valider les choix au fur et à
de tout livrer en une fois. Cela permet d’
en
émerger.< / p >
< p > Notre force réside dans la complémentarité de nos profils :
designers et ’
traverser les deux champs de < strong > faire
dialoguer les logiques formelles et techniques< / strong > . En
studio, nous défendons une approche sur-mesure, attentive aux usages
concrets, à la sobriété des moyens employés et au respect de la vie
privée.< / p >
< h3 id = "multisupport-et-web-to-print" > Multisupport et
web-to-print< / h3 >
< p > Le < strong > single-source publishing< / strong > consiste à produire
plusieurs supports (site web, documents imprimés, exports
numériques) depuis une source de contenus unique. Le
< strong > web-to-print< / strong > en est l’
imprimables (plaquettes, programmes, rapports)
concevoir chaque document manuellement dans un logiciel de mise en
page, on définit une fois les règles graphiques, et le programme
génère automatiquement les documents en y
Chaque rendu respecte la charte sans que son auteur·ice ait besoin
de compétences en design.< / p >
< p > Cette approche est particulièrement pertinente lorsqu’
institution produit des supports récurrents ou lorsque plusieurs
partenaires ont besoin d’ ’
Julie Blanc est une experte reconnue de ces
consacré une partie de ses recherches, elle a aussi fait partie de
l’
2026-06-19 17:58:44 +02:00
déployé des systèmes de
2026-06-19 17:52:48 +02:00
variés
particuliers, etc.< / p >
< p > Cette approche n’
Elle les complète, selon les besoins réels du projet et les
ressources disponibles.< / p >
<!-- ### Multisupport et web - to - print
Le ***\*web-to-print\**** désigne la génération de documents imprimables (plaquettes, programmes, rapports, etc.) directement depuis le navigateur web, à partir d'un gabarit graphique et d'une source de données, souvent issue du site web. Concrètement : plutôt que de concevoir chaque document manuellement dans un logiciel de mise en page, on définit une fois les règles graphiques (typographie, couleurs, structure), et c'est le programme qui produit automatiquement les documents en y injectant les contenus. Chaque document généré respecte la charte sans que son auteur·ice ait besoin de compétences en design.
Cette approche est particulièrement pertinente lorsqu'une institution ou un programme produit des supports récurrents (rapports, plaquettes, visuels pour réseaux sociaux, etc.) ou lorsque plusieurs partenaires ont besoin d'utiliser l'identité de manière autonome. Julie Blanc est une experte reconnue de ces technologies et leur a consacré une partie de ses recherches. Nous avons déployé des systèmes de ce type pour des clients issus de secteurs variés : institutions culturelles, programmes de recherche, particuliers, etc.
Cette approche n'exclut pas les déclinaisons plus classiques. < br > Elle les complète, selon les besoins réels du projet et les ressources disponibles. -->
< h3 id = "nos-forces" > Nos forces< / h3 >
< ul >
< li > < strong > Des maquettes directement codées en HTML et
CSS< / strong > , plutôt que figées dans un outil comme Figma. Cette
approche permet d’
Elle garantit la
maquettes par rapport au résultat final, réduit les allers-retours
entre design et développement et accélère nettement
l’ < / li >
< li > < strong > Un travail mené au plus près du code existant< / strong > ,
afin de ’ ’
continuité technique et de favoriser des
efficaces avec vous.< / li >
< li > < strong > Une expertise en single-source publishing et
web-to-print< / strong > , nous concevons des systèmes éditoriaux
capables de produire simultanément des versions web et des documents
imprimables depuis une source unique, en nous appuyant sur des
technologies ouvertes (HTML, CSS, Paged.js).< / li >
< li > < strong > Une démarche d’ ’
assumée< / strong > , qui se traduit par
recours limité à JavaScript, un HTML
normes d’ ’
fallback bien pensés. Bref, une attention constante à la performance
et < / li >
< / ul >
2025-12-29 11:27:47 +01:00
< / section >
< section id = "portfolio-introduction" class = "portfolio-group" >
< h2 id = "sélection-de-projets" > Sélection de projets< / h2 >
< / section >
2026-04-05 15:47:43 +02:00
< section id = "wysiwyg" class = "portfolio-group" >
< h1 id = "wysiwyg" > WYSIWYG< / h1 >
< p > Projet de recherche sur l’
Suisse et ’ < / p >
2025-12-29 11:27:47 +01:00
< figure >
2026-04-05 15:47:43 +02:00
< img src = "images/wysiwyg.png" alt = "." / >
2025-12-29 11:27:47 +01:00
< figcaption aria-hidden = "true" > .< / figcaption >
< / figure >
< div class = "details" >
< dl >
< dt >
URL
< / dt >
< dd >
2026-04-05 15:47:43 +02:00
< a href = "https://wysiwyg.ch/" target = "_blank" > wysiwyg.ch< / a >
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Secteur
< / dt >
< dd >
Recherche
< / dd >
< / dl >
< dl >
< dt >
Client
< / dt >
< dd >
2026-04-05 15:47:43 +02:00
HEAD – ’
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Prestation(s)
< / dt >
< dd >
2026-04-05 15:47:43 +02:00
Design et développement full-stack
< / dd >
< / dl >
< dl >
< dt >
Date
< / dt >
< dd >
2025
< / dd >
< / dl >
< / div >
< / section >
2026-06-19 18:07:10 +02:00
< section id = "cultures-visuelles" class = "portfolio-group" >
< h1 id = "cultures-visuelles" > Cultures visuelles< / h1 >
< p > Plateforme collaborative pour le programme de recherche,
intégrant une ’
contenu.< / p >
2025-12-29 11:27:47 +01:00
< figure >
2026-06-19 18:07:10 +02:00
< img src = "images/cultures-visuelles.png" alt = "." / >
2025-12-29 11:27:47 +01:00
< figcaption aria-hidden = "true" > .< / figcaption >
< / figure >
< div class = "details" >
< dl >
< dt >
URL
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
< a href = "https://www.culturesvisuelles.org/" target = "_blank" > culturesvisuelles.org< / a >
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Secteur
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Recherche
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Client
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Université de Strasbourg
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Prestation(s)
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Design et développement full-stack
2026-04-05 15:47:43 +02:00
< / dd >
< / dl >
< dl >
< dt >
Partenaire(s)
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
en collaboration avec Timothée Goguely
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Date
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
2020
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< / div >
< / section >
2026-04-05 15:47:43 +02:00
< section id = "timelure" class = "portfolio-group" >
< h1 id = "timelure" > Timelure< / h1 >
< p > Archives des 70 ans de programmation des Rencontres de Lure,
organisées < / p >
2025-12-29 11:57:12 +01:00
< figure >
2026-04-05 15:47:43 +02:00
< img src = "images/timelure-responsive.jpg" alt = "." / >
2025-12-29 11:57:12 +01:00
< figcaption aria-hidden = "true" > .< / figcaption >
< / figure >
< div class = "details" >
< dl >
< dt >
URL
< / dt >
< dd >
2026-04-05 15:47:43 +02:00
< a href = "https://chronologie.delure.org/" target = "_blank" > chronologie.delure.org< / a >
2025-12-29 11:57:12 +01:00
< / dd >
< / dl >
< dl >
< dt >
Secteur
< / dt >
< dd >
2026-04-05 15:47:43 +02:00
Culturel, Recherche
2025-12-29 11:57:12 +01:00
< / dd >
< / dl >
< dl >
< dt >
Client
< / dt >
< dd >
2026-04-05 15:47:43 +02:00
Rencontres Internationales de Lure
2025-12-29 11:57:12 +01:00
< / dd >
< / dl >
< dl >
< dt >
Prestation(s)
< / dt >
< dd >
2026-01-26 17:34:34 +01:00
Design et développement full-stack
2025-12-29 11:57:12 +01:00
< / dd >
< / dl >
< dl >
< dt >
2026-04-05 15:47:43 +02:00
Partenaire(s)
< / dt >
< dd >
Julien Bidoret, Lola Duval et l’
< / dd >
< / dl >
< dl >
< dt >
2025-12-29 11:57:12 +01:00
Date
< / dt >
< dd >
2026-04-05 15:47:43 +02:00
2022
2025-12-29 11:57:12 +01:00
< / dd >
< / dl >
< / div >
< / section >
2026-04-05 15:47:43 +02:00
< section id = "chromobase" class = "portfolio-group" >
< h1 id = "chromobase" > Chromobase< / h1 >
< p > < strong > Base de données< / strong > du projet ERC Chromotope qui
explore l’ ’
l’
< strong > fonctionnalités avancées de navigation, recherche et tri des
contenus< / strong > .< / p >
2025-12-29 11:27:47 +01:00
< figure >
2026-04-05 15:47:43 +02:00
< img src = "images/chromobase.png" alt = "." / >
2025-12-29 11:27:47 +01:00
< figcaption aria-hidden = "true" > .< / figcaption >
< / figure >
< div class = "details" >
< dl >
< dt >
URL
< / dt >
< dd >
2026-04-05 15:47:43 +02:00
< a href = "https://chromobase.huma-num.fr/" target = "_blank" > chromobase.huma-num.fr< / a >
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Secteur
< / dt >
< dd >
2026-01-26 17:34:34 +01:00
Recherche
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Client
< / dt >
< dd >
2026-04-05 15:47:43 +02:00
Sorbonne Université, CNAM, University of Oxford
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Prestation(s)
< / dt >
< dd >
2026-04-05 15:47:43 +02:00
Design et développement front-end
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
2026-01-26 17:34:34 +01:00
Partenaire(s)
< / dt >
< dd >
2026-04-05 15:47:43 +02:00
OuestWare (développement)
2026-01-26 17:34:34 +01:00
< / dd >
< / dl >
< dl >
< dt >
2025-12-29 14:48:30 +01:00
Date
2025-12-29 11:27:47 +01:00
< / dt >
< dd >
2026-04-05 15:47:43 +02:00
2023
2025-12-29 14:48:30 +01:00
< / dd >
< / dl >
< / div >
< / section >
2026-04-05 15:47:43 +02:00
< section id = "resin" class = "portfolio-group" >
< h1 id = "résin" > RésIn< / h1 >
< p > Plateforme pour un réseau d’
< strong > système de filtres croisés< / strong > .< / p >
2025-12-29 14:48:30 +01:00
< figure >
2026-04-05 15:47:43 +02:00
< img src = "images/resin.png" alt = "." / >
2025-12-29 14:48:30 +01:00
< figcaption aria-hidden = "true" > .< / figcaption >
< / figure >
< div class = "details" >
< dl >
< dt >
URL
< / dt >
< dd >
2026-04-05 15:47:43 +02:00
< a href = "https://resin.medialab.sciences-po.fr/" target = "_blank" > resin.medialab.sciences-po.fr< / a >
2025-12-29 14:48:30 +01:00
< / dd >
< / dl >
< dl >
< dt >
Secteur
< / dt >
< dd >
2026-01-26 17:34:34 +01:00
Recherche
2025-12-29 14:48:30 +01:00
< / dd >
< / dl >
< dl >
< dt >
Client
< / dt >
< dd >
2026-04-05 15:47:43 +02:00
médialab, SciencesPo
2025-12-29 14:48:30 +01:00
< / dd >
< / dl >
< dl >
< dt >
Prestation(s)
< / dt >
< dd >
2026-04-05 15:47:43 +02:00
Design et développement front-end
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Date
< / dt >
< dd >
2025-12-29 14:48:30 +01:00
2025
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< / div >
< / section >
2026-01-26 17:34:34 +01:00
< section id = "medialab" class = "portfolio-group" >
< h1 id = "médialab" > médialab< / h1 >
< p > Laboratoire interdisciplinaire qui interroge les relations entre
le numérique et nos sociétés. Un site web sans images et sans
Javascript.< / p >
2025-12-29 11:27:47 +01:00
< figure >
2026-01-26 17:34:34 +01:00
< img src = "images/medialab.png" alt = "." / >
2025-12-29 11:27:47 +01:00
< figcaption aria-hidden = "true" > .< / figcaption >
< / figure >
< div class = "details" >
< dl >
< dt >
URL
< / dt >
< dd >
2026-01-26 17:34:34 +01:00
< a href = "https://medialab.sciencespo.fr/" target = "_blank" > medialab.sciencespo.fr< / a >
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Secteur
< / dt >
< dd >
Recherche
< / dd >
< / dl >
< dl >
< dt >
Client
< / dt >
< dd >
2026-01-26 17:34:34 +01:00
médialab, SciencesPo
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Prestation(s)
< / dt >
< dd >
2026-04-05 15:47:43 +02:00
Design et développement front-end
2025-12-29 14:48:30 +01:00
< / dd >
< / dl >
< dl >
< dt >
Partenaire(s)
< / dt >
< dd >
2026-04-05 15:47:43 +02:00
en collaboration avec Benjamin Gremillon et l’
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Date
< / dt >
< dd >
2026-01-26 17:34:34 +01:00
2019
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
2026-06-19 18:44:31 +02:00
< br >
< dl >
< dd >
En savoir
plus: < a href = "https://julie-blanc.fr/activites/2020-03-25_medialab-1/" target = "_blank" > julie-blanc.fr/activites/2020-03-25_medialab-1< / a >
< / dd >
< / dl >
2025-12-29 11:27:47 +01:00
< / div >
< / section >
2026-06-19 18:07:10 +02:00
< section id = "d6cor" class = "portfolio-group" >
< h1 id = "d6cor" > D6cor< / h1 >
< p > Outil de gestion éditoriale fondé sur le CMS Kirby, pour une
revue reposant sur le single-source publishing : web-to-print pour
la version imprimée, contenus multimédias pour la version en
ligne.< / p >
2025-12-29 11:27:47 +01:00
< figure >
2026-06-19 18:07:10 +02:00
< img src = "images/d6cor-book.png" alt = "." / >
2025-12-29 11:27:47 +01:00
< figcaption aria-hidden = "true" > .< / figcaption >
< / figure >
< div class = "details" >
< dl >
< dt >
URL
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
[en cours de développement]
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Secteur
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Édition
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Client
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
École nationale Supérieure des Arts Décoratifs, Paris
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Prestation(s)
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Direction artistique, développement full-stack et web-to-print
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
2026-01-26 17:34:34 +01:00
Partenaire(s)
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Sarah Garcin
2026-01-26 17:34:34 +01:00
< / dd >
< / dl >
< dl >
< dt >
2025-12-29 11:27:47 +01:00
Date
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
2026
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< / div >
< / section >
2026-04-05 15:47:43 +02:00
< section id = "actuel-inactuel" class = "portfolio-group" >
< h1 id = "actuel-inactuel" > actuel-inactuel< / h1 >
< p > Plateforme pour une critique des arts et des techniques.< / p >
< figure >
< img src = "images/actuel-inactuel.png" alt = "." / >
< figcaption aria-hidden = "true" > .< / figcaption >
< / figure >
< div class = "details" >
< dl >
< dt >
URL
< / dt >
< dd >
< a href = "https://actuel-inactuel.fr/" target = "_blank" > actuel-inactuel.fr< / a >
< / dd >
< / dl >
< dl >
< dt >
Secteur
< / dt >
< dd >
Recherche
< / dd >
< / dl >
< dl >
< dt >
Client
< / dt >
< dd >
Association époque
< / dd >
< / dl >
< dl >
< dt >
Prestation(s)
< / dt >
< dd >
Design et développement full-stack
< / dd >
< / dl >
< dl >
< dt >
Date
< / dt >
< dd >
2024
< / dd >
< / dl >
< / div >
< / section >
2026-06-19 18:44:31 +02:00
< section id = "chiragan" class = "portfolio-group" >
< h1 id = "les-sculptures-de-la-villa-romaine-de-chiragan" > Les
sculptures de la villa romaine de Chiragan< / h1 >
< p > Catalogue multisupport pour le musée Saint-Raymond : < br > version
numérique et version imprimée générées < br > depuis une même source
avec du web-to-print< / p >
< figure >
< img src = "images/chiragan-2.jpg" alt = "." / >
< figcaption aria-hidden = "true" > .< / figcaption >
< / figure >
< div class = "details" >
< dl >
< dt >
URL
< / dt >
< dd >
< p > < a href = "https://villachiragan.saintraymond.toulouse.fr/" target = "_blank" > villachiragan.saintraymond.toulouse.fr< / a > < / p >
< / dd >
< / dl >
< dl >
< dt >
Secteur
< / dt >
< dd >
Culture
< / dd >
< / dl >
< dl >
< dt >
Client
< / dt >
< dd >
Musée Saint-Raymond (Toulouse)
< / dd >
< / dl >
< dl >
< dt >
Prestation(s)
< / dt >
< dd >
Design et développement front-end
< / dd >
< / dl >
< dl >
< dt >
Partenaire(s)
< / dt >
< dd >
Antoine Fauchié
< / dd >
< / dl >
< dl >
< dt >
Date
< / dt >
< dd >
2020
< / dd >
< / dl >
< br >
< dl >
< dd >
En savoir
plus: < a href = "https://julie-blanc.fr/activites/2020-chiragan-article/" target = "_blank" > julie-blanc.fr/activites/2020-chiragan-article< / a >
< / dd >
< / dl >
< / div >
< / section >
< section id = "regarts" class = "portfolio-group" >
< h1 id = "regarts" > Reg·arts< / h1 >
< p > Plateforme d’
registres d’ < / p >
< figure >
< img src = "images/regarts.png" alt = "." / >
< figcaption aria-hidden = "true" > .< / figcaption >
< / figure >
< div class = "details" >
< dl >
< dt >
URL
< / dt >
< dd >
< a href = "https://regarts.huma-num.fr/" target = "_blank" > regarts.huma-num.fr< / a >
< / dd >
< / dl >
< dl >
< dt >
Secteur
< / dt >
< dd >
Culture
< / dd >
< / dl >
< dl >
< dt >
Client
< / dt >
< dd >
École des Beaux-Arts de Paris
< / dd >
< / dl >
< dl >
< dt >
Prestation(s)
< / dt >
< dd >
Développement front-end
< / dd >
< / dl >
< dl >
< dt >
Partenaire(s)
< / dt >
< dd >
OuestWare (développement), < br > Lola Duval (direction artistique)
< / dd >
< / dl >
< dl >
< dt >
Date
< / dt >
< dd >
2024
< / dd >
< / dl >
< / div >
< / section >
2026-06-19 18:07:10 +02:00
< section id = "acau" class = "portfolio-group" >
< h1 id = "acau" > ACAU< / h1 >
< p > Site vitrine pour l’
Urbanistes.< / p >
2025-12-29 11:27:47 +01:00
< figure >
2026-06-19 18:07:10 +02:00
< img src = "images/acau.png" alt = "." / >
2025-12-29 11:27:47 +01:00
< figcaption aria-hidden = "true" > .< / figcaption >
< / figure >
< div class = "details" >
< dl >
< dt >
URL
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
< a href = "https://www.acau-architectes.fr/" target = "_blank" > acau-architectes.fr< / a >
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Secteur
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Communication
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Client
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Agence Coopérative Architectes Urbanistes
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Prestation(s)
< / dt >
< dd >
2026-01-26 17:34:34 +01:00
Développement full-stack
< / dd >
< / dl >
< dl >
< dt >
Partenaire(s)
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Plastac (design)
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Date
< / dt >
< dd >
2026-01-26 17:34:34 +01:00
2024
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< / div >
< / section >
2026-06-19 18:07:10 +02:00
< section id = "esaj" class = "portfolio-group" >
< h1 id = "esaj" > ESAJ< / h1 >
< p > Site vitrine pour l’ ’
avec programmes des formations, formulaire de contact et
actualités.< / p >
2026-04-05 16:33:14 +02:00
< figure >
2026-06-19 18:07:10 +02:00
< img src = "images/esaj.png" alt = "." / >
2026-04-05 16:33:14 +02:00
< figcaption aria-hidden = "true" > .< / figcaption >
< / figure >
< div class = "details" >
< dl >
< dt >
URL
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
< a href = "https://www.esaj.asso.fr/" target = "_blank" > www.esaj.asso.fr< / a >
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< dl >
< dt >
Secteur
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Formation
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< dl >
< dt >
Client
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
École supérieure d’
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< dl >
< dt >
Prestation(s)
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Développement full-stack
< / dd >
< / dl >
< dl >
< dt >
Partenaire(s)
< / dt >
< dd >
Lola Duval (design)
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< dl >
< dt >
Date
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
2024
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< / div >
< / section >
2026-06-19 18:07:10 +02:00
< section id = "botascopia" class = "portfolio-group" >
< h1 id = "botascopia" > Botascopia< / h1 >
< p > Projet de recherche collaboratif dont le but est de connaître et
reconnaître les plantes à fleurs dans un espace donné. Mise en page
web-to-print pour un générateur automatique de guide
d’ ’
collaborative.< / p >
2025-12-29 11:27:47 +01:00
< figure >
2026-06-19 18:07:10 +02:00
< img src = "images/botascopia-livret.png" alt = "." / >
2025-12-29 11:27:47 +01:00
< figcaption aria-hidden = "true" > .< / figcaption >
< / figure >
< div class = "details" >
< dl >
< dt >
URL
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
< a href = "https://botascopia.inria.fr/" target = "_blank" > botascopia.inria.fr< / a >
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Secteur
< / dt >
< dd >
2026-04-05 15:47:43 +02:00
Recherche
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Client
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Botascopia, INRIA
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Prestation(s)
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Design et développement du système web-to-print
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< dl >
< dt >
Date
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
2026
2025-12-29 11:27:47 +01:00
< / dd >
< / dl >
< / div >
< / section >
2026-06-19 18:07:10 +02:00
< section id = "heroines" class = "portfolio-group" >
< h1 id = "héroïnes" > Héro·ïne·s< / h1 >
< p > Publication du groupe de recherche de La Fémis à propos de la
figure du héros dans les œuvres et pratiques artistiques< / p >
2026-04-05 16:33:14 +02:00
< figure >
2026-06-19 18:07:10 +02:00
< img src = "images/repenser-les-heros.png" alt = "." / >
2026-04-05 16:33:14 +02:00
< figcaption aria-hidden = "true" > .< / figcaption >
< / figure >
< div class = "details" >
< dl >
< dt >
URL
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
< a href = "https://repenserlesheros.femis.fr/" target = "_blank" > repenserlesheros.femis.fr< / a >
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< dl >
< dt >
Secteur
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Recherche
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< dl >
< dt >
Client
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
groupe de recherche de La Fémis / SACRe, PSL
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< dl >
< dt >
Prestation(s)
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Design et développement full-stack
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
2026-06-19 18:07:10 +02:00
<!-- <dl>
< dt > Partenaire(s)< / dt >
< dd > en collaboration avec Benjamin Benjamin Gremillon et l’ < / dd >
< / dl > -->
2026-04-05 16:33:14 +02:00
< dl >
< dt >
Date
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
2021
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< / div >
< / section >
2026-06-19 18:07:10 +02:00
< section id = "ntbesancon" class = "portfolio-group" >
< h1 id = "nouveau-théâtre-de-besançon" > Nouveau théâtre de
Besançon< / h1 >
< p > Site web, avec calendrier et billetterie intégrée.< / p >
2026-04-05 16:33:14 +02:00
< figure >
2026-06-19 18:07:10 +02:00
< img src = "images/ntbesancon.png" alt = "." / >
2026-04-05 16:33:14 +02:00
< figcaption aria-hidden = "true" > .< / figcaption >
< / figure >
< div class = "details" >
< dl >
< dt >
URL
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
< a href = "https://ntbesancon.fr/" target = "_blank" > ntbesancon.fr< / a >
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< dl >
< dt >
Secteur
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Culture
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< dl >
< dt >
Client
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Nouveau théâtre de Besançon
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< dl >
< dt >
Prestation(s)
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Développement full-stack
< / dd >
< / dl >
< dl >
< dt >
Partenaire(s)
< / dt >
< dd >
Studio Plastac (design)
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< dl >
< dt >
Date
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
2024
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< / div >
< / section >
2026-06-19 18:07:10 +02:00
< section id = "flaash" class = "portfolio-group" >
< h1 id = "flaash" > Flaash< / h1 >
< p > Site de la revue d’ < / p >
2026-04-05 16:33:14 +02:00
< figure >
2026-06-19 18:07:10 +02:00
< img src = "images/flaash-thematiques.png" alt = "." / >
2026-04-05 16:33:14 +02:00
< figcaption aria-hidden = "true" > .< / figcaption >
< / figure >
< div class = "details" >
< dl >
< dt >
URL
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
< a href = "https://www.flaash.fr" target = "_blank" > flaash.fr< / a >
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< dl >
< dt >
Secteur
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Culture
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< dl >
< dt >
Client
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Revue Flaash
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< dl >
< dt >
Prestation(s)
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Développement full-stack
< / dd >
< / dl >
< dl >
< dt >
Partenaire(s)
< / dt >
< dd >
Studio Plastac (design)
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< dl >
< dt >
Date
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
2024
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< / div >
< / section >
2026-06-19 18:07:10 +02:00
< section id = "decarb-one" class = "portfolio-group" >
< h1 id = "decarb.one" > Decarb.one< / h1 >
< p > Site < strong > éco-conçu< / strong > pour une agence de relations
presse et de communication responsable.< / p >
2026-04-05 16:33:14 +02:00
< figure >
2026-06-19 18:07:10 +02:00
< img src = "images/decarb-one.png" alt = "." / >
2026-04-05 16:33:14 +02:00
< figcaption aria-hidden = "true" > .< / figcaption >
< / figure >
< div class = "details" >
< dl >
< dt >
URL
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
< a href = "https://decarb.one/" target = "_blank" > decarb.one< / a >
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< dl >
< dt >
Secteur
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Communication
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< dl >
< dt >
Client
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
decarb.one
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< dl >
< dt >
Prestation(s)
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Design, développement full-stack
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< dl >
< dt >
Partenaire(s)
< / dt >
< dd >
en collaboration avec Praticable
< / dd >
< / dl >
< dl >
< dt >
Date
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
2022
2026-04-05 16:33:14 +02:00
< / dd >
< / dl >
< / div >
< / section >
2026-06-19 18:07:10 +02:00
< section id = "tmn-lab" class = "portfolio-group" >
< h1 id = "tmn-lab-état-des-lieux-du-numérique-2021" > TMN Lab, État des
lieux du numérique 2021< / h1 >
< p > Outil pour présenter les études du TMNlab avec système de
collecte des favoris et d’ < / p >
2026-06-19 17:52:48 +02:00
< figure >
2026-06-19 18:07:10 +02:00
< img src = "images/TMNlab.png" alt = "." / >
2026-06-19 17:52:48 +02:00
< figcaption aria-hidden = "true" > .< / figcaption >
< / figure >
< div class = "details" >
< dl >
< dt >
URL
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
< a href = "https://www.tmnlab.com/etudes/etat-des-lieux-du-numerique-2021" target = "_blank" > /www.tmnlab.com/etudes/etat-des-lieux-du-numerique-2021< / a >
2026-06-19 17:52:48 +02:00
< / dd >
< / dl >
< dl >
< dt >
Secteur
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Recherche
2026-06-19 17:52:48 +02:00
< / dd >
< / dl >
< dl >
< dt >
Client
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
TMNlab
2026-06-19 17:52:48 +02:00
< / dd >
< / dl >
< dl >
< dt >
Prestation(s)
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
Design et développement full-stack
2026-06-19 17:52:48 +02:00
< / dd >
< / dl >
< dl >
< dt >
Partenaire(s)
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
en collaboration avec Praticable
2026-06-19 17:52:48 +02:00
< / dd >
< / dl >
< dl >
< dt >
Date
< / dt >
< dd >
2026-06-19 18:07:10 +02:00
2021
2026-06-19 17:52:48 +02:00
< / dd >
< / dl >
< / div >
< / section >
< section id = "kirby" >
< h2 id = "kirby-le-cms-qui-sadapte-à-vous" > Kirby, le CMS qui s’
à vous< / h2 >
< p > Après avoir testé différents CMS, nous avons choisi de nous
spécialiser sur Kirby, un < strong > open-source, léger et
sécurisé< / strong > . Contrairement à WordPress, dont l’
surcharge les administrateur·ices de menus et d’
propose un < strong > back-office sobre et ergonomique, centré sur
l’ ’ < / strong > .< br / >
Sa souplesse permet de créer rapidement des interfaces sur mesure,
adaptées aux ’
sources de conflits et
Kirby est aussi moins exposé aux < strong > codebase
allégée< / strong > garantit des < strong > sites rapides, stables et
faciles à < / strong > .< br / >
En résumé, Kirby offre une solution élégante, durable et
parfaitement adaptée aux
simple et efficace.< / p >
< figure >
< img src = "images/kirby/compagnie-le-k-home.png"
alt="Exemple d’ ’
< figcaption aria-hidden = "true" > Exemple d’ ’
contenus dans Kirby< / figcaption >
< / figure >
< / section >
< section id = "kirby-d6cor" >
< h2
id="revue-d6cor-un-exemple-de-réalisation-en-web-to-print-avec-kirby">Revue
D6cor: un exemple de réalisation en web-to-print avec Kirby< / h2 >
< div class = "description" >
< p > Décor est la revue de l’
Décoratifs de Paris. Ce < em > D6cor Terminal< / em > , est
consacré aux pratiques numériques. Pour
< strong > outil de gestion éditoriale< / strong > fondé sur le CMS Kirby
a été spécialement développé afin de faciliter les échanges et la
collaboration tout au long du processus de fabrication.< / p >
< p > La revue repose également sur un principe de
< strong > single-source publishing< / strong >
produite selon le principe du web-to-print, tandis que la version
en < / p >
< ul >
< li > 165 × < / li >
< li > 10 000 exemplaires, impression offset< / li >
< li > Site web: en cours de développement< / li >
< / ul >
< / div >
< figure >
< img src = "images/kirby/d6cor-1-home.png" class = "fig-border"
alt="Panel d’
< figcaption aria-hidden = "true" > Panel d’
revue< / figcaption >
< / figure >
< figure >
< img src = "images/kirby/d6cor-3-constructeur-blocs-page.png"
class="fig-border"
alt="Page d’
< figcaption aria-hidden = "true" > Page d’
publication avec métadonnées et images< / figcaption >
< / figure >
< figure >
< img src = "images/kirby/d6cor-2-publication.png" class = "fig-border"
alt="Blocs de constructureurs de page" />
< figcaption aria-hidden = "true" > Blocs de constructureurs de
page< / figcaption >
< / figure >
< figure >
< img src = "images/kirby/d6cor-web-to-print.png" class = "fig-border"
alt="Double page de la revue en aperçu dans le navigateur" />
< figcaption aria-hidden = "true" > Double page de la revue en aperçu
dans le navigateur< / figcaption >
< / figure >
< figure >
< img src = "images/d6cor-book.png" alt = "Revue en impression offset" / >
< figcaption aria-hidden = "true" > Revue en impression
offset< / figcaption >
< / figure >
< / section >
2025-12-29 11:27:47 +01:00
< section id = "details" >
< p > STUDIO VARIABLE< br / >
SAS, société par actions simplifiée au capital social de 1 200,00
€< br / >
N° SIRET 988 558 003 00014< br / >
N° de TVA FR95988558003< / p >
< p > Siège social:< br / >
22 rue Boyer< br / >
75020 Paris - France< / p >
< p > Lieu d’ < br / >
Césure (Bureau 339)< br / >
13 rue Santeuil< br / >
75005 Paris - France< / p >
< p > Site web: < a
href="https://studio-variable.com/">studio-variable.com< / a > < / p >
2026-06-19 18:07:10 +02:00
< p > Pour nous contacter:< / p >
< ul >
< li > contact@studio-variable.com< / li >
< li > julie@studio-variable.com / +33 (0)6 31 51 36 55< / li >
< li > adrien@studio-variable.com / +33 (0)6 30 69 09 29< / li >
< / ul >
2025-12-29 11:27:47 +01:00
< / section >
< / body >
< / html >
