Codex use case
Transforme histórias de usuário em mockups de interface
Transforme feedback sobre o produto, discussões em issues e informações de design em mockups que sua equipe possa avaliar e implementar.
Use o Codex para reunir feedback sobre o produto no Slack, no Linear e no Google Drive. A partir desse material, organize as histórias de usuário, identifique as restrições e gere mockups de interface com o ImageGen. Depois de escolher uma proposta, transforme o mockup em um protótipo funcional.
Best for
- Equipes de produto que reúnem feedback de várias fontes para definir a direção visual de uma funcionalidade.
- Equipes de design e engenharia que querem criar mockups com base no material de referência antes de começar a implementação.
- Equipes que querem ajustar propostas rapidamente com base no feedback dos usuários.
Contents
Transforme histórias de usuário em mockups de interface
Transforme feedback sobre o produto, discussões em issues e informações de design em mockups que sua equipe possa avaliar e implementar.
Use o Codex para reunir feedback sobre o produto no Slack, no Linear e no Google Drive. A partir desse material, organize as histórias de usuário, identifique as restrições e gere mockups de interface com o ImageGen. Depois de escolher uma proposta, transforme o mockup em um protótipo funcional.
Use o Codex para reunir feedback sobre o produto no Slack, no Linear e no Google Drive. A partir desse material, organize as histórias de usuário, identifique as restrições e gere mockups de interface com o ImageGen. Depois de escolher uma proposta, transforme o mockup em um protótipo funcional.
Related links
Best for
- Equipes de produto que reúnem feedback de várias fontes para definir a direção visual de uma funcionalidade.
- Equipes de design e engenharia que querem criar mockups com base no material de referência antes de começar a implementação.
- Equipes que querem ajustar propostas rapidamente com base no feedback dos usuários.
Skills & Plugins
- Busque histórias de usuário, dificuldades, citações e perguntas em aberto nos canais e nas conversas aprovados para a coleta de feedback.
- Inclua no briefing do mockup os pedidos de novas funcionalidades, os relatos de bugs, as etiquetas, as prioridades e o contexto do projeto.
- Leia anotações de pesquisa, resumos de chamadas, documentos, planilhas e apresentações que contenham feedback sobre o produto ou requisitos de design.
- Reúna informações de design, capturas de tela e referências do sistema de design para que os mockups sigam a linguagem visual do produto.
- ImageGenUse as histórias de usuário consolidadas e as restrições de design para criar mockups de interface, explorar variações e estabelecer uma referência visual.
- Transforme o mockup escolhido em um protótipo web funcional e confira se a implementação corresponde ao mockup.
| Skill | Why use it |
|---|---|
| Slack | Busque histórias de usuário, dificuldades, citações e perguntas em aberto nos canais e nas conversas aprovados para a coleta de feedback. |
| Linear | Inclua no briefing do mockup os pedidos de novas funcionalidades, os relatos de bugs, as etiquetas, as prioridades e o contexto do projeto. |
| Google Drive | Leia anotações de pesquisa, resumos de chamadas, documentos, planilhas e apresentações que contenham feedback sobre o produto ou requisitos de design. |
| Figma | Reúna informações de design, capturas de tela e referências do sistema de design para que os mockups sigam a linguagem visual do produto. |
| ImageGen | Use as histórias de usuário consolidadas e as restrições de design para criar mockups de interface, explorar variações e estabelecer uma referência visual. |
| Build Web Apps | Transforme o mockup escolhido em um protótipo web funcional e confira se a implementação corresponde ao mockup. |
Starter prompt
Introdução
Equipes de produto costumam reunir feedback de várias fontes, como conversas no Slack, issues no Linear, documentos ou planilhas no Google Drive e anotações de chamadas com clientes. Às vezes, a equipe já tem histórias de usuário que descrevem com clareza o problema que quer resolver. Em outros casos, o contexto está espalhado por essas fontes.
O ChatGPT pode reunir esse contexto e criar uma representação visual da interface de um recurso que resolveria o problema. Depois que você validar a proposta, o Codex poderá implementar o recurso no produto.
Crie uma referência visual
Se você já tem uma história de usuário bem definida, comece por ela. Caso contrário, converse primeiro com o ChatGPT para reunir o contexto de diferentes fontes e sintetizá-lo em uma história de usuário.
Em seguida, peça ao ChatGPT que use a geração de imagens para criar algumas propostas visuais para a interface. As propostas devem preservar a arquitetura da informação do produto e respeitar as restrições do sistema de design.
Se for útil, forneça capturas de tela da interface atual ou um arquivo do Figma como referência.
Repita o processo até chegar a uma proposta que atenda ao que você precisa. Quanto mais delimitado for o escopo das alterações, maior será a chance de o Codex gerar uma proposta que possa ser implementada diretamente.
Transforme a proposta visual em um protótipo
Use a imagem final da proposta que você quer que o Codex implemente. Selecione o Codex, inicie um novo chat e anexe a imagem novamente, em vez de continuar no chat do ChatGPT. Em seguida, peça ao Codex que implemente a interface da imagem para transformá-la em um protótipo funcional. Se estiver criando um aplicativo web, você pode usar o plugin Build Web Apps nessa etapa.
Related use cases
Coordene a integração de novos funcionários
Use o ChatGPT para reunir informações aprovadas sobre os novos funcionários, propor...
Elabore PRDs com base em informações internas
Use o ChatGPT com a habilidade $documents e plug-ins conectados, como Linear, Slack, Notion...
Escreva um resumo semanal do trabalho
Compartilhe com o ChatGPT sua agenda, os documentos que você editou, as mensagens que...