studio-variable/basic-portfolio_web-to-print
4
0
Fork 0
Code Issues Pull requests 1 Projects Releases Packages Wiki Activity Actions

new images

Browse source
This commit is contained in:
Julie Blanc 2026-04-05 15:47:43 +02:00
parent 071b263fc4
commit 6431b5a439
37 changed files with 507 additions and 283 deletions
Download patch file Download diff file Expand all files Collapse all files

615
index.html
View file

@ -16,8 +16,8 @@
<body>
<aside class="infos">
<p>Portfolio CERAMIQ+</p>
<p>2 février 2026</p>
<p>Portfolio CEAAC</p>
<p>12 février 2026</p>
<p>contact@studio-variable.com</p>
</aside>
@ -27,7 +27,7 @@
</header>
<footer>
<p><p>Studio Variable – Portfolio CERAMIQ+</p></p>
<p><p>Studio Variable – Portfolio CEAAC</p></p>
</footer>
@ -43,10 +43,9 @@
développe une approche formelle et technique qui concilie
<strong>ergonomie, sobriété, accessibilité et respect de la vie
privée</strong>.</p>
<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 logiciel libre et de l’open
source.</p>
<!-- Nous sommes spécialisés dans la publication à source unique en **web-to-print**. -->
<p>Nous privilégions les projets ouverts et engagés, avec une forte
culture du ogiciel libre et de l’open source.</p>
</section>
<section id="equipe">
<h2 id="équipe">Équipe</h2>
@ -75,13 +74,301 @@
<strong>développement back-end et la maintenance</strong> du
projet.</p>
<p>Adrien étudie, enseigne et pratique la philosophie, le design et
le code. Il a co-fondé le studio Variable. Il enseigne à l’ENSCi et
le code. Il a co-fondé le studio Variable. Il enseigne à l’ENSCi et
à Paris 1.</p>
</div>
</section>
<section id="portfolio-introduction" class="portfolio-group">
<h2 id="sélection-de-projets">Sélection de projets</h2>
</section>
<section id="wysiwyg" class="portfolio-group">
<h1 id="wysiwyg">WYSIWYG</h1>
<p>Projet de recherche sur l’évolution des logiciels de graphisme en
Suisse et en France (1980 - aujourd’hui).</p>
<figure>
<img src="images/wysiwyg.png" alt="." />
<figcaption aria-hidden="true">.</figcaption>
</figure>
<div class="details">
<dl>
<dt>
URL
</dt>
<dd>
<a href="https://wysiwyg.ch/" target="_blank">wysiwyg.ch</a>
</dd>
</dl>
<dl>
<dt>
Secteur
</dt>
<dd>
Recherche
</dd>
</dl>
<dl>
<dt>
Client
</dt>
<dd>
HEAD – Genève, Haute école d’art et de design
</dd>
</dl>
<dl>
<dt>
Prestation(s)
</dt>
<dd>
Design et développement full-stack
</dd>
</dl>
<dl>
<dt>
Date
</dt>
<dd>
2025
</dd>
</dl>
</div>
</section>
<section id="acau" class="portfolio-group">
<h1 id="acau">ACAU</h1>
<p>Site vitrine pour l’Agence Coopérative Architectes
Urbanistes.</p>
<figure>
<img src="images/acau.png" alt="." />
<figcaption aria-hidden="true">.</figcaption>
</figure>
<div class="details">
<dl>
<dt>
URL
</dt>
<dd>
<a href="https://www.acau-architectes.fr/" target="_blank">acau-architectes.fr</a>
</dd>
</dl>
<dl>
<dt>
Secteur
</dt>
<dd>
Communication
</dd>
</dl>
<dl>
<dt>
Client
</dt>
<dd>
Agence Coopérative Architectes Urbanistes
</dd>
</dl>
<dl>
<dt>
Prestation(s)
</dt>
<dd>
Développement full-stack
</dd>
</dl>
<dl>
<dt>
Partenaire(s)
</dt>
<dd>
Plastac (design)
</dd>
</dl>
<dl>
<dt>
Date
</dt>
<dd>
2024
</dd>
</dl>
</div>
</section>
<section id="esaj" class="portfolio-group">
<h1 id="esaj">ESAJ</h1>
<p>Site vitrine pour l’École supérieure d’Architecture des Jardins,
avec programmes des formations, formulaire de contact et
actualités.</p>
<figure>
<img src="images/esaj.png" alt="." />
<figcaption aria-hidden="true">.</figcaption>
</figure>
<div class="details">
<dl>
<dt>
URL
</dt>
<dd>
<a href="https://www.esaj.asso.fr/" target="_blank">www.esaj.asso.fr</a>
</dd>
</dl>
<dl>
<dt>
Secteur
</dt>
<dd>
Formation
</dd>
</dl>
<dl>
<dt>
Client
</dt>
<dd>
École supérieure d’Architecture des Jardins
</dd>
</dl>
<dl>
<dt>
Prestation(s)
</dt>
<dd>
Développement full-stack
</dd>
</dl>
<dl>
<dt>
Partenaire(s)
</dt>
<dd>
Lola Duval (design)
</dd>
</dl>
<dl>
<dt>
Date
</dt>
<dd>
2024
</dd>
</dl>
</div>
</section>
<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>
<figure>
<img src="images/ntbesancon.png" alt="." />
<figcaption aria-hidden="true">.</figcaption>
</figure>
<div class="details">
<dl>
<dt>
URL
</dt>
<dd>
<a href="https://ntbesancon.fr/" target="_blank">ntbesancon.fr</a>
</dd>
</dl>
<dl>
<dt>
Secteur
</dt>
<dd>
Culture
</dd>
</dl>
<dl>
<dt>
Client
</dt>
<dd>
Nouveau théâtre de Besançon
</dd>
</dl>
<dl>
<dt>
Prestation(s)
</dt>
<dd>
Développement full-stack
</dd>
</dl>
<dl>
<dt>
Partenaire(s)
</dt>
<dd>
Studio Plastac (design)
</dd>
</dl>
<dl>
<dt>
Date
</dt>
<dd>
2024
</dd>
</dl>
</div>
</section>
<section id="timelure" class="portfolio-group">
<h1 id="timelure">Timelure</h1>
<p>Archives des 70 ans de programmation des Rencontres de Lure,
organisées sous forme de chronologie.</p>
<figure>
<img src="images/timelure-responsive.jpg" alt="." />
<figcaption aria-hidden="true">.</figcaption>
</figure>
<div class="details">
<dl>
<dt>
URL
</dt>
<dd>
<a href="https://chronologie.delure.org/" target="_blank">chronologie.delure.org</a>
</dd>
</dl>
<dl>
<dt>
Secteur
</dt>
<dd>
Culturel, Recherche
</dd>
</dl>
<dl>
<dt>
Client
</dt>
<dd>
Rencontres Internationales de Lure
</dd>
</dl>
<dl>
<dt>
Prestation(s)
</dt>
<dd>
Design et développement full-stack
</dd>
</dl>
<dl>
<dt>
Partenaire(s)
</dt>
<dd>
Julien Bidoret, Lola Duval et l’équipe des Rencontres de Lure
</dd>
</dl>
<dl>
<dt>
Date
</dt>
<dd>
2022
</dd>
</dl>
</div>
</section>
<section id="chromobase" class="portfolio-group">
<h1 id="chromobase">Chromobase</h1>
<p><strong>Base de données</strong> du projet ERC Chromotope qui
@ -123,7 +410,7 @@
Prestation(s)
</dt>
<dd>
Design, front-end
Design et développement front-end
</dd>
</dl>
<dl>
@ -182,222 +469,7 @@
Prestation(s)
</dt>
<dd>
Design, développement front-end
</dd>
</dl>
<dl>
<dt>
Date
</dt>
<dd>
2025
</dd>
</dl>
</div>
</section>
<section id="design-to-pack" class="portfolio-group">
<h1 id="design-to-pack">Design to Pack</h1>
<p>Plateforme complète de gestion de projets de création de flacons
de parfum. L’interface permet de collaborer du brief aux produits
finis, en passant par les vues 3D interactives.</p>
<figure>
<img src="images/design-to-pack.jpg" alt="." />
<figcaption aria-hidden="true">.</figcaption>
</figure>
<div class="details">
<dl>
<dt>
URL
</dt>
<dd>
Plateforme privée
</dd>
</dl>
<dl>
<dt>
Secteur
</dt>
<dd>
Luxe
</dd>
</dl>
<dl>
<dt>
Client
</dt>
<dd>
Groupe Pochet
</dd>
</dl>
<dl>
<dt>
Prestation(s)
</dt>
<dd>
Développement du back-end, de la logique applicative et des
interactions.
</dd>
</dl>
<dl>
<dt>
Date
</dt>
<dd>
2025
</dd>
</dl>
</div>
</section>
<section id="gms" class="portfolio-group">
<h1 id="game-management-system">Game Management System</h1>
<p>Plateforme sur-mesure dédié à la conception et à la planification
de parties de divers jeux en ligne.</p>
<figure>
<img src="images/gms.png" alt="." />
<figcaption aria-hidden="true">.</figcaption>
</figure>
<div class="details">
<dl>
<dt>
URL
</dt>
<dd>
Plateforme privée
</dd>
</dl>
<dl>
<dt>
Secteur
</dt>
<dd>
Divertissement
</dd>
</dl>
<dl>
<dt>
Client
</dt>
<dd>
<a href="https://www.world.game/">World Game</a>
</dd>
</dl>
<dl>
<dt>
Prestation(s)
</dt>
<dd>
Design et développement full-stack
</dd>
</dl>
<dl>
<dt>
Date
</dt>
<dd>
En cours
</dd>
</dl>
</div>
</section>
<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’impression à la demande.</p>
<figure>
<img src="images/TMNlab.png" alt="." />
<figcaption aria-hidden="true">.</figcaption>
</figure>
<div class="details">
<dl>
<dt>
URL
</dt>
<dd>
<a href="hhttps://www.tmnlab.com/etudes/etat-des-lieux-du-numerique-2021" target="_blank">/www.tmnlab.com/etudes/etat-des-lieux-du-numerique-2021</a>
</dd>
</dl>
<dl>
<dt>
Secteur
</dt>
<dd>
Recherche
</dd>
</dl>
<dl>
<dt>
Client
</dt>
<dd>
TMNlab
</dd>
</dl>
<dl>
<dt>
Prestation(s)
</dt>
<dd>
Design et développement full-stack
</dd>
</dl>
<dl>
<dt>
Partenaire(s)
</dt>
<dd>
en collaboration avec Praticable
</dd>
</dl>
<dl>
<dt>
Date
</dt>
<dd>
2021
</dd>
</dl>
</div>
</section>
<section id="wysiwyg" class="portfolio-group">
<h1 id="wysiwyg">WYSIWYG</h1>
<p>Projet de recherche sur l’évolution des logiciels de graphisme en
Suisse et en France (1980 - aujourd’hui)</p>
<figure>
<img src="images/wysiwyg.png" alt="." />
<figcaption aria-hidden="true">.</figcaption>
</figure>
<div class="details">
<dl>
<dt>
URL
</dt>
<dd>
<a href="https://wysiwyg.ch/" target="_blank">wysiwyg.ch</a>
</dd>
</dl>
<dl>
<dt>
Secteur
</dt>
<dd>
Recherche
</dd>
</dl>
<dl>
<dt>
Client
</dt>
<dd>
HEAD – Genève, Haute école d’art et de design
</dd>
</dl>
<dl>
<dt>
Prestation(s)
</dt>
<dd>
Design, développement full-stack
Design et développement front-end
</dd>
</dl>
<dl>
@ -449,7 +521,7 @@
Prestation(s)
</dt>
<dd>
Design, développement front-end
Design et développement front-end
</dd>
</dl>
<dl>
@ -457,8 +529,7 @@
Partenaire(s)
</dt>
<dd>
en collaboration avec Benjamin Benjamin Gremillon et l’équipe du
médialab
en collaboration avec Benjamin Gremillon et l’équipe du médialab
</dd>
</dl>
<dl>
@ -474,7 +545,7 @@
<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 interface graphique en front-end pour l’édition du
intégrant une interface graphique en front-end pour l’édition du
contenu.</p>
<figure>
<img src="images/cultures-visuelles.png" alt="." />
@ -531,8 +602,58 @@
</dl>
</div>
</section>
<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>
<section id="flaash" class="portfolio-group">
<h1 id="decarb.one">Decarb.one</h1>
<h1 id="flaash">Flaash</h1>
<p>Site de la revue d’anticipation Flaash.</p>
<figure>
<img src="images/flaash-thematiques.png" alt="." />
@ -576,7 +697,7 @@
Partenaire(s)
</dt>
<dd>
en collaboration avec Studio Plastac
Studio Plastac (design)
</dd>
</dl>
<dl>
@ -589,12 +710,12 @@
</dl>
</div>
</section>
<section id="acau" class="portfolio-group">
<h1 id="acau">ACAU</h1>
<p>Site vitrine pour l’Agence Coopérative Architectes
Urbanistes.</p>
<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>
<figure>
<img src="images/acau.png" alt="." />
<img src="images/repenser-les-heros.png" alt="." />
<figcaption aria-hidden="true">.</figcaption>
</figure>
<div class="details">
@ -603,7 +724,7 @@
URL
</dt>
<dd>
<a href="https://www.acau-architectes.fr/" target="_blank">acau-architectes.fr/</a>
<a href="https://repenserlesheros.femis.fr/" target="_blank">repenserlesheros.femis.fr</a>
</dd>
</dl>
<dl>
@ -611,7 +732,7 @@
Secteur
</dt>
<dd>
Communication
Recherche
</dd>
</dl>
<dl>
@ -619,7 +740,7 @@
Client
</dt>
<dd>
Agence Coopérative Architectes Urbanistes
groupe de recherche de La Fémis / SACRe, PSL
</dd>
</dl>
<dl>
@ -627,23 +748,19 @@
Prestation(s)
</dt>
<dd>
Développement full-stack
</dd>
</dl>
<dl>
<dt>
Partenaire(s)
</dt>
<dd>
Plastac (design)
Design et développement full-stack
</dd>
</dl>
<!-- <dl>
<dt>Partenaire(s)</dt>
<dd>en collaboration avec Benjamin Benjamin Gremillon et l’équipe du médialab</dd>
</dl> -->
<dl>
<dt>
Date
</dt>
<dd>
2024
2021
</dd>
</dl>
</div>