BBS — Agence BB Switzerland
Index
Fiche 01 / 02
Digital et Web
Brief Work Management

Site web

Deux modes : un template (modèle de site WordPress) que nous personnalisons, ou un site entièrement sur mesure (expérience, interface, contenus, développement).

01

Contexte

L'Agence BB est une agence créative basée à Genève. Pour toute demande de site internet, nous proposons deux modes. Le premier : un template, c'est-à-dire un modèle de site WordPress existant que nous personnalisons graphiquement et fonctionnellement, idéal quand le délai et le budget priment. Le second : un site entièrement sur mesure, où nous prenons en charge l'expérience utilisateur, l'interface, le référencement naturel, la rédaction des contenus et le développement spécifique. Le mode (template ou sur mesure) est tranché dès le devis : inutile de prévoir une étape d'aiguillage dans Monday, c'est une donnée d'entrée. Hanae Bourekba, cheffe de projet digital, pilote tous les projets de site internet et coordonne l'équipe (direction artistique, développement, rédaction) du devis à la mise en ligne.

02

Ce qu'il faut, ce qu'on livre

Les éléments nécessaires pour démarrer, et les livrables produits à la fin.

Pour démarrer 03
  • 01 Brief du client : objectifs, périmètre, contraintes, échéance
  • 02 Audit de l'existant (nom de domaine, hébergement, contenus actuels)
  • 03 Inspirations et étude de la concurrence
Ce qu'on livre 03
  • 01 Devis détaillé et planning
  • 02 Pour le template : site personnalisé, recetté et mis en ligne
  • 03 Pour le sur mesure : maquettes Figma, puis site développé, recetté et mis en ligne
03

Schéma de flux

Deux voies distinctes, choisies dès le devis. Couleur = pôle en charge du bloc. Rectangle = exécution, pilule = validation.

Digital / Web Graphisme & design Photo & vidéo Stratégie marketing Validation client Externe / multi-pôles
Exécution (rectangle) Validation (pilule)
01 Template WordPress
flowchart TD
    A[Brief client] --> B[Cadrage + planning]
    B --> C[Installation du template<br/>modèle WordPress]
    C --> D[Personnalisation<br/>couleurs + contenus]
    D --> E[Intégration des<br/>contenus client]
    E --> R(["Recette + tests qualité"])
    R -- Corrections --> D
    R -- Validé --> G[Mise en ligne]
    class A client
    class B,C,D,E,R,G poleWeb
02 Sur mesure
flowchart TD
    A[Brief client] --> B[Cadrage + planning]
    B --> C[Rédaction des textes]
    B --> D[Wireframe + arborescence]
    C --> V1(["Validation des textes par le client"])
    D --> DV(["Validation du wireframe par le client"])
    V1 -- Ajustements --> C
    DV -- Ajustements --> D
    V1 -- Validé --> E[Maquettes Figma<br/>haute fidélité]
    DV -- Validé --> E
    E --> EV(["Validation DA des maquettes"])
    EV -- Ajustements --> E
    EV -- Validé --> V2(["Validation des maquettes par le client"])
    V2 -- Ajustements --> E
    V2 -- Validé --> F[Développement<br/>WordPress ou framework]
    F --> R(["Recette + tests qualité"])
    R -- Corrections --> F
    R -- Validé --> H[Mise en ligne]
    class A,V1,V2,DV client
    class C poleStrat
    class D,E poleDesign
    class EV poleDesign
    class B,F,R,H poleWeb
04

Étapes en détail

