Groselia

Construire a cessé d'être le goulot d'étranglement. Être vu l'est devenu.

L'IA a effondré le coût de fabrication d'un logiciel. Un fondateur sans formation d'ingénieur peut aujourd'hui sortir un produit en un week-end, et tout le monde aussi. Ce qui n'est pas devenu moins cher, c'est d'amener qui que ce soit à le remarquer. La distribution est une opération continue, pas une tâche : publier chaque jour, sur huit réseaux qui veulent chacun un format différent, répondre à chaque commentaire, et lire des chiffres que chaque app remonte différemment.

Les startups le paient de l'une de trois façons. Elles embauchent une équipe qu'elles ne peuvent pas encore s'offrir, elles assemblent une dizaine d'outils qui règlent chacun une petite partie, ou elles ne publient rien et le paient en croissance. Groselia existe pour être la quatrième option.

Groselia a changé de forme quatre fois avant de trouver ce qu'elle est. Chaque virage a gardé ce qui marchait et laissé tomber le reste.

1. 

   Fin 2025 – févr. 2026

   Argibee

   Une plateforme de brand design par IA. Elle a commencé comme prototype fin 2025 et est devenue une vraie entreprise en février 2026. Elle n'a pas trouvé son marché, mais son moteur de brand kit est devenu la colonne vertébrale de tout ce qui a suivi.

2. 

   Avr. 2026

   Vidéo motion

   Groselia a commencé avec des vidéos de lancement façon Apple, faites à partir de templates After Effects. J'ai validé toute la chaîne à la main, puis j'ai vu qu'elle ne pouvait pas passer à l'échelle au niveau de qualité voulu.

3. 

   Juin 2026

   Pre-seed de Link Vector

   Nous avons rejoint la Startup School de Link School of Business, un programme de 100 jours pour fondateurs filmé comme une téléréalité (voir la saison ↗). Il s'est terminé par un demo day où j'ai pitché Groselia sur scène, et par notre pre-seed de R$100k de Link Vector, l'accélérateur de Link School of Business, où j'ai fait mes études.

   

4. Août 2026

   Le Lovable du marketing

   Une conversation au lieu d'un formulaire : décrivez la campagne, et Groselia la planifie, la rédige et la publie. Un agent de chat avec des outils, pas une armée de bots.

5. Sept. 2026

   Un social media manager

   Les clients ne voulaient pas que l'IA crée leur contenu. Ils voulaient que leurs propres photos soient bien publiées et que leurs commentaires aient une réponse. Nous avons supprimé la génération et misé à fond sur la gestion des réseaux.

6. 

   Aujourd'hui

   Service as a software

   Nous vendons le travail, pas l'outil. Notre équipe gère les réseaux sociaux de chaque client sur la plateforme, ce qui permet à une seule personne de faire ce qui demandait une agence.

Construit en public

Nous avons construit en public dès le départ. À l'époque d'Argibee, nous partagions l'aventure sur YouTube, du lancement de la liste d'attente d'Argibee à la première vidéo où nous montrions Groselia. La suite de l'histoire, vidéo après vidéo, est sur notre chaîne ↗.

Je voulais une marque Groselia audacieuse : quelque chose qui fasse s'arrêter les gens pour regarder, sur le site, dans l'app et dans chaque post sur nos réseaux. Partout où on la croise, elle devait impressionner, susciter un peu d'admiration, et donner envie de faire appel à nous grâce à ce qu'on vient de voir. Surtout, elle devait être superbe aux yeux des startups tech, l'écosystème dont nous faisons partie et les premiers clients pour qui nous construisons.

J'ai conçu toute la marque avec le plugin Figma dans Codex : le logo, la typographie et son assemblage avec le symbole dans les bonnes proportions, l'imagerie, la bibliothèque d'icônes SVG, les styles de texte et une palette de couleurs organisée. Chaque décision allait sur un seul board, mesurée, pour pouvoir la comparer et en débattre.

Le symbole

Le symbole est venu en premier et il est resté. Trois pétales doux qui tournent autour d'un centre : il vient de la toute première version de l'entreprise, et le nouveau logo a été construit autour de lui plutôt que par-dessus. Sa géométrie a été copiée et mise à l'échelle, jamais redessinée.

Le logotype

