Transport et logistique
Poste 4
Un logiciel d’expédition sur mesure, mis en scène en 3D : on pèse le colis, on le mesure, l’outil choisit le transporteur et imprime l’étiquette.
- Projet
- Interne, sans client
- Année
- 2026
- Durée
- Une semaine
- Direction artistique
- Louis Prochwicz
- Développement et 3D
- Enzo Delamarre, Louis Prochwicz
- Outils
- Figma, React, Three.js
Le cadre
Un projet interne, montré en entier.
Poste 4 est le poste d’expédition de Ficelle, une marque de vente en ligne imaginée pour l’occasion : il n’a pas de client, et les noms, adresses, prix et transporteurs de la démo sont inventés. Le poste, lui, fonctionne de bout en bout, dans le navigateur, au clavier ou à la souris. On l’a construit pour montrer ce que devient un écran métier quand on le dessine avec le soin d’un produit grand public.
Le contexte
Le poste d’expédition,
là où tout se joue.
Un poste d’expédition traite des centaines de colis par jour, et une erreur de poids ou de transporteur se paie plus tard. On voulait une application logistique crédible pour l’opérateur, et lisible pour qui la découvre.
Le parti pris
L’outil et le décor
racontent la même chose.
Ce que dit l’écran se passe au même moment dans l’entrepôt : le carton arrive sur la balance, le panneau demande le poids ; on survole un transporteur, son quai s’allume. Une lumière de maquette, des matières mates, rien de gratuit.
L’entrepôt
Un site dessiné
d’après du matériel existant.
Trois postes, une machine d’emballage et son robot, des racks, un convoyeur de tri, quatre quais. Chaque machine reprend un équipement existant, et rien n’est figé : le robot apporte un carton, les camions partent à l’heure.
L’interface
Un panneau,
quatre étapes.
Une interface métier en quatre étapes, une seule active à la fois. Le cadre s’ajuste en douceur d’une étape à l’autre, sans jamais faire sauter la page.
- 01
Poids
Saisi au clavier avec le format, repris par l’écran de la balance.
- 02
Mesure
Le portique mesure le carton au passage, au millimètre.
- 03
Transporteur
Une recommandation, avec sa raison en une phrase.
- 04
Étiquette
Posée sur le carton, prête en PDF, le colis part vers son quai.
Le cœur de l’outil
Le bon transporteur,
avec sa raison.
Le choix du transporteur est automatique : le moins cher parmi ceux qui tiennent le délai promis, puis le moins émetteur. L’option recommandée donne sa raison ; les autres restent à portée de flèche.
Le clavier d’abord
Tout au clavier,
et chaque touche à l’écran.
Un opérateur ne lâche pas son clavier. Chaque touche a son bouton à l’écran, et chaque bouton affiche sa touche.
- 0à9
- Saisir le poids
- SMLX
- Choisir le format
- Entrée
- Valider l’étape
- ←→
- Changer de transporteur
- Espace
- Mettre en pause
- V
- Vue d’ensemble
- B
- Bilan du poste
Le système
Un système court,
appliqué partout.
Des angles droits, une palette courte, une seule famille de caractères. La scène 3D reprend exactement la même palette.
- EncreTexte, aplats actifs#000000
- GraphiteMachines, contrastes#3D3D3D
- PanneauFonds de l’interface#E9E9E7
- PapierCartes, étiquettes#FFFFFF
- SignalCe qui demande l’attention#FC6907
- ÉconomieCe qui fait gagner de l’argent#007C45
- KraftLes cartons, seule exception#E6D5BD
Les détails
Ce qu’on ne remarque pas
tout de suite.
Une étiquette par colis
Au format 10 × 15 cm, avec code-barres et QR code : la même sur le carton en 3D et dans le PDF.
Le son suit la caméra
De près, on entend la balance, le portique et l’étiqueteuse. Vu du dessus, tout s’éloigne.
Une démo qui se joue seule
Trente secondes sans geste et elle enchaîne les colis. Le moindre geste rend la main.
Fluide partout
La scène ne se redessine que lorsqu’elle bouge, et baisse sa résolution si l’ordinateur peine.
Ce que ça montre
La même méthode,
pour vos outils.
Poste 4 n’a pas de client : c’est un terrain d’essai, et un aperçu de ce qu’on fait pour des équipes logistiques et e-commerce. Comprendre un métier précis, en tirer une interface qui va vite, et la mettre en scène sans la trahir.
Un outil interne
L’écran de vos équipes, pensé pour la cadence et pour le clavier.
Une démo commerciale
Votre métier montré à un client ou à un investisseur, en deux minutes.
Un parcours de formation
Une recrue qui comprend le poste avant d’y être.
Une borne de salon
Un objet qu’on pilote sur un stand, et dont on se souvient.
Les services
Les services derrière Poste 4.
Ce qu’on a mis en œuvre ici, et ce que chaque service fait pour vous.
- Applications sur mesureL’interface du poste et sa scène 3D, pensées pour la cadence et le clavier.Découvrir
- Ponts entre logicielsSur un projet réel : commandes, transporteurs et étiquettes reliés par leurs API.Découvrir
- Automatisation des tâchesLe choix du transporteur et l’étiquette, sans rien ressaisir.Découvrir
Catalogue
Les autres outils.
Questions fréquentes
Ce qu’on nous demande
sur ce projet.
Non : Poste 4 est un projet interne de Raneo, une démonstration sans client. La marque (Ficelle), les commandes, les prix et les transporteurs sont inventés. Ce qu’on propose, c’est de construire l’équivalent pour vous, sur mesure : un poste d’expédition ou un autre écran métier, relié à vos logiciels, livré avec son code dans un dépôt à votre nom.
Oui, la démo s’ouvre dans le navigateur, sans installation ni inscription. On y traite des colis au clavier ou à la souris : poids, mesure sous le portique, choix du transporteur, étiquette. Laissée trente secondes sans geste, elle se joue d’elle-même. Elle est pensée pour un ordinateur : sur téléphone, mieux vaut regarder les visuels de cette page.
Non, ce sont des données de démonstration. Les tarifs des transporteurs, l’économie affichée, la cadence et le remplissage des camions sont calculés par la démo à partir de valeurs inventées. Ils servent à montrer comment l’outil présente une décision, pas à promettre un résultat. Sur un projet, ces chiffres viennent de vos contrats transporteurs et de vos commandes.
Pour qu’on comprenne le métier en le pilotant. La 3D montre ce que l’écran décide : le carton sur la balance, les cotes du portique, le quai qui s’allume. Pour un outil interne, l’interface seule suffit souvent ; la mise en scène sert surtout aux démos commerciales, aux formations et aux salons, là où il faut expliquer un poste en deux minutes.
Figma pour le design, React et TypeScript pour l’interface, Three.js pour la scène 3D temps réel, le tout dans le navigateur, sans installation. La scène ne se redessine que lorsqu’elle bouge et baisse sa résolution si l’ordinateur peine. Ce sont les mêmes outils que pour nos applications sur mesure, avec la 3D en plus quand le projet la demande.
Une semaine, à deux : Louis Prochwicz à la direction artistique, Enzo Delamarre et Louis au développement et à la 3D. Un projet pour une entreprise demande plus de temps, parce qu’il faut d’abord comprendre ses règles, la relier à ses logiciels et tester sur ses propres données : les délais type sont sur les pages services.
Oui, c’est ce qu’on fait sur un projet réel : le poste lit les commandes dans votre outil de gestion ou votre boutique, interroge les transporteurs par leurs API et imprime leurs étiquettes. Raneo, agence d’automatisation et d’IA basée à Rennes, vérifie pendant le diagnostic ce que vos logiciels et vos transporteurs permettent, avant de vous donner un prix fixe.