jshph/wallflower

Preenche um quadro branco compartilhado (Wallflower, baseado em tldraw) com o que vale a pena discutir antes de uma reunião ou revisão privada, faz novas passagens quando as pessoas pedem mais e depois lê o que fizeram no quadro, separando o julgamento delas do seu. Use a partir de um tópico de preparação, frio ou já com contexto, quando o usuário pedir para "colocar isso no quadro", "preparar o quadro", "povoar o quadro", "fazer outra passagem" ou "o que a sala fez com o quadro".

O que é wallflower?

Wallflower é uma ferramenta de preparação de reuniões baseada em IA que ajuda você a reunir e organizar informações em um quadro branco compartilhado (construído sobre o tldraw) antes de discussões em grupo, revisões privadas ou planejamentos. Ela torna tangíveis as relações entre fontes que nenhum documento mostra sozinho, colocando citações, notas e prompts em um layout visual. Você define o ponto de partida, a sala pensa e altera o quadro, e então você lê as mudanças para extrair o julgamento delas. A ferramenta suporta várias plataformas de agente (Claude Code, Cursor, Codex) e se integra com buscas semânticas (como o Enzyme), git logs, transcrições, e arquivos de notas. O processo é cíclico: você escreve um plano JSON com grupos e cartões, coloca-o no quadro com `wallflower put`, compartilha o link, espera a sala agir com `wallflower wait`, e depois usa `wallflower diff` para ver o que mudou. Wallflower enfatiza privacidade, contexto rico, e um ciclo claro de preparação, colaboração e leitura crítica.

Funciona com~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/jshph/wallflower/tree/HEAD/skill/wallflower

Installed? Explore more Produtividade e Colaboração skills: steipete/gemini, steipete/gh-issues, steipete/skill-creator · View all 6 →

Perguntar na sua IA favorita

Abre um novo chat com esta habilidade de agente já pré-carregada.

Documentação

O que wallflower faz?

A IA faz a preparação, e a sala faz o pensamento. Seu trabalho é definir por onde a conversa começa: o material, colocado de modo que as relações que valem a pena discutir estejam visíveis, sem nada que pareça acabado. Depois, leia de volta o que as pessoas fizeram com o quadro, porque esse é o registro do julgamento delas.

Configuração

wallflower (ou sua forma abreviada wf) vem do pacote npm wallflower-board: npm install -g wallflower-board, ou prefixe comandos com npx wallflower-board no lugar de wallflower. Os quadros vão para o servidor público em board.byenzyme.com, a menos que o usuário tenha configurado outro (wallflower server informa qual). Nada precisa ser iniciado.

Para um quadro nesta máquina (--server local), inicie o servidor local em segundo plano primeiro:

(nohup wallflower serve > /tmp/wallflower.log 2>&1 &)

Em um checkout do repositório, npm run dev executa o servidor local com uma interface de usuário com recarga automática.

A interface completa:

wallflower new "Título" [--id ID]     cria um quadro e o torna atual
wallflower put plan.json|-           adiciona ou atualiza grupos e cartões; imprime o layout, avisos e problemas de layout
wallflower view                      mapa de layout, depois cada cartão com sua posição
wallflower diff                      o que as pessoas mudaram desde que tocaram no quadro pela primeira vez
wallflower wait [--timeout SEGUNDOS] bloqueia até que alguém pressione "Fazer outra passagem"; imprime essa rodada
wallflower url [--name Nome]         a URL para entregar, com o nome do usuário nela
wallflower share                     o link para outras pessoas; diz em stderr se elas conseguem acessá-lo
wallflower delete [id]               exclui um quadro que você criou, para todos
wallflower server                    qual servidor os novos quadros usam
wallflower list | wallflower use <id>

wallflower url imprime onde o quadro abre. Um servidor local só responde nesta máquina; não o exponha você mesmo. Novos quadros vão para board.byenzyme.com, ou para o próprio servidor do usuário se ele tiver configurado um (em ~/.config/wallflower/config.env, ou WALLFLOWER_URL e WALLFLOWER_TOKEN); wallflower server informa qual. Quadros em board.byenzyme.com são excluídos após 90 dias sem atividade. --server <url> aponta qualquer comando para outro lugar, e --server local para esta máquina: use-o para um quadro que só o usuário verá e que contém material privado, a menos que ele tenha dito o contrário. Passe-o para wallflower new ou wallflower use; comandos posteriores nesse quadro permanecem em seu servidor sem ele. O link de um quadro hospedado é sua única chave: qualquer pessoa que o detenha pode editar e ler o quadro, então entregue-o apenas para as pessoas que devem estar na sala e não o cole em nenhum lugar público. Para trabalhar em um quadro que outra pessoa criou, pegue o id do link (?board=<id>) e execute wallflower use <id>; nenhum token é necessário.

