L'Intervalle Jazz-Bar — Site vitrine & système de gestion autonome

Comment transformer une demande de "PDF + QR code" en un site web pensé pour l'image du lieu, le référencement et l'autonomie du client.


Projet freelance · Mai 2026 · [lintervallejazzbar.com](https://lintervallejazzbar.com)*


Contexte

L'Intervalle est un bar à cocktails et concerts jazz situé dans le Vieux-Lille, sans présence digitale jusqu'à ce projet. Le client souhaitait diversifier son offre (concerts, privatisation d'événements) et avait une idée précise en tête pour la carte : un PDF accessible via QR code sur les tables.


Repenser le besoin

Le PDF + QR code répondait au problème immédiat (rendre le menu accessible), mais ne répondait à aucun des enjeux de fond du lieu : aucune visibilité en ligne, aucun moyen de mettre en avant les concerts, aucune possibilité de gérer les demandes de privatisation, et un menu qui resterait figé à chaque changement de carte.

J'ai proposé et défendu une alternative : un site web complet, pensé pour :

- Faire vivre l'identité du lieu (storytelling, ambiance, photos)

- Centraliser l'agenda des concerts et événements

- Permettre la prise de contact pour les réservations et privatisations

- Travailler le référencement local, inexistant jusque-là

- Permettre au client de mettre à jour facilement sa carte, sans dépendre de moi à chaque changement


Le défi technique : l'autonomie du client

Le client ne maîtrise pas les outils digitaux. Il fallait donc une solution où il puisse modifier lui-même le menu et l'agenda, sans toucher à du code ni à un back-office complexe.

J'ai construit le site sous **Framer**, avec les données du menu et de l'agenda gérées via un **Google Sheet** relié au site par plugin. Concrètement, le client modifie un tableau Google Sheet comme il modifierait une liste de courses, et les changements se reflètent automatiquement sur le site — sans intervention de ma part.

J'ai aussi développé une logique sur-mesure dans Framer pour que les événements passés disparaissent automatiquement de l'agenda, afin que le client n'ait pas à faire de ménage manuel.


Process

Le projet s'est étalé sur 3 semaines non continues, en 3 grandes étapes :

1. **Wireframes papier** — structuration des parcours et du contenu avec le client

2. **Production sur Framer** — design et intégration complète du site

3. **Mise en place du système de gestion autonome** — connexion Google Sheet, automatisations, tests avec le client sur sa propre prise en main


Résultat

- Site en ligne, fonctionnel et utilisé activement par le client pour gérer sa carte et son agenda en totale autonomie

- Trafic généré par le site, avec des visiteurs venant spécifiquement pour les soirs de concert

- Augmentation des réservations grâce à la visibilité de l'agenda et au formulaire de contact

- Retours clients et visiteurs constants sur le rendu visuel : sobre, professionnel, cohérent avec l'identité du lieu


Ce que j'en retiens

Ce projet illustre une compétence clé du métier de designer : ne pas exécuter la demande initiale telle quelle, mais comprendre le besoin réel derrière, et proposer une solution qui sert mieux les objectifs business du client — ici, la visibilité, la flexibilité de gestion, et l'autonomie complète d'un client non technique.