Tairo

Un système de dashboards pour Nuxt, bâti sur Shuriken UI et Tailwind v4. Des centaines de pages prêtes — banque, transactions, commerce, lifestyle — qui doivent former un seul produit, livrable sans rien redessiner.

Design systemInterface produitSite web

ClientCss Ninja

Année2025

RôleDesign produit

DuréeEn cours

Demander un audit ↗Parler d’un projet similaire

La page d’accueil : une promesse, une action, et les composants qui font la démonstration.

Détails du projet

TypeSystème de dashboards · UI kit

SecteurOutils pour développeurs · templates admin

ClientCss Ninja

RôleDesign produit et système d’interface

Année2025

DuréeEn cours

StatutLivré · produit commercial

LivrablesJeu de pages, coques de layout, interface de docs

Polices

KarlaInter

Couleurs

Réalisé avec

Nuxt

Vue

TypeScript

Tailwind CSS

Figma

Bâti sur Shuriken UI : Tairo ajoute les layouts, le jeu de pages et les formes de données, et hérite des contrats de composants au lieu de les restyler.

Le besoin

Des centaines de pages qui ne doivent pas avoir des centaines d’auteurs.

Un kit de dashboards vit ou meurt sur sa cohérence. L’acheteur ouvre cinq pages au hasard : si la barre latérale se comporte autrement, si les cartes ont trois rayons différents et si un écran est plus dense que les autres, l’ensemble devient un paquet de templates au lieu d’un système. Tairo couvre banque, transactions, finance, commerce et lifestyle — des données vraiment différentes — et chaque page devait avoir l’air dessinée par la même main, le même après-midi.

Ce que j’ai fait

Coque

Une seule coque pour tout : rail d’icônes, liste de sections dépliable, colonne de contenu, colonne de droite pour le contexte. Passer d’une page bancaire à une page sport change le centre, jamais le mobilier.

Pages

Chaque domaine reçoit les écrans qui lui sont propres — solde, quickview, virements, dépenses — plutôt que le même dashboard avec d’autres libellés.

Parcours

Les tâches en plusieurs étapes, comme un virement, ont leur propre plein écran : rail d’étapes à gauche et récapitulatif avant l’action irréversible. Un kit sans parcours laisse le plus dur à l’acheteur.

Données

Les chiffres sont dessinés avec de vraies formes : un solde avec sa variation du jour, un graphique daté, un tableau de matchs avec lignes en direct et programmées. Aucun rectangle gris en guise de contenu.

Vente

La page marketing affiche le produit au lieu de le décrire — le mur de widgets est fait de composants réels : le premier écran et l’achat reposent sur la même preuve.