Skip to main content

prototype

Construa um protótipo descartável para responder a uma dúvida de design. Use quando o usuário quiser verificar se um modelo de estado ou lógica faz sentido, ou explorar como uma interface deve parecer.

معلومات المصدر

المستودع
matheusdmlopes/skills-ptbr
آخر نشاط في المصدر
١٥ أغسطس ٢٠٢٦ في ٢٠:٥٦
لغة SKILL.md المكتشفة
البرتغالية
النجوم
٠
التفرعات
٠

خيارات التثبيت

يُحدَّد Prompt الذي يراجع المصدر أولًا بشكل افتراضي. يمكنك التبديل إلى أمر مباشر أو تنزيل نسخة محلية.

مراجعة ملفات المصدر

اقرأ SKILL.md وأي ملفات مرافقة يعرضها SkillsMP قبل أن تقرر التثبيت.

مستكشف الملفات
4 ملفات

عرض SKILL.md

SKILL.md
تعليمات المصدر · معاينة للقراءة فقط
name
prototype
description
Construa um protótipo descartável para responder a uma dúvida de design. Use quando o usuário quiser verificar se um modelo de estado ou lógica faz sentido, ou explorar como uma interface deve parecer.
# Protótipo Um protótipo é **código descartável que responde a uma dúvida**. A dúvida decide o formato. ## Escolha um caminho Identifique qual dúvida está sendo respondida — a partir do prompt do usuário, do código ao redor ou perguntando se o usuário estiver por perto: - **"Essa lógica / modelo de estado faz sentido?"** → [LOGIC.md](LOGIC.md). Construa um único arquivo HTML compartilhável — botões de uso livre mais tutoriais guiados em abas — que conduza a máquina de estados por casos difíceis de avaliar no papel e que uma pessoa não desenvolvedora possa operar. - **"Como isso deve parecer?"** → [UI.md](UI.md). Gere várias variações visuais radicalmente diferentes em uma única rota, alternáveis via parâmetro de busca na URL (search param) e uma barra inferior flutuante. Os dois caminhos produzem artefatos muito diferentes — errar nisso desperdiça o protótipo inteiro. Se a dúvida for genuinamente ambígua e o usuário não estiver acessível, adote por padrão o caminho que melhor corresponder ao código ao redor (um módulo de backend → lógica; uma página ou componente → interface) e declare essa premissa no topo do protótipo. ## Regras que se aplicam a ambos 1. **Descartável desde o primeiro dia, e claramente demarcado como tal.** Posicione o código do protótipo próximo de onde ele realmente será usado (ao lado do módulo ou da página para a qual está sendo prototipado) para que o contexto fique óbvio — mas nomeie-o de modo que um leitor casual veja que é um protótipo, não código de produção. Para rotas de interface descartáveis, siga a convenção de rotas que o projeto já utiliza; não invente uma nova estrutura no nível raiz. 2. **Trivial de executar.** Um protótipo de interface inicia a partir de um único comando no executor de tarefas do projeto — `pnpm <nome>`, `python <caminho>`, `bun <caminho>`, etc. Uma demonstração de lógica é um único arquivo HTML no qual o usuário clica duas vezes. De qualquer forma, não deve exigir esforço mental para iniciar. 3. **Sem persistência por padrão.** O estado vive na memória. A persistência é aquilo que o protótipo está _testando_, não algo de que ele deva depender. Se a dúvida envolver explicitamente um banco de dados, utilize um banco temporário ou um arquivo local com um nome claro como "PROTOTYPE — wipe me". 4. **Ignore o polimento.** Sem testes, sem tratamento de erros além do estritamente necessário para tornar o protótipo _executável_, sem abstrações. O objetivo é aprender algo rápido. 5. **Exponha o estado.** Após cada ação (lógica) ou a cada troca de variante (interface), imprima ou renderize todo o estado relevante para que o usuário possa ver o que mudou. 6. **Capture ao terminar.** Incorpore qualquer decisão validada ao código real, depois capture o próprio protótipo como uma **fonte primária**: faça commit dele em uma branch descartável, fora da main, e deixe um ponteiro de contexto para essa branch na issue de implementação. Capture também a resposta — o veredito e a dúvida que ele resolveu — na issue ou em um commit. A branch main mantém apenas a decisão validada.
عرض على GitHub