11 étapes

  1. 01

    Réception du projet (devis signé)

    Le projet arrive dans le backlog Monday, mode déjà tranché au devis (template ou sur mesure). Aucune étape d'aiguillage à prévoir.

    • Chef de projet
  2. 02

    Cadrage et planning

    Périmètre, planning et stack technique. Génération des sous-tâches correspondant au mode.

    • Chef de projet
  3. 03

    Template · Installation et personnalisation

    Installation du template (modèle de site WordPress), personnalisation graphique et fonctionnelle, intégration des contenus. Pas de phase maquettes.

    • Développement (exécution)
    • Chef de projet
  4. 04

    Sur mesure · Rédaction des textes

    Structure des contenus, ton, mots-clés, balisage. Démarre tôt : les textes nourrissent les maquettes.

    • Copywriting (exécution)
    • SEO
  5. 05

    Sur mesure · Wireframe et arborescence

    Parcours utilisateur, arborescence et zoning des pages, produits côté graphisme. La structure est validée par le client avant les maquettes.

    • Graphisme (exécution)
    • Client (validation)
  6. 06

    Sur mesure · Validation des textes par le client

    Étape bloquante : on ne lance pas les maquettes tant que les textes ne sont pas validés.

    • Chef de projet
    • Client (validation)
  7. 07

    Sur mesure · Maquettes Figma

    Maquettes haute fidélité produites par le graphiste, à partir des textes validés. La direction artistique valide en interne avant envoi au client.

    • Graphisme (exécution)
    • Direction artistique (validation)
  8. 08

    Sur mesure · Validation des maquettes par le client

    Validation visuelle par le client avant le développement.

    • Chef de projet
    • Client (validation)
  9. 09

    Sur mesure · Développement

    Intégration WordPress sur mesure ou framework (Nuxt, Next, Express, Symfony) selon le projet.

    • Développement (exécution)
    • Chef de projet (validation)
  10. 10

    Recette et tests qualité

    Cross-navigateurs, vitesse, formulaires, référencement technique. Validation digitale avant mise en ligne, commune aux deux modes.

    • Chef de projet (validation)
    • Développement
  11. 11

    Mise en ligne

    Bascule du nom de domaine, redirections, supervision, clôture.

    • Développement (exécution)
    • Chef de projet
05

Équipe et outils

Personnes mobilisées 07
  • Hanae Bourekba
    Chef de projet (= Account Manager) · interlocutrice principale du client, coordination du devis à la mise en ligne
  • Emmanuel Combe
    Head of Digital & Web · validation digitale en amont des étapes clés
  • Doriane Baray
    Copywriting · rédaction des contenus
  • Maël Roberts
    SEO/SEA · référencement naturel et balisage éditorial
  • Graphisme — Sylvain Varnet / Nicole Aranchet
    Exécution créative · wireframes et maquettes Figma (le graphiste produit, il ne valide pas)
  • Estefania Garcia Hernandez
    Direction artistique · validation et direction créative des wireframes et maquettes (ne les exécute pas en propre)
  • Charles Rémy
    Développement · exécution WordPress (template, plugins, widgets) ou framework (Nuxt, Next, Express, Symfony)
Outils 05
  • WordPress
  • Figma
  • GitHub
  • Monday
  • Frameworks JavaScript ou PHP selon le projet
06

Mise en place dans Monday

On veut piloter chaque projet de site web (template ou sur mesure) du devis signé à la mise en ligne, avec des relais clairs entre les pôles et une distinction nette entre les blocs d'exécution et les blocs de validation. Ce qui suit décrit le besoin dans les grandes lignes — le paramétrage Monday est laissé à Tryve.

06.1

Structure du tableau

Groupes — phases du projet
  1. 01 Cadrage
  2. 02 Analyse et stratégie
  3. 03 Copywriting
  4. 04 Wireframe & Maquette UX/UI
  5. 05 Développement
  6. 06 Testing
  7. 07 Mise en ligne
Colonnes essentielles — 13
Colonne Type Description et usage
Nom du projet Texte Ex : « Refonte site client X »
Type Menu déroulant Template ou Sur mesure — donnée d'entrée connue dès le devis
Statut Statut Suit les phases : Cadrage → Stratégie → Copy → Wireframe/Maquette → Dév → Testing → En ligne
Chef de projet Personnes Hanae Bourekba — coordination, interlocutrice client
Validation digitale Personnes Emmanuel Combe (Head of Digital & Web) — valide en amont des étapes clés
Copywriting Personnes Doriane Baray — rédaction des contenus
SEO / SEA Personnes Maël Roberts — référencement et balisage
Graphisme (exécution) Personnes Sylvain Varnet ou Nicole Aranchet — wireframes et maquettes UX/UI
Direction artistique (validation) Personnes Estefania Garcia Hernandez — valide la création, ne l'exécute pas
Développement (exécution) Personnes Charles Rémy
Liens Lien Figma (maquettes), staging (recette), production (URL finale)
Date de mise en ligne Date Échéance contractuelle
Heures devisées / travaillées Suivi du temps Pour comparer le vendu et le réalisé
06.2