Le logotype est en TT Commons Pro Bold, en minuscules, vectorisé pour s'afficher pareil partout. Avec son espacement naturel, il paraissait lâche à côté du symbole, alors je l'ai resserré à −4 % d'approche en décalant chaque lettre de 6,4 unités de plus vers la gauche à 160 px. Ça paraît minuscule ; le mot est passé de 564 à 520 unités de large et se lit désormais comme une seule forme.

Une grille en H

Tout est mesuré en H, la hauteur visible du logotype, sur une grille de H/10. Ainsi, le logo change d'échelle sans que personne ait à le régler à l'œil.

Pour le logo empilé, j'ai dessiné six options, trois tailles de symbole (1,50H, 1,75H, 2,00H) pour deux espacements (0,15H, 0,25H), et nous avons choisi B : un symbole de 1,75H, à 0,15H au-dessus du mot. Pour le logo horizontal, j'ai comparé des espacements de 0,20H à 0,35H et retenu un symbole de 1,10H avec un espacement de 0,35H.

Horizontal

Symbole 1,10H · espacement 0,35H

Empilé

Symbole 1,75H · espacement 0,15H

Symbole

Proportions d'origine, 0,93 : 1

Colour

The palette is fifteen colours, loud on purpose. But the logo only ever comes in four treatments: blue symbol with black text, blue with white, all black and all white. The other colours are grounds, never the symbol.

To prove that, I put the symbol and both lockups on twelve backgrounds, 24 studies each, and kept the ones where its silhouette survives. On blue grounds the symbol goes monochrome. Click a colour to copy it.

Typographie

TT Commons Pro fait tout : six graisses de Light à ExtraBold, une échelle de onze tailles de 12 à 96 px, et de vraies italiques. J'y ai migré les 688 calques de texte du fichier, pour que le brand book, l'app et le site parlent d'une seule voix.

Icône de l'app

L'icône de l'app est le seul endroit où la marque passe en 3D : le symbole en porcelaine, en couches, éclairé par le haut et un peu brillant. Lors d'une mise à jour, j'ai réduit le symbole de 10 % à l'intérieur pour qu'il respire dans sa tuile. Elle a aussi son propre assemblage avec le logotype, la tuile à 1,5H.

Un monde d'objets 3D

Autour du logo vit toute une bande d'objets 3D : un cœur avec des yeux qui roulent, des bulles de chat, un hashtag, des étincelles. Ils sont la voix de la marque sur le site et dans nos posts, et ils ne tiennent jamais en place : ils flottent, et sur le site ils réagissent au curseur. Ceux-ci aussi : bousculez-les, ou tirez-en un et lâchez-le.

Neo doodles

Pour tout ce qui est en aplat, il y a Neo, notre jeu d'icônes : contours noirs épais, remplissages tirés de la palette et un seul reflet blanc. Sur le site, chacune commence comme une simple icône au trait dans une pastille blanche, et devient son doodle au survol, ses éléments arrivant un par un : le disque surgit, les barres tombent, le reflet se dessine. Ce sont les doodles et l'animation du site, copiés tels quels. Survolez-en un.

Dans Groselia, tout se fait en écrivant dans un seul chat. Vous écrivez ce qui doit sortir et quand, et il le programme, le publie, répond aux commentaires et vous dit ce qui a marché. Le travail arrive sous la forme d'un seul plan que le propriétaire approuve, au lieu d'une dizaine d'écrans à manipuler.

Fonctionnalités clés

• Un brand kit à partir d'un lien

  Collez un site web et connectez vos comptes. Groselia analyse le site, lit vos anciens posts et remplit tout seul le logo, les couleurs, les polices, le ton et l'audience.

• Une seule conversation

  Un agent IA doté de 41 outils légende vos médias, choisit les horaires à partir de vos propres données d'engagement, lit les métriques et rédige les réponses, puis rassemble le tout dans un plan.

• Un calendrier pour huit réseaux

  Instagram, LinkedIn, TikTok, YouTube, X, Facebook, Threads et Reddit, chacun dans son format natif, avec les anciens posts importés pour que le calendrier ne soit jamais vide.

• Chaque commentaire a sa réponse

  Les commentaires et DM de tous les réseaux dans une seule boîte de réception, avec des réponses rédigées avec le ton de la marque et tout ce qui est sensible gardé pour un humain.

