Digiton : un site d'agence dont les réalisations se classent d'elles-mêmes
Digiton est une agence digitale au Maroc, dont j'étais CTO. L'agence vend trois métiers : les sites web et applications, la gestion des réseaux sociaux et la production vidéo. La refonte donne à chacun sa propre page : Digiton Dev, Digiton Social et Digiton Studio.
Les pages de services d'une agence portent d'ordinaire une sélection de projets choisis à la main, périmée dès que le projet suivant est livré. Ici, aucune page ne choisit ses projets. Chaque projet est rattaché au service dont il relève, et chaque page liste les siens : un projet publié une seule fois dans le back-office apparaît sur la bonne page, et dans le carrousel de la page d'accueil s'il est mis en avant.
Le site avait aussi des éléments qui ne fonctionnaient qu'à moitié. Le back-office disposait d'un éditeur d'articles, mais aucune page publique ne les affichait : on pouvait les rédiger sans que personne ne les lise jamais. Les demandes de contact partaient vers une adresse écrite dans le code, si bien que changer de boîte de réception imposait un déploiement. Et le serveur déployait tout ce qui arrivait sur la branche principale. La refonte règle les trois : un blog, une page de paramètres que l'équipe modifie elle-même, et des déploiements depuis une branche de production dédiée.
Les mêmes réalisations, sur plusieurs pages
Trois pages de services (web, réseaux sociaux et vidéo), chacune listant les projets rattachés à son service.
Une page d'accueil tirée de la base de données : les projets mis en avant dans un carrousel, les dernières études de cas, les services et les trois articles les plus récents.
Les projets et les études de cas classés du plus récent au plus ancien, et la rangée « autres projets » sous un projet n'affiche plus les brouillons non publiés.
Nouveau sur le site
Un blog, avec le nom, la fonction et la photo de l'auteur sur chaque article.
Une page de contact à part entière, au lieu du seul formulaire en bas des autres pages.
La page À propos, la page sur le processus et la page de la formation en marketing digital refondues dans le même esprit.
Une version mobile conçue en même temps que la version desktop.
Le back-office
Les études de cas, les projets, les services, les articles et les guides marketing édités par onglets, avec les champs SEO dans un onglet à part.
Un véritable éditeur de texte riche à la place de l'éditeur basique, et les couleurs de la carte de chaque étude de cas choisies dans le back-office plutôt que dans le code.
Une page de paramètres pour l'e-mail, le téléphone, l'adresse et l'image de partage sur les réseaux sociaux de l'agence.
Un tableau de bord qui compte les demandes de contact et les abonnés à la newsletter.
Le déploiement
Des déploiements via GitHub Actions depuis une branche de production dédiée.
Le serveur récupère le code avec une clé de déploiement, là où il utilisait un jeton d'accès personnel écrit dans l'URL du dépôt.
Refonte réalisée par mon équipe chez Digiton. Je l'ai relue et intégrée, j'ai repris les pages d'études de cas et de projets ainsi que le back-office qui les alimente, et j'ai porté le déploiement.
Outils de développement
-
Laravel
-
Filament
-
Livewire
-
Alpine JS
-
Tailwind
-
Javascript