Automatisations

Ce qu'on veut automatiser, dans les grandes lignes. On ne décrit pas le paramétrage : c'est le travail de Tryve.

  1. 01

    Le projet se crée tout seul quand le devis est signé

    Quand
    Un devis « Site web » passe à « Signé »
    Alors
    Le projet apparaît dans le tableau, pré-rempli avec le mode (template / sur mesure) et le chef de projet.
  2. 02

    Les bonnes phases selon le mode

    Quand
    Le mode est connu (donnée du devis)
    Alors
    Template : pas de phase maquettes. Sur mesure : phases Copy, Wireframe/Maquette et validations créées d'office.
  3. 03

    Relais automatiques entre les étapes

    Quand
    Une étape est validée (DA, puis client)
    Alors
    La personne suivante est prévenue et sa tâche démarre, sans relance manuelle.
  4. 04

    Demandes de validation au client

    Quand
    Une étape attend le client (textes, maquettes, recette)
    Alors
    Le client reçoit automatiquement la demande de validation.
06.3

Budget temps et rentabilité

Ce qu'on veut, dans les grandes lignes (le paramétrage précis est du ressort de Tryve) : suivre le temps réellement passé face au temps vendu au devis, sans pointage manuel, et être prévenus avant de dépasser le budget.

Colonnes à ajouter
Colonne Type Description et usage
Heures devisées Nombres Temps vendu sur le devis (saisi par le chef de projet).
Heures travaillées Suivi du temps Chronomètre que le créatif lance et arrête, ou rempli manuellement.
Heures restantes Formule ROUND({Heures devisées} - ({Heures travaillées}/3600), 2). Monday compte en secondes, d'où la division par 3600.
Alerte rentabilité Formule Pastille conditionnelle : 🟢 dans le budget · 🟠 attention · 🔴 dépassement.
Automatisations productivité
  1. 01
    Suivi du temps sans pointage manuel
    QuandQuand une tâche démarre ou s'arrête (au changement de statut). AlorsLes heures travaillées se comptabilisent automatiquement, sans que les créatifs aient à lancer un chrono à la main.
  2. 02
    Alerte avant dépassement de budget
    QuandQuand les heures travaillées approchent des heures vendues. AlorsLe manager est prévenu avant que le projet ne dépasse le budget.
06.4

Vues Monday souhaitées

Par profil d'utilisateur
Manager

Le Workload est transverse à toute l'agence (tout le work management, pas seulement le web) : charge de chaque collaborateur, projets en retard et rentabilité (heures vendues vs travaillées). Sert à arbitrer les priorités.

Collaborateur

Vue « Mes tâches » filtrée sur la personne connectée : uniquement ses tâches, triées par échéance et par statut. Aucun bruit sur le reste.

Chef de projet (Account Manager)

Vue par client / projet centrée sur les validations : ce qui attend un retour client (textes, maquettes, recette), les prochaines mises en ligne et le statut global de chaque projet.

Vues Monday à activer
  1. 01 Projets Site web — pipeline global par statut (vue projet, partagée par toute l'équipe, pas une vue individuelle)
  2. 02 Calendrier des mises en ligne
  3. 03 Tableau de bord Monday : sites livrés, délai moyen, dépassements de budget
Widgets de tableau de bord
  1. 01 Heures vendues ce mois vs heures réellement travaillées (graphique mensuel) — indicateur clé pour ajuster les futurs devis.
  2. 02 Charge de travail par créatif (Workload) — bulles rouges si capacité hebdo dépassée.
  3. 03 Rentabilité par projet (heures restantes consolidées) — repérer les projets qui dérapent en temps réel.
06.6

Questions pour Tryve

Sujets à clarifier ensemble pour le paramétrage Monday.

  1. 01 Où placer le backlog des projets gagnés mais pas encore démarrés ? Tableau dédié, ou un groupe « Backlog » dans le tableau projet ?
  2. 02 Structurer le tableau par statut (Kanban) ou par période ? À cadrer ensemble.
  3. 03 Comment câbler proprement les relais et notifications entre étapes ? On décrit l'intention, Tryve propose le paramétrage.