• Des Insights en langage clair

  Portée, vues et engagement sur tous les comptes, avec honnêteté sur ce que chaque plateforme remonte ou non, et une réponse à « qu'est-ce qui marche ? ».

• Cycles et validations

  Le travail avance par cycles. Chacun s'ouvre par une réunion, se ferme par un rapport que l'IA rédige à partir des chiffres, et chaque post peut attendre la validation du client.

Construit avec des agents IA

J'ai construit Groselia avec des agents IA comme équipe d'ingénierie. Codex et Claude Code écrivaient le code, chaque changement sur sa propre branche, pendant que je le concevais, relisais chaque pull request et décidais de ce qui partait en production.

Et j'ai dicté la plupart de mes prompts au lieu de les taper, avec Wispr Flow. Un bon prompt, c'est un brief long et détaillé, et parler me permettait d'en donner un aussi vite que je le pensais.

• 

  Codex

  Agent de code

• 

  Claude Code

  Agent de code

• 

  Wispr Flow

  Dictée vocale

Le site, c'est là que la marque monte le son. Je l'ai conçu et développé en Next.js. Il existe en dix-sept langues, et il transmet la langue de chaque visiteur à l'app au moment de l'inscription.

Un hero avec lequel jouer

Le logo tourne pendant le chargement de la page, puis vient le hero : des objets 3D qui flottent, s'inclinent avec la souris et se font bousculer par le curseur, et une scène au scroll qui se termine sur « Made for you ».

groselia.com

La vraie app, reconstruite

« Inside your Groselia » montre la plateforme telle qu'elle est, reconstruite en code à partir des propres écrans de l'app, avec une marque de démo.

groselia.com

Un blog

Des notes sur la gestion des réseaux sociaux. Les articles sont de simples fichiers MDX, un par langue, sans CMS, et chacun a son propre flux et ses données structurées pour que les moteurs de recherche et les assistants IA le lisent correctement.

groselia.com

Un formulaire qui qualifie les leads

Chaque « Book a call » ouvre un court formulaire avant le calendrier : qui vous êtes, où vous publiez, ce dont vous avez besoin et votre budget. Chaque étape est enregistrée dans notre base de données au fur et à mesure, donc nous voyons même les réponses à moitié remplies, et un formulaire terminé prévient notre équipe sur Slack.

groselia.com

Responsive, toujours

Chaque page est aussi pensée pour le téléphone, pas juste rétrécie. Là où il n'y a pas de survol, les sections s'animent quand elles arrivent au milieu de l'écran.

Architecture

J'ai construit la plateforme moi-même, avec l'IA comme binôme. L'app est en React et Vite, la landing en Next.js, et toutes les deux reposent sur un seul projet Supabase : Postgres avec sécurité au niveau des lignes, auth, realtime et storage, et 47 edge functions. Tout ce qui est lent ou planifié tourne sur Trigger.dev, les réseaux sociaux passent par une seule API de publication, et Stripe gère les abonnements, les cartes et le boleto brésilien.

Il y a aussi un serveur MCP et un plugin Codex, pour qu'on puisse utiliser Groselia depuis un agent IA : les mêmes marques, posts et brouillons, sous forme d'outils.

Où on l'utilise

App webSite webServeur MCP

↓

Le cœur

Supabase

AuthPostgresRealtimeStorageEdge functions

↓

En coulisses

LLM de pointeTrigger.devAPI de publicationStripePostHog

L'app, le site web et le serveur MCP sont hébergés sur Vercel.

Survolez ou touchez un bloc pour voir ce qu'il fait et avec quoi il communique.

Le trajet d'un post

Le meilleur moyen de voir comment les pièces s'emboîtent, c'est de suivre un post, d'une phrase dans le chat jusqu'à ses chiffres dans Insights. Cliquez sur les étapes, ou laissez-les défiler.

L'agent

L'agent tourne sur les meilleurs modèles du marché, d'Anthropic, d'OpenAI et d'autres fournisseurs, sous la forme d'une seule edge function en streaming avec une boucle d'outils. Le modèle dispose de 41 outils à lui, plus la recherche et la lecture web, jusqu'à huit étapes par tour. Le plus dur n'a jamais été le modèle. C'était de s'assurer que l'agent sache toujours ce qui est vrai à l'instant présent.

Alors à chaque tour, avant que le modèle ne voie le message, la fonction reconstruit le contexte depuis la base de données : la date et l'heure dans le fuseau du propriétaire, les documents de mémoire de la marque, le calendrier en direct, les plans ouverts, les documents importés et un résumé glissant des anciens messages. La partie stable du prompt est mise en cache pendant une heure ; celle-ci ne l'est jamais, pour qu'elle ne puisse pas devenir obsolète.

Deux règles ont façonné le reste. Tout ce qui est public ou irréversible passe par un plan que le propriétaire approuve, jamais directement. Et un post n'existe que si un outil l'a créé pendant ce tour, ce qui a mis fin à l'époque où l'agent décrivait un travail qu'il n'avait pas fait. Et l'agent n'est pas lié à un seul modèle : quand un modèle plus petit et moins cher est devenu assez bon, j'y ai passé le chat, pour réduire le coût par conversation.

Le contexte, reconstruit à chaque tour

Instructions et outilsen cache pendant une heure

Date et heurele fuseau horaire du propriétaire

Documents de mémoirepréférences, à faire et à éviter

Calendrier en directchaque post et son statut

Plans ouvertsproposés et approuvés

L'histoire jusqu'iciun résumé glissant

→Le LLMModèles de pointe · jusqu'à 8 étapes→

Appels d'outils

✓get_posting_times

✓get_insights

✓propose_plan

Plan en attente de validation

Semaine de la récolte : 3 posts, 4 réponses

// Volatile block: time + memory + live calendar + active plans + rolling summary.
// Rebuilt each turn (never cached) so the agent always sees current state.
const volatileSystem = () => {
  const parts = [
    nowBlock,
    renderMemories(memories),
    renderCalendar(calendar, todayISO),
    renderPlans(plans),
  ]
  if (documents.length) parts.push(renderDocuments(documents))
  if (rollingSummary) parts.push(`STORY SO FAR (summary of earlier messages in THIS conversation):\n${rollingSummary}`)
  // … then a line for each of the brand's other conversations
  return parts.join('\n\n')
}

Modèle de données

Environ 55 tables, en quelques groupes clairs. Un espace de travail a des membres et des marques ; tout le reste est rattaché à la marque, pour que la sécurité au niveau des lignes puisse répondre partout à une seule question : cette personne est-elle membre de cette marque ?

Fiabilité et sécurité

Groselia publie sur de vrais comptes, donc les pannes qui coûtent cher, c'est un post qui part deux fois, ou un post qui ne part jamais sans prévenir. L'essentiel de l'ingénierie est là.

Pendant un temps, mon app locale et celle en ligne partageaient une seule base de données de production, et une migration passée avant un déploiement a un jour vidé la page Brand Kits en ligne. Depuis, le travail backend se fait d'abord sur une branche Supabase et fusionne en production avec le code qui en a besoin.

Qualité et workflow

Environ 1 000 cas de test répartis dans 140 fichiers couvrent l'app, le serveur MCP et les edge functions. Certains contrôles existent parce que quelque chose a cassé une fois : un test de parité fait échouer le build s'il manque une clé dans l'une des 17 langues, et les suites de base de données du MCP tournent sur des données synthétiques et font un rollback à la fin.

L'agent a ses propres evals. L'une pose à l'agent en production une série fixe de questions sur les performances d'une marque, chacune dans une nouvelle conversation, et vérifie qu'il a lu Insights sur la bonne période et que sa réponse donne les mêmes chiffres que la page Insights.

Une seule personne a livré plus de 520 pull requests en traitant les agents IA comme une équipe. Chaque changement a sa propre branche dans son propre worktree git, pour que Claude Code et Codex puissent travailler sur plusieurs choses à la fois sans se marcher dessus. Chacun lance ses tests et ses vérifications de types, ouvre une petite pull request, et rien n'est fusionné avant que je l'aie lu.

Chacun ressemblait à un bug d'interface et s'est révélé plus profond : la forme d'un stream, un horodatage, ce qu'un réseau remonte vraiment, une horloge.

export function sameInstant(a: string | null | undefined, b: string | null | undefined): boolean {
  if (a == null && b == null) return true;
  if (a == null || b == null) return false;
  if (a === b) return true;
  const ta = Date.parse(a);
  const tb = Date.parse(b);
  return Number.isFinite(ta) && Number.isFinite(tb) && ta === tb;
}