0. Decida para que serve o quadro

Estabeleça três coisas antes de reunir. Se você não conseguir inferi-las, pergunte.

  • O que a sala está aqui para julgar? Toda reunião existe para um ato que pertence às pessoas nela: escolher, priorizar, avaliar, nomear. Sua interpretação para antes desse ato.
  • Quem está na sala? Isso decide o que pode aparecer (veja Privacidade).
  • O que este quadro mostrará que as fontes não mostram? Escreva em uma frase. Se a resposta for "as mesmas anotações, em blocos", o quadro ainda não tem função. A resposta usual são relações entre fontes que nenhuma fonte mostra sozinha: a mesma nota de três pessoas, uma decisão ao lado do que alguém disse depois, dois esforços tocando a mesma coisa.

Quando o público é uma pessoa (um olhar retrospectivo privado, uma revisão da semana), ela esteve em todas as reuniões e leu todas as notas. Trechos não lhe dizem nada. Construa o quadro a partir de padrões entre fontes, cada um mostrado como dois ou três cartões de lugares diferentes colocados juntos, mais um cartão de orientação sobre onde as coisas estão (o que está pendente, quem deve o que a quem). Espere menos cartões, mais fortes.

ConfiguraçãoParar antesVale a pena notar
Standup ou planejamento nativo de agenteo que precisa de um humano, prioridade, quem assumecolisões; agentes se contradizendo; especificação vs. o que foi construído
Revisão de design ou críticagosto: o que mantera mesma nota retornando entre versões; revisores que discordam
Síntese de pesquisaos temas e insightsoutliers; uma palavra significando duas coisas; o que as pessoas fizeram vs. disseram
Estratégia ou fundadoresescolher e se comprometerre-discutir uma decisão já tomada; prioridades declaradas vs. onde o tempo vai
Revisão privadaa avaliação da própria pessoafeedback que se repete entre pessoas; desvio de um critério declarado; loops abertos

Estas linhas são inferências de algumas chamadas reais. Deixe a leitura de volta corrigi-las.

1. Reúna

Use as ferramentas de busca que você tem diretamente: pesquisa de texto completo (rg -il) para nomes, palavras do projeto e tags, ordenadas por data para recência, depois siga links a partir das âncoras. Se uma pesquisa semântica sobre as notas estiver disponível (Enzyme enzyme petri / enzyme catalyze, ou similar), use-a para conceitos. Para trabalho de agente, leia os tópicos e logs de git dos agentes; para chamadas, leia as transcrições.

Uma primeira passagem semântica geralmente retorna os temas mais frequentes das notas, em vez do material desta reunião. Antes de escrever o plano, verifique:

  1. Âncoras. Nomeie as 3 a 6 fontes das quais a reunião obviamente depende (a nota de escopo, as chamadas mais recentes, a decisão que ela continua). Você as leu, na íntegra?
  2. Frescor. O material inclui a última semana de trabalho no tópico?
  3. Vozes. As pessoas importantes estão representadas em suas próprias palavras?

Se não, reformule nas palavras do usuário, pesquise exatamente, siga links ou faça ao usuário uma pergunta específica. Leia os arquivos antes de usá-los; trechos enganam. Quando existirem notas destiladas (debriefs de reunião, resumos anteriores), lembre-se de que elas já fizeram alguma observação. Cite as pessoas nelas, não suas conclusões, e procure o que as conecta.

Privacidade

Qualquer coisa em um quadro compartilhado deve vir de fontes que todos na sala podem ver. Reflexões pessoais, notas privadas e qualquer coisa marcada como pessoal devem ficar fora de um quadro compartilhado, mesmo quando relevantes. Notas destiladas (debriefs, resumos) geralmente misturam o que foi dito com a leitura privada do escritor: apenas as partes ditas são compartilháveis. Formule o ponto como uma pergunta aberta, ou deixe-o de fora. Isso inclui a pré-visualização que um cartão carrega (abaixo): cerca de 200 palavras de sua fonte vão para o quadro com ele.

