mirror of
https://old.git.ood.ovh/flambyte/RUX.git
synced 2025-07-04 02:16:20 +02:00
refacto(all): Rebuild website on my standards
This commit is contained in:
parent
9d197e1363
commit
c56c4138e3
3 changed files with 134 additions and 165 deletions
162
index.html
162
index.html
|
@ -44,98 +44,70 @@
|
|||
|
||||
<body data-theme="light">
|
||||
<header>
|
||||
|
||||
<button class="js-theme-trigger">
|
||||
<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd">
|
||||
<path
|
||||
d="M13 9h9l-14 15 3-9h-9l14-15-3 9zm-8.699 5h8.086l-1.987 5.963 9.299-9.963h-8.086l1.987-5.963-9.299 9.963z" />
|
||||
</svg></button>
|
||||
|
||||
<div class="header--second">
|
||||
|
||||
|
||||
<div class="btn__lightdark--blockd">
|
||||
|
||||
<nav class="header--nav">
|
||||
<ul class="header--nav--list">
|
||||
<li>
|
||||
<a href="#synopsis">Synopsis</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#team_building">Création de l'Équipe</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#premices">Prémices</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#ebauche">Ébauche</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#entretiens">Guide d'entretien</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#tasks">Top Task & fonctions</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#audits">Audits</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#journey">User Journey</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#croquis">Croquis</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#integration">Intégration</a>
|
||||
</li>
|
||||
<li>
|
||||
<button class="js-theme-trigger" alt="theme switcher">
|
||||
<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd"
|
||||
clip-rule="evenodd">
|
||||
<path
|
||||
d="M13 9h9l-14 15 3-9h-9l14-15-3 9zm-8.699 5h8.086l-1.987 5.963 9.299-9.963h-8.086l1.987-5.963-9.299 9.963z" />
|
||||
</svg>
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<section class="headback">
|
||||
<div class="fond">
|
||||
<img class="headtitle" src="assets/images/headlogo.png"
|
||||
alt="illustration portant les initiales de l'atelier Rethinking User Experience. RUX">
|
||||
</div>
|
||||
<div class="header__navigation">
|
||||
|
||||
<nav>
|
||||
|
||||
<ul class="list--header">
|
||||
<li>
|
||||
<a class="link" href="#partie0">0</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a class="link" href="#partie1">1</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="link" href="#partie2">2</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a class="link" href="#partie3">3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="link" href="#partie4">4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="link" href="#partie5">5</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="link" href="#partie6">6</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="link" href="#partie7">7</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="link" href="#partie8">8</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="link" href="#partie9">9</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</nav>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</section>
|
||||
</header>
|
||||
|
||||
<div class="headback">
|
||||
<div class="fond">
|
||||
<img class="headtitle" src="assets/images/headlogo.png"
|
||||
alt="illustration portant les initiales de l'atelier Rethinking User Experience. RUX">
|
||||
</div>
|
||||
</div>
|
||||
<section class="grid grid--content" id="partie0">
|
||||
<div id="strips" alt="decotration: lignes rose en diagonales">
|
||||
<div class="strip strip--1"></div>
|
||||
<h1 class="title mgrid-start01 mgrid-end08 tgrid-start02 tgrid-end05 dgrid-start01 dgrid-end07"><span
|
||||
class="number-nav">0 </span>Synopsis
|
||||
</h1>
|
||||
<p class="mgrid-start01 mgrid-end04 tgrid-start02 tgrid-end05 dgrid-start02 dgrid-end05 partie1_blackfill">
|
||||
L’atelier RUX (rethinking UX)
|
||||
est de
|
||||
réaliser une interface adaptée et
|
||||
compréhensible pour
|
||||
l’utilisateur, pour une
|
||||
navigation facile et rapide”</p>
|
||||
<div class="strip strip--2"></div>
|
||||
<p class="mgrid-start02 mgrid-end05 tgrid-start02 tgrid-end05 dgrid-start03 dgrid-end05 partie1_blackfill">Le
|
||||
directeur de la Haute école
|
||||
Albert Jacquard nous à
|
||||
donner une mission ! </p>
|
||||
<div class="strip strip--3"></div>
|
||||
<p class="mgrid-start01 mgrid-end04 tgrid-start02 tgrid-end05 dgrid-start02 dgrid-end05 partie1_blackfill">
|
||||
Repenser notre cours de récré
|
||||
</p>
|
||||
<p class="mgrid-start01 mgrid-end04 tgrid-start02 tgrid-end05 dgrid-start03 dgrid-end05 partie1_blackfill">Notre
|
||||
</div>
|
||||
<section class="grid" id="synopsis">
|
||||
<h2>Synopsis</h2>
|
||||
<p>L’atelier RUX (rethinking UX) est de réaliser une interface adaptée et compréhensible pour l’utilisateur,
|
||||
pour une navigation facile et rapide”</p>
|
||||
<p>Le directeur de la Haute école Albert Jacquard nous à donner une mission ! </p>
|
||||
<p>Repenser notre cours de récré</p>
|
||||
<p>Notre
|
||||
budget est limité à
|
||||
200k€
|
||||
+- </p>
|
||||
<div class="strip strip--cash"></div>
|
||||
200k€ ±</p>
|
||||
<figure class="img__content tgrid-start02 tgrid-end05 dgrid-start02 dgrid-end03">
|
||||
<img class="image_undertxt image_undertxt--iv" src="assets/images/plancour.png"
|
||||
srcset="assets/images/plancour@2x.png 2x"
|
||||
|
@ -148,7 +120,7 @@
|
|||
<figcaption class="figcaption">Photo prise de la cour "plan large"</figcaption>
|
||||
</figure>
|
||||
</section>
|
||||
<section class="grid" id="partie1">
|
||||
<section class="grid" id="team_building">
|
||||
<h2 class="title mgrid-start01 mgrid-end04 tgrid-start02 tgrid-end05 dgrid-start01 dgrid-end07"><span
|
||||
class="number-nav">1 </span>Création
|
||||
de l'Équipe</h2>
|
||||
|
@ -163,7 +135,7 @@
|
|||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
<section class="grid section__color section__color--pink" id="partie2">
|
||||
<section class="grid section__color section__color--pink" id="premices">
|
||||
<h2 class="title mgrid-start01 mgrid-end07 tgrid-start02 tgrid-end05 dgrid-start01 dgrid-end07"><span
|
||||
class="number-nav">2 </span>Prémices
|
||||
</h2>
|
||||
|
@ -184,7 +156,7 @@
|
|||
faire plus élégant.
|
||||
</p>
|
||||
</section>
|
||||
<section class="grid section__color section__color--green" id="partie3">
|
||||
<section class="grid section__color section__color--green" id="ebauche">
|
||||
<h2 class="title mgrid-start01 mgrid-end04 tgrid-start02 tgrid-end05 dgrid-start01 dgrid-end07"><span
|
||||
class="number-nav">3 </span>Prémices
|
||||
bis</h2>
|
||||
|
@ -217,7 +189,7 @@
|
|||
lieux d’exposition, déco des murs, activités, zone de
|
||||
lecture. Distribution des diplômes. Lieu de concert. Boîte à livres. </p>
|
||||
</section>
|
||||
<section class="grid" id="partie4">
|
||||
<section class="grid" id="entretiens">
|
||||
<h2 class="title mgrid-start01 mgrid-end04 tgrid-start02 tgrid-end05 dgrid-start01 dgrid-end07"><span
|
||||
class="number-nav">4 </span>Guide
|
||||
d'entretien</h2>
|
||||
|
@ -299,7 +271,7 @@
|
|||
<figcaption class="figcaption">Une de nos plus belles interview</figcaption>
|
||||
</figure>
|
||||
</section>
|
||||
<section class="grid section__color section__color--blue" id="partie5">
|
||||
<section class="grid section__color section__color--blue" id="tasks">
|
||||
<h2 class="title mgrid-start01 mgrid-end04 tgrid-start02 tgrid-end05 dgrid-start01 dgrid-end07"><span
|
||||
class="number-nav">5 </span>Top Task
|
||||
& fonctions</h2>
|
||||
|
@ -317,7 +289,7 @@
|
|||
<figcaption class="figcaption">On avait droit à 3 votes maximum.😇</figcaption>
|
||||
</figure>
|
||||
</section>
|
||||
<section class="grid section__color section__color--pink" id="partie6">
|
||||
<section class="grid section__color section__color--pink" id="audits">
|
||||
<h2 class="title mgrid-start01 mgrid-end04 tgrid-start02 tgrid-end05 dgrid-start01 dgrid-end07"><span
|
||||
class="number-nav">6 </span>Audits
|
||||
</h2>
|
||||
|
@ -387,7 +359,7 @@
|
|||
</div>
|
||||
|
||||
</section>
|
||||
<section class="grid section__color section__color--green" id="partie7">
|
||||
<section class="grid section__color section__color--green" id="journey">
|
||||
<h2 class="title mgrid-start01 mgrid-end04 tgrid-start02 tgrid-end05 dgrid-start01 dgrid-end07"><span
|
||||
class="number-nav">7 </span>User
|
||||
Journey</h2>
|
||||
|
@ -409,7 +381,7 @@
|
|||
srcset="assets/images/user3@2x.png 2x" loading="lazy" decoding="async"></li>
|
||||
</ul>
|
||||
</section>
|
||||
<section class="grid section__color section__color--blue" id="partie8">
|
||||
<section class="grid section__color section__color--blue" id="croquis">
|
||||
<h2 class="title mgrid-start01 mgrid-end04 tgrid-start02 tgrid-end05 dgrid-start01 dgrid-end07"><span
|
||||
class="number-nav">8 </span>Croquis
|
||||
</h2>
|
||||
|
@ -476,7 +448,7 @@
|
|||
<p class="mgrid-start01 mgrid-end04 dgrid-start03 dgrid-end04">Un couteau à bois, des vis des roulettes et le
|
||||
plus beau rondin de bois suffit à créer un tabouret mobile !</p>
|
||||
</section>
|
||||
<section class="grid" id="partie9">
|
||||
<section class="grid" id="integration">
|
||||
<h2 class="title mgrid-start01 mgrid-end04 tgrid-start02 tgrid-end05 dgrid-start01 dgrid-end07"><span
|
||||
class="number-nav">9
|
||||
</span>Intégration</h2>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue