Projets/03 · Featured

Wastern.

SaaS de gestion des déchets pour le BTP français. Apprentissage en double rôle product designer + développeur front-end.

Année
2022 — 2024
Durée
Apprentissage · 2 ans
Client
Wastern
Secteur
BTP · Gestion des déchets
Rôle
Product Designer · Front-End
01Brief

Une industrie régulée, un workflow analogique.

Depuis 2022, les chantiers français doivent tracer numériquement chaque type de déchet produit. La plupart le font encore sur papier.

Wastern est le SaaS qui comble le gap : commander des bennes, suivre les flux, générer des BSD conformes, accéder à un annuaire de prestataires. Trois personas servis — promoteurs, entreprises BTP, collecteurs.

J'ai rejoint en apprentissage pendant deux ans, avec deux casquettes : product designer et développeur front-end.

02Le double rôle

Designer le matin, dev l'après-midi.

La frontière entre design et code n'existait pas dans cette équipe. À la fin, je pouvais aller d'une interview utilisateur à une feature livrée sans changer d'outil.

Apprentissage
2 ans
DESIGNER + DEV · TEMPS PLEIN · PARIS
Rôles
2
DESIGNER · FRONT-END
Surfaces
App + Web
REACT · WEBFLOW
Conformité
BSD
TRACKDÉCHETS
03Design

Designé pour des casques, pas pour des designers.

Les utilisateurs Wastern portent des gants. Ils utilisent l'app sur chantier, en plein soleil, souvent avec de la poussière de béton sur leur téléphone.

Les contraintes étaient sans pitié :

  • Tap targets à 56px+ (les gants n'ont pas de bouts de doigts)
  • Haut contraste partout (le soleil tue les gris)
  • Hiérarchie number-first (les opérateurs s'intéressent aux mètres cubes)
  • Actions single-tap pour le workflow 80%

J'ai construit un design system utilitaire dans Figma — tokens, composants, documents BSD, pills de statut. Chaque écran passait le test des gants.

04Front-end

App React + site Webflow, une seule marque.

Mêmes assets brand, deux écosystèmes — gardés en sync en traitant le design system comme la source de vérité.

Stack & Architecture
App
  • React
  • TypeScript
  • Tailwind
  • shadcn/ui
Site
  • Webflow
  • HubSpot CMS
  • Forms API
Conformité
  • TrackDéchets API
  • Générateur BSD
  • Export PDF
Design
  • Figma
  • Design tokens
  • Brand kit
05Résultats

Ce qui a été livré.

Personas servis
3
PROMOTEURS · BTP · COLLECTEURS
Conformité
BSD
TRACKDÉCHETS NUMÉRIQUE
Touchpoints
2
APP REACT · SITE WEBFLOW
Apprentissage
2 ans
DESIGNER + DEV
06Ce que j'ai appris

Là où le design s'arrête, le code commence. Puis tout se brouille.

Deux ans d'apprentissage m'ont donné ce qu'aucun rôle senior n'aurait pu : le temps de me planter, d'itérer, et de reconstruire des choses from scratch — plusieurs fois. Si je suis un hybride designer-dev aujourd'hui, c'est parce que Wastern m'a laissé le devenir.

La ligne artificielle entre design et code n'est qu'une description de poste. Quand tu owne les deux, la boucle de feedback se resserre et le produit devient meilleur.

↳ Wastern · 2022 — 2024