Un développeur avait besoin d'une interface minimaliste, rapide, native Windows. Pas de temps pour des itérations longues, pas de budget pour des features superflues.
PowerOFF.
Un utilitaire Windows.
Livré en deux jours.
Timer minuteur d'arrêt automatique pour PC. Sprint design + dev en collaboration continue avec un développeur. Open source, gratuit, sans publicités.
Composants WinUI natifs, dark mode unique, exécution parallèle. Le dev code l'app, je code la landing en parallèle. Workflow Figma → code → IA → personnalisation.
Open source, gratuit, sans publicités. Interface native Windows, zéro courbe d'apprentissage, lancement GitHub immédiat.
01
Brief
Un timer. Un écran. Pas plus.
Le besoin tient en une phrase : programmer l'arrêt d'un PC sans cliquer dans dix menus. L'utilisateur définit un timer ou une heure, choisit l'action (arrêt, redémarrage, veille), valide. C'est tout. Le piège classique aurait été de transformer ça en mini-app avec onboarding, profil utilisateur, paramètres avancés. Refus.
02
Décisions
Trois décisions pour livrer en deux jours.
La vitesse n'est pas un accident, c'est une suite de choix. Trois décisions ont permis de couper le scope sans couper la qualité.
Composants WinUI natifs.
Approche classique
Bibliothèque UI custom
Composants maison, plus de contrôle design mais 3-4× plus de temps d'implémentation.
PowerOFF
Design system Windows intégré
Familiarité instantanée pour l'utilisateur, implémentation directe pour le dev.
Dark mode uniquement.
Approche classique
Light + Dark
Deux thèmes à designer, deux à tester, deux à maintenir. +50% de travail.
PowerOFF
Dark only, assumé
L'app tourne sur un PC, souvent le soir. Le dark s'aligne sur l'usage réel.
Exécution parallèle.
Approche classique
Design → Dev → Landing
Séquentiel. Chaque étape attend la précédente. Goulots d'étranglement garantis.
PowerOFF
Dev || Landing IA → personnalisation
Le dev code l'app pendant que je génère la landing avec l'IA puis la personnalise en HTML/CSS/JS.
03
Workflow
Trois temps. Deux personnes. Aucun goulot.
Le sprint tient grâce à un workflow strictement parallèle : pas d'attente, pas de handoff formel, pas de goulot. Pendant que le dev code l'app .NET, je code la landing en HTML/CSS/JS. On se synchronise en continu sur Discord.
Sprint en 3 temps
-
01
Design Figma
Jour 1. UI sur Figma, composants WinUI natifs, dark mode unique. Décisions de scope envoyées au dev en continu.
-
02
Dev || Landing IA
Jours 1-2. Le dev implémente l'app .NET pendant que je génère la landing avec l'IA puis la personnalise en HTML/CSS/JS. Travail 100% parallèle.
-
03
Lancement GitHub
Jours 2-3. Documentation, page GitHub, release open source. Aucune phase de « QA + bugfixes » parce qu'on a testé en continu.
04
Interface
Cyan sur noir. Familier sur Windows.
Une palette qui s'efface devant la fonction. Le cyan vibrant pour signaler l'action, le noir profond pour ancrer dans l'écosystème Windows. Trois niveaux typographiques en Segoe UI, la police système, choix logique pour rester natif.
Palette
Typographie
Titre · Segoe UI 32/40 · Semibold
PowerOFF
Timer · Segoe UI Light 48/56
01:30:00
Body · Segoe UI 14/20 · Regular
Segoe UI parce que c'est la police système Windows. Choix logique pour rester natif. Pas de download, pas de FOIT, pas de friction.
05
Implémentation
Deux écrans dans l'app. Une landing pour porter l'open source.
Trois livrables visibles : la configuration et le décompte côté app Windows, plus la landing qui sert de vitrine open source pour l'adoption GitHub.
Configuration
2 écrans · paramétrage
Tout sur un seul écran.
- Sélecteur d'action (arrêt / redémarrage / veille) en haut, timer en dessous, CTA en bas. Flow linéaire, lisible en 2 secondes.
- Composants WinUI natifs pour une familiarité instantanée côté utilisateur Windows, et zéro courbe d'apprentissage.
- Pas d'onboarding, pas de tutoriel. L'app fait exactement ce qu'elle dit.
Feedback
1 écran · décompte
Le compte à rebours en grand.
- Compteur géant en Segoe UI Light 48px, visible à travers la pièce. Pas besoin de revenir voir.
- Bouton d'annulation toujours visible : réversibilité immédiate, zéro stress.
- Cyan vibrant pour signaler que l'action est en cours, pas qu'elle a échoué.
Distribution
1 page · open source
Une landing pour porter l'adoption.
- Génération initiale par IA (structure + premier draft de copy), puis personnalisation HTML/CSS/JS pour le ton et l'identité visuelle.
- Hébergée sur GitHub Pages : zéro coût d'infra, déploiement immédiat depuis le repo.
- Même direction artistique que l'app (cyan sur noir) pour la cohérence visuelle entre vitrine et produit.
06
Bilan
Deux jours. Un sprint à deux.
Sprint design + dev en collaboration continue avec Thomas .P. Voici ce qui a été livré, ce qui a marché dans la méthode, et ce que je referais autrement.
App Windows + landing + GitHub.
- UI Figma complète (configuration + décompte)
- Landing page (IA + personnalisation HTML/CSS/JS)
- Page GitHub avec documentation
- Lancement open source, gratuit, sans publicités
L'exécution parallèle paye.
- Composants natifs = vitesse. Réutiliser le DS Windows a divisé le temps d'implémentation par 3.
- Dev || Landing IA en parallèle. Pas d'attente, pas de goulot. On s'envoyait des updates en continu.
Un test utilisateur, même rapide.
- Aucun test avant le ship. Pour un outil aussi simple ça passe, mais 15 minutes avec 2-3 personnes auraient validé que le sélecteur d'action est bien compris.
- Light mode oublié. Décision assumée mais quelques retours users sur GitHub demandent le light. À ajouter en v2.
Un projet similaire en tête ?
Envoyez-moi un brief, même 3 lignes. Je vous réponds personnellement sous 24h.