2. Escreva o plano

Escreva o plano JSON manualmente, em um arquivo ou na entrada padrão, e coloque-o de uma vez: grupos, cartões e seus posicionamentos juntos. Não construa um script gerador e não escreva um validador: wallflower put organiza o quadro, trunca cópias que excedem o orçamento e verifica o resultado.

{
  "title": "Olhando para trás na revisão de lançamento",
  "groups": [
    { "id": "g1", "col": 0, "why": "a mesma preocupação de dois revisores" },
    { "id": "next", "label": "Carregar para a próxima semana", "col": 2, "zone": true }
  ],
  "cards": [
    { "id": "rosa", "kind": "quote", "title": "Rosa sobre o fluxo de integração", "body": "Não conseguia entender o que ele queria de mim",
      "source": { "label": "Revisão de lançamento, 4 de mar", "file": "/…/notes/2026-03-04 review.md", "url": "obsidian://open?…", "author": "Rosa", "date": "4 de mar" },
      "place": { "in": "g1" }, "why": "mesma confusão que a pergunta de Kim sobre a tela vazia" },
    { "id": "kim", "kind": "quote", "title": "Kim perguntou duas vezes", "body": "o que eu deveria fazer primeiro?",
      "source": { "author": "Kim", "date": "6 de mar" }, "place": { "near": "rosa", "side": "right", "overlap": true } }
  ]
}
wallflower put plan.json

Planos podem ser parciais. Coloque o mesmo id novamente para editar ou mover um cartão, e { "id": "x", "delete": true } o remove. Em qualquer lugar onde um id é usado, você pode usar o número de um cartão ("#17"), que é como as rodadas e wallflower view mostram os post-its das pessoas. Os grupos ficam em uma grade (col, row); você nunca calcula pixels. Deixe grupos sem rótulo, porque nomeá-los é o ato da sala; why é para a leitura de volta, não para o quadro. Zonas são a exceção: rotule-as ("Decidido", "Carregar para a próxima semana"), já que o nome de uma zona é a instrução.

Até que uma pessoa toque no quadro, cada put organiza todo o quadro novamente a partir de seus posicionamentos, então mover um grupo para outra row ou um cartão para outro grupo simplesmente funciona. Depois disso, qualquer coisa que uma pessoa colocou permanece onde ela colocou: seus novos cartões vão ao redor, e apenas seus próprios grupos intocados se deslocam para abrir espaço.

put imprime o layout como texto, depois uma verificação. layout check: no overlaps, every card in its group, no cut-off text significa que você terminou. Caso contrário, cada linha problem: nomeia os cartões ou grupos por id (grupos sobrepostos ou muito próximos, um cartão que parece estar no grupo errado, cartões se cobrindo, um título que ultrapassa três linhas, texto que o navegador relatou como cortado); corrija o plano e coloque novamente. wallflower view lista os mesmos problemas no final. Sobreposições que as pessoas fizeram são delas e nunca são relatadas. Não tire um print do quadro para verificar o layout.

Posicionamento

placeUse para
{ "in": "g1" }material que pertence junto (o grupo cresce)
{ "near": "c1", "side": "right", "overlap": true }dois cartões para ler como uma coisa só: uma discordância, desvio, repetição entre pessoas
{ "around": "c1" }expandir uma vizinhança: cada cartão cai em um anel solto ao redor de c1 (um cartão ou um post-it de uma pessoa), em uma direção diferente, dentro de seu grupo
{ "near": "c1", "side": "below" }um cartão ao lado de outro, sem sobreposição; ele permanece no grupo do parceiro, que cresce
{ "edge": "g1", "side": "right" }um outlier, ou algo que você não tem certeza se pertence
{ "at": { "x": 0, "y": -200 } }prompts e pontos manuais raros

Tipos de cartão

A largura é fixa por tipo e a altura segue o texto.

kindparatítulocorpo
quotequalquer gancho textual, falado ou escrito; source.author = quemresumo, ≤90o gancho, ≤200 (mire abaixo de 120)
noteum objeto (doc, ticket, PR, sessão), ou uma nota que faz um dos trabalhos abaixo≤90≤300
prompttexto marcador no quadro: o cartão inicial, uma pergunta aberta≤160≤200
stickyo que as pessoas adicionam (você raramente deve)≤140nenhum

