Les distractions numériques ne sont plus un simple problème de discipline : elles deviennent un coût direct pour les entrepreneurs, freelances et créateurs. Un onglet ouvert « cinq minutes », une notification LinkedIn, un détour par X ou une boîte Gmail consultée machinalement peuvent fragmenter toute une matinée de travail. Concevoir sa propre extension Chrome avec Claude permet de remplacer ce réflexe par un système pensé pour ses priorités réelles.
L’objectif n’est pas de créer un outil spectaculaire ou de devenir développeur du jour au lendemain. Il s’agit de bâtir un garde-fou simple, local et personnalisable : des sites bloqués à certaines heures, un objectif affiché à la place d’un fil d’actualité, un minuteur de focus et une friction volontaire quand l’envie de contourner les règles apparaît. Avec Claude Code, l’intention devient le point de départ ; le code vient ensuite servir cette stratégie.
En bref
- Une extension Chrome sur mesure répond plus précisément à tes habitudes qu’un bloqueur générique téléchargé en quelques clics.
- Manifest V3 constitue la structure actuelle à adopter pour créer une extension moderne, stable et compatible avec Chrome.
- declarativeNetRequest permet de filtrer certains domaines directement dans le navigateur, sans alourdir la navigation.
- chrome.storage.local garde tes objectifs, listes de blocage et sessions de concentration sur ton ordinateur.
- Claude Code accélère la création, la correction et les tests, à condition de lui fournir un cahier des charges clair.
| Peu de temps ? Voici l’essentiel : |
|---|
| Définis un seul problème concret : éviter les réseaux sociaux pendant une plage de travail précise. |
| Construis une extension Manifest V3 minimale avec un manifest, un service worker, une popup et une page de redirection. |
| Bloque les domaines au niveau réseau et conserve les paramètres avec chrome.storage.local. |
| Teste les contournements avant de faire confiance à ton propre système de concentration. |
Créer une extension Chrome avec Claude pour reprendre le contrôle de son attention
Le sujet n’est pas seulement technique. Il touche directement à l’organisation du travail et à la qualité des décisions. Plusieurs études sur les usages numériques montrent qu’une large part des actifs reconnaît perdre plusieurs heures chaque jour à cause des interruptions, des messages et de la navigation non intentionnelle. Le chiffre exact varie selon les enquêtes, mais le constat reste solide : l’attention est devenue une ressource rare, et les plateformes sont conçues pour la capter.
Imagine Léa, consultante indépendante. Son objectif du matin est clair : finaliser une proposition commerciale importante avant midi. Pourtant, elle ouvre Chrome pour vérifier une information, passe par LinkedIn « pour répondre à un contact », voit une publication, consulte son fil, puis se retrouve vingt minutes plus tard sur trois sujets sans lien avec sa mission. Le problème n’est pas son ambition. Son environnement de travail ne protège pas son ambition.
Une extension développée avec Claude peut devenir cette protection. Plutôt que d’installer un bloqueur standard rempli d’options inutiles, Léa peut concevoir une solution adaptée à ses déclencheurs : blocage de LinkedIn, X, YouTube et certains sites d’actualité de 8 heures à midi ; redirection vers une page affichant « Finaliser la proposition pour le client Atlas » ; bouton d’activation du mode focus ; bilan rapide en fin de session.
Pourquoi un outil personnalisé est plus efficace qu’un bloqueur générique
Les extensions du Chrome Web Store sont pratiques, mais elles imposent souvent leur logique. Certaines reposent sur un abonnement, synchronisent des données à distance ou ajoutent des fonctionnalités qui créent plus de réglages que de résultats. Une extension personnelle fonctionne à l’inverse : elle part de tes comportements et de tes objectifs, pas d’un modèle standardisé.
Cette précision compte. Une créatrice de contenu peut vouloir bloquer les réseaux sociaux pendant l’écriture, tout en gardant Instagram accessible entre 16 heures et 17 heures pour publier et répondre à sa communauté. Un commercial peut maintenir LinkedIn disponible le matin pour sa prospection, mais le désactiver pendant les rendez-vous ou la préparation des propositions. Le bon outil n’est pas celui qui bloque tout : c’est celui qui protège la bonne activité au bon moment.
Le bénéfice est également stratégique. Créer un outil minimum viable pour sa propre productivité oblige à identifier les frictions réelles. Quels sites provoquent les détours ? À quelles heures l’attention baisse-t-elle ? Quelles tâches importantes sont régulièrement repoussées ? Cette observation ressemble à une analyse marketing : avant d’optimiser un tunnel de vente, il faut comprendre où les visiteurs décrochent. Ici, le « tunnel » est ton propre parcours de travail.
Claude Code réduit la barrière du développement sans supprimer la réflexion
Claude Code peut générer l’ossature d’une extension, expliquer un message d’erreur et proposer des corrections à partir d’instructions en langage naturel. Cela ne signifie pas qu’il faut déléguer toute décision. La valeur vient de la combinaison : une intention métier claire, une demande structurée et une validation attentive de chaque fonctionnalité.
Un prompt vague comme « crée-moi une extension de productivité » produit un résultat vague. À l’inverse, une demande précise donne une base exploitable : « Crée une extension Chrome Manifest V3 qui bloque linkedin.com, x.com et youtube.com de 8 heures à midi du lundi au vendredi. Quand une URL est bloquée, redirige vers une page locale affichant l’objectif stocké par l’utilisateur. Ajoute une popup pour modifier l’objectif, les domaines et les horaires. Aucune donnée ne doit être envoyée à un serveur externe. »
Cette façon de travailler permet aussi de découvrir des usages connexes de l’IA dans une activité. Pour mieux comparer les environnements et les méthodes de travail, un détour par les agents IA et leurs cas d’usage concrets aide à distinguer l’assistance ponctuelle de l’automatisation réellement utile. L’extension n’est pas un gadget : elle devient une petite infrastructure personnelle au service d’un objectif mesurable.
Une concentration durable ne dépend pas d’une volonté héroïque : elle dépend surtout d’un environnement qui rend la distraction moins accessible que l’action utile.
Architecture Manifest V3 : les fondations d’une extension Chrome de concentration
Pour construire une extension robuste, il faut comprendre les quelques pièces qui travaillent ensemble. Chrome impose aujourd’hui l’architecture Manifest V3, conçue pour renforcer la sécurité, limiter les traitements permanents et mieux encadrer les permissions accordées par l’utilisateur. Cette contrainte est une bonne nouvelle : elle pousse à développer des outils plus sobres et plus transparents.
Le premier fichier est manifest.json. Il agit comme une carte d’identité et un tableau de bord. Il indique le nom de l’extension, sa version, les icônes éventuelles, les permissions demandées et les fichiers qui composent le projet. Sans lui, Chrome ne sait pas quoi charger. Claude peut le rédiger rapidement, mais son contenu mérite une lecture attentive : une extension de concentration n’a pas besoin de permissions invasives si son rôle se limite au blocage de domaines, au stockage local et à l’affichage d’une interface.
| Composant | Rôle principal | Visibilité utilisateur |
|---|---|---|
| manifest.json | DĂ©clare la configuration et les permissions | Invisible |
| Service worker | Gère les règles, horaires et événements | Invisible |
| Popup | Permet de régler l’objectif et le mode focus | Visible |
| Script de contenu | Affiche un rappel sur certaines pages si nécessaire | Visible sur les pages ciblées |
| Page de redirection | Remplace un site bloqué par l’objectif prioritaire | Visible |
Le service worker : la tour de contrôle discrète
Dans Manifest V3, le script d’arrière-plan prend généralement la forme d’un service worker. Il ne tourne pas inutilement en permanence. Chrome l’active lorsqu’un événement l’exige, par exemple au démarrage du navigateur, lors d’un changement de configuration ou quand une alarme programmée se déclenche. Cette logique réduit la consommation de ressources.
Pour une extension de concentration, le service worker peut vérifier si une session est active, mettre à jour les règles de filtrage et déclencher une notification au début d’un créneau de travail. Léa pourrait recevoir à 8 heures un message très simple : « Session profonde active jusqu’à midi. Priorité : proposition Atlas. » Rien de plus. Un bon rappel n’essaie pas de divertir ; il remet l’action essentielle au centre.
Demande à Claude de commenter les parties importantes du code. Cette habitude est utile, même sans expérience de développement. Un commentaire clair sur le rôle d’une permission ou d’une fonction permet de modifier l’extension plus tard sans repartir de zéro. L’objectif n’est pas de devenir experte JavaScript en une journée, mais de rester propriétaire de son système.
La popup et la page de blocage : rendre la décision visible
La popup est la petite fenêtre accessible depuis l’icône de l’extension. Elle doit rester minimale. Trop de boutons, trop de statistiques et trop de couleurs recréent une distraction. Une interface efficace peut se contenter de quatre éléments : un champ pour l’objectif prioritaire, une liste de domaines, un choix d’horaires et un interrupteur pour activer ou suspendre le mode focus.
La page affichée après une tentative d’accès à un site bloqué a un rôle psychologique déterminant. Au lieu du message froid « site indisponible », elle peut afficher l’objectif écrit le matin, le temps restant dans la session et une action simple : « Retourner à l’onglet de travail ». Cette approche évite la culpabilisation. Elle crée un point de décision conscient.
Pour les créateurs qui travaillent souvent depuis des ressources en ligne, l’organisation de la veille mérite aussi un cadre. Savoir télécharger une vidéo Twitter en haute définition peut être utile pour archiver une référence ou analyser un contenu, à condition de le faire dans un créneau prévu. La différence entre une ressource de travail et une distraction ne dépend pas du site : elle dépend de l’intention définie avant de cliquer.
Une bonne architecture ne cherche pas à impressionner : elle rend la bonne décision plus facile à répéter.
Utiliser Claude Code pour créer une extension Chrome sans se perdre dans le code
Le véritable accélérateur n’est pas le fait d’écrire moins de code. C’est de réduire les allers-retours entre une idée et un prototype testable. Claude Code peut transformer une demande métier en arborescence de fichiers, proposer les contenus initiaux, identifier des incohérences et corriger les erreurs signalées par Chrome. Pour en tirer parti, il faut procéder avec méthode.
Commence par rédiger un mini cahier des charges. Pas un document de vingt pages. Une page suffit si elle répond à cinq questions : quel comportement veux-tu empêcher, quels sites sont concernés, à quels moments, quel message doit s’afficher et quelles données doivent rester enregistrées ? Cette étape évite le piège classique de l’outil trop ambitieux, construit pendant des heures puis abandonné parce qu’il est devenu compliqué.
La dictée vocale peut accélérer cette phase. Avec un outil comme Superwhisper ou la dictée native de ton système, il devient plus facile d’exprimer une situation réelle. Par exemple : « Quand j’essaie d’ouvrir YouTube, X ou LinkedIn entre 9 heures et 11 h 30, je veux être redirigé vers une page qui affiche ma priorité et un compte à rebours. Je veux pouvoir modifier la liste depuis une popup et sauvegarder le tout en local. » Cette formulation contient déjà les éléments techniques importants.
Un déroulé de prompt qui produit un projet exploitable
La première demande à Claude ne devrait pas exiger directement tout le code. Demande d’abord un plan. Cela te donne une occasion de vérifier la logique du projet avant de multiplier les fichiers. Une réponse cohérente doit mentionner le manifest, le service worker, la popup, la page de redirection, le stockage local et les permissions nécessaires.
- Décris le résultat attendu avec des exemples de sites, d’horaires et de messages visibles.
- Demande une architecture de fichiers et une explication courte du rĂ´le de chaque fichier.
- Valide la liste des permissions avant de générer le code complet.
- Fais créer une version minimale : un seul domaine bloqué, un objectif enregistré, une page de redirection.
- Ajoute les fonctions une par une : horaires, minuteur, statistiques locales, garde-fou anti-désactivation.
Cette progression protège contre l’effet tunnel. Quand une extension comporte dix fonctions dès le départ, il devient difficile de savoir quelle partie ne fonctionne pas. Avec une version minimale, chaque ajout est testable. C’est exactement le principe d’un lancement marketing intelligent : valider le message et le parcours avant de déployer une machine complexe.
Corriger les erreurs avec un dialogue précis
Quand Chrome refuse de charger l’extension, le message affiché dans la page des extensions est précieux. Copie-le dans Claude Code, avec le fichier concerné et le résultat attendu. Évite les demandes floues comme « ça ne marche pas ». Préfère : « Chrome affiche cette erreur au chargement du manifest. Voici son contenu. Corrige uniquement ce qui est nécessaire et explique la modification. »
Cette règle s’applique également aux problèmes d’interface. Si le bouton de sauvegarde ne conserve pas l’objectif après fermeture de Chrome, indique les étapes exactes : saisie dans la popup, clic sur enregistrer, fermeture du navigateur, réouverture, champ vide. Claude peut alors chercher la faille dans l’utilisation de chrome.storage.local plutôt que de modifier le projet au hasard.
La rigueur rédactionnelle aide aussi dans cette collaboration. Une demande bien formulée produit une réponse plus fiable, comme un brief client précis produit une meilleure campagne. Si tu veux renforcer cette compétence au quotidien, les outils présentés dans ce guide sur les correcteurs d’orthographe et d’écriture peuvent t’aider à clarifier tes prompts, tes messages clients et tes documents stratégiques.
Claude accélère l’exécution, mais c’est la précision de tes demandes qui transforme une idée en outil réellement utile.
Bloquer les distractions avec declarativeNetRequest et conserver ses objectifs en local
Le cœur technique de l’extension repose sur deux mécanismes complémentaires. Le premier filtre les accès indésirables. Le second mémorise ce qui donne du sens au blocage. Sans filtre, l’outil laisse les portes ouvertes. Sans objectif visible, il peut devenir une simple interdiction frustrante. L’efficacité vient de l’association des deux.
declarativeNetRequest est une API Chrome conçue pour appliquer des règles de réseau déclaratives. Concrètement, plutôt que d’intercepter chaque requête avec un script lourd, l’extension fournit à Chrome une liste de règles. Le navigateur applique ensuite le blocage ou la redirection de manière efficace. Pour un outil de concentration, une règle peut viser un domaine précis et diriger l’utilisateur vers une page interne de l’extension.
Construire une liste de blocage utile, sans bloquer son propre travail
La liste noire doit rester contextuelle. Bloquer Gmail toute la journée peut être contre-productif pour un entrepreneur qui attend des validations clients. En revanche, bloquer les fils d’actualité, les pages d’accueil de réseaux sociaux ou les plateformes vidéo pendant un bloc d’écriture peut faire une différence immédiate. Il faut distinguer l’outil nécessaire de l’usage réflexe.
Un système intelligent peut prévoir plusieurs profils. Le profil « Création » bloque les réseaux et les médias. Le profil « Prospection » laisse LinkedIn accessible, mais bloque les vidéos et les sites d’actualité. Le profil « Administration » autorise Gmail et les outils de facturation tout en limitant le reste. Claude peut générer cette logique progressivement, mais commence avec un seul profil afin de valider le comportement global.
Dans le cas de Léa, la première liste contient uniquement trois domaines qui déclenchent presque toujours une perte de temps. Après une semaine, elle observe que YouTube est souvent utilisé pour chercher des tutoriels légitimes. Plutôt que de supprimer totalement le blocage, elle crée une exception temporaire de quinze minutes depuis la popup. Le système ne doit pas devenir une prison : il doit soutenir une décision consciente.
Pourquoi chrome.storage.local protège la confidentialité et la continuité
Les objectifs, horaires, domaines bloqués et bilans de sessions peuvent être enregistrés avec chrome.storage.local. Les données restent alors liées au navigateur et à l’ordinateur. Elles ne partent pas sur un serveur externe simplement pour faire fonctionner l’extension. Cette approche est cohérente avec un outil de concentration : ce qui concerne tes priorités, tes habitudes et tes moments de faiblesse n’a pas besoin d’alimenter une régie publicitaire.
Le stockage local est particulièrement intéressant pour enregistrer trois éléments simples : l’objectif actif, la durée prévue et le nombre de sessions réalisées. Il ne s’agit pas de transformer la popup en tableau de bord anxiogène. Un historique sobre suffit : « quatre sessions de cinquante minutes cette semaine ». Ce repère valorise le progrès sans encourager la surveillance permanente.
Ajoute aussi l’API chrome.alarms pour automatiser les créneaux. À 8 h 30, l’extension active les règles prévues ; à 12 h 30, elle les suspend. Cette automatisation retire une micro-décision quotidienne. Or, la fatigue décisionnelle est réelle : plus tu dois penser à activer un mode focus, plus tu risques d’oublier au moment où tu en as le plus besoin.
Le blocage fonctionne lorsqu’il protège un engagement choisi, pas lorsqu’il ajoute une règle de plus à subir.
Tester et installer une extension Chrome anti-procrastination qui résiste aux contournements
Une extension n’est utile que si elle fonctionne dans les conditions réelles : quand la fatigue arrive, quand une tâche devient inconfortable ou quand l’envie de « juste vérifier quelque chose » se présente. La phase de test ne sert donc pas seulement à éliminer des bugs techniques. Elle vérifie aussi que le parcours résiste aux automatismes qui alimentent la procrastination.
Pour installer le projet localement, ouvre la page des extensions Chrome, active le mode développeur, puis choisis l’option permettant de charger une extension non empaquetée. Sélectionne le dossier qui contient ton manifest.json. L’icône apparaît dans la barre d’outils et Chrome affiche les éventuelles erreurs. Cette installation locale est idéale pour un usage personnel et pour les itérations rapides.
Teste ensuite les scénarios un par un. Active une session. Tente d’ouvrir le premier domaine bloqué dans un nouvel onglet. Vérifie que la page d’objectifs apparaît. Modifie l’objectif depuis la popup. Ferme puis rouvre Chrome. Confirme que le texte et les horaires sont toujours présents. Désactive la session et assure-toi que l’accès redevient possible. Ce protocole simple évite de déclarer l’outil terminé après un seul essai favorable.
Mettre en place des garde-fous sans tomber dans l’excès
Le principal adversaire de l’extension, c’est souvent son propre utilisateur. Si un clic suffit à désactiver le mode focus, la tentation peut gagner dans une période de stress. Une solution consiste à ajouter une friction maîtrisée. Par exemple, pour interrompre une session avant sa fin, l’utilisateur doit recopier une phrase spécifique : « Je choisis consciemment d’arrêter mon bloc de concentration. »
Cette méthode n’empêche pas de reprendre le contrôle en cas d’urgence. Elle oblige simplement à sortir du réflexe. C’est toute la différence. Le but n’est pas de punir, mais de créer une seconde de conscience entre l’impulsion et l’action. Léa peut toujours ouvrir LinkedIn si une situation l’exige ; elle doit seulement confirmer que cette décision est volontaire.
Il est aussi possible d’ajouter une pause planifiée. Après cinquante minutes, l’extension affiche un message invitant à se lever, respirer ou noter la prochaine action avant de faire une pause de dix minutes. Cette mécanique rend la concentration plus durable. Un système trop rigide finit souvent abandonné ; un rythme réaliste s’intègre dans une semaine chargée.
Utiliser Playwright pour vérifier les parcours critiques
Playwright est un outil d’automatisation qui peut simuler des actions dans un navigateur. Avec l’aide de Claude Code, il devient possible de préparer des tests qui ouvrent un site bloqué, vérifient la redirection, modifient un réglage dans la popup ou confirment que les données restent présentes après un redémarrage. Cette étape est particulièrement utile si l’extension évolue au fil des besoins.
Demande à Claude de proposer d’abord un plan de tests lisible. Les cas prioritaires sont évidents : domaine bloqué pendant une session active, domaine autorisé hors session, objectif correctement affiché, réglages sauvegardés, sortie anticipée soumise à la friction prévue. Chaque test représente une promesse faite à toi-même : l’outil sera là quand l’attention commencera à vaciller.
Cette logique de validation dépasse largement le cadre du navigateur. Les entrepreneurs qui réussissent à avancer ne cherchent pas la motivation parfaite chaque matin. Ils mettent en place des systèmes qui rendent le bon comportement plus simple que l’ancien réflexe. Ton extension Chrome peut devenir l’un de ces systèmes, discret mais déterminant.
Un outil de concentration fiable ne se mesure pas au nombre de fonctions : il se mesure à sa capacité à te ramener à l’essentiel au moment précis où tu pourrais t’en éloigner.
Faut-il savoir programmer pour créer une extension Chrome avec Claude ?
Non. Claude Code peut générer la structure, le code et les corrections à partir d’instructions claires. Il reste essentiel de définir précisément les comportements attendus, de relire les permissions demandées et de tester chaque fonction dans Chrome.
Quelle technologie utiliser pour bloquer des sites dans une extension Chrome moderne ?
Pour une extension Manifest V3, declarativeNetRequest est adapté au filtrage de domaines et aux redirections. Le navigateur applique les règles de manière performante, sans recourir à des méthodes anciennes plus lourdes.
Mes objectifs sont-ils envoyés sur Internet ?
Pas si l’extension utilise chrome.storage.local et ne contient aucun service externe. Cette API permet de conserver localement les objectifs, horaires et listes de domaines sur l’ordinateur utilisé.
Comment installer une extension Chrome créée avec Claude avant toute publication ?
Dans Chrome, ouvre la page des extensions, active le mode développeur, clique sur l’option de chargement d’une extension non empaquetée puis sélectionne le dossier qui contient le fichier manifest.json.
Comment éviter de désactiver l’extension dès qu’une tâche devient difficile ?
Ajoute une friction volontaire : une phrase à recopier, un délai court avant désactivation ou une confirmation explicite indiquant l’objectif abandonné. Le but n’est pas de bloquer toute liberté, mais de casser le réflexe automatique.