Defina people (um array de nomes, ["Rosa", "Kim", "Lee"]) quando a abrangência importar; ele renderiza como "de 3 pessoas". Um padrão baseado em uma ou duas vozes deve parecer ralo. Coloque um link em source.url apenas se todos na sala puderem abri-lo (um documento compartilhado, um ticket, um PR); nunca um link para notas privadas, que é inútil para eles e vaza onde seus arquivos estão. Para arquivos, use source.file (abaixo), que permanece em sua máquina.

Pré-visualizações de fonte. Dê a cada cartão que vem de um arquivo seu source.file (um caminho absoluto; uma URL file:// também funciona). wallflower put lê o arquivo em sua máquina e anexa cerca de 200 palavras ao redor da citação do cartão, que as pessoas abrem clicando duas vezes no cartão ou clicando em sua linha de fonte. A citação é o body de um cartão de citação; em um cartão de nota, defina source.quote para uma frase textual do arquivo, ou a pré-visualização será a abertura do arquivo. O arquivo em si nunca sai de sua máquina. Nunca escreva uma pré-visualização você mesmo: put descarta qualquer source.passage no plano. Para uma fonte que não é um arquivo (um e-mail, um ticket), salve seu texto bruto com um redirecionamento de shell (gog … > /tmp/src-1.md) e aponte source.file para ele. Se put avisar que uma citação não foi encontrada, o gancho não é textual: corrija o gancho, não o aviso.

Escrevendo os cartões

Um quadro é lido de relance por pessoas que saltam para o que as atrai. A maioria dos cartões deve ser legível em dois segundos.

  • Título = resumo: o que é isso, em palavras simples, até cerca de 60 caracteres. Uma descrição, não um veredito.
  • Corpo = gancho: o fragmento textual mais curto que ainda grude. Prefira a linha estranha, concreta ou vívida. Textual não significa a passagem inteira.

Cada pedaço de texto tem que responder a uma pergunta: o que isso permite que o leitor note, lembre ou investigue? Texto cujo único trabalho é explicar por que você incluiu algo (um cartão que diz o que é evidência, uma nota que descreve o quadro) é você narrando sua preparação. Corte-o. A atribuição da fonte pode ficar silenciosamente embaixo.

Uma nota ganha seu lugar fazendo um destes trabalhos, aproximadamente em ordem de quanto eles ajudam uma sala a dar sentido às coisas:

  1. Segurar duas coisas juntas para que a relação possa ser investigada, disputada ou desfeita.
  2. Expor uma peça faltante: onde a evidência acaba ("O que o cliente realmente viu você decidir?").
  3. Recuperar uma sequência que uma única citação não consegue segurar.
  4. Oferecer uma leitura concorrente de algo que se estabeleceu rápido demais. Em um quadro privado, isso sobe; em um quadro de grupo, deixe a maior parte para a sala.
  5. Trazer de volta uma expectativa (o que foi planejado) ao lado do que aconteceu.
  6. Abrir espaço para ensaio, geralmente depois que a sala deu sentido às coisas.

Frequentemente, a nota certa é nenhuma: dois cartões bem colocados já fazem o trabalho 1. Uma nota de status com informações reais (o que está pendente, quem deve o que a quem) é boa; uma nota explicando o quadro não é.

Perguntas são para uma ou duas notas fazendo os trabalhos 2 ou 4. Uma parede de títulos de perguntas em segunda pessoa faz a pergunta da sala por ela e soa como escrita por máquina, assim como o texto autojustificativo que substitui. Os títulos permanecem resumos.

Pare no significado. Não nomeie grupos, não escreva "isso mostra…", "insight chave" ou "o tema aqui é…" e não legende por que dois cartões estão juntos. O posicionamento faz a afirmação, e alguém pode contestar um posicionamento movendo um cartão. Também não coloque ressalvas em todos os cartões: uma ressalva pertence ao único cartão que ela altera.

Em vez deEscreva
título "Notas de preço, 23 de jul", corpo: um trecho de 280 caracteresresumo "Links compartilhados trazem visitantes que não ficam", gancho "eles leem uma vez e vão embora"
título "Kim, chamada de suporte", corpo: uma frase completa sobre a exportaçãoresumo "Kim exporta tudo para uma planilha", gancho "eu só quero que"

Habilidades Relacionadas