Communitygithub.com

loganngarcia/framer-chatbot

Crie sites de portfólio com miniaplicativo, documento e quadro branco. Use quando perguntado sobre 'portfólio', 'mostrar meu trabalho', 'site de portfólio', 'portfólio de design', 'portfólio de projetos' ou 'criar meu portfólio'.

O que é framer-chatbot?

Esta skill guia o estudante na criação de um portfólio profissional utilizando as ferramentas integradas do Curastem. Ela orquestra três capacidades principais: o editor de documentos (update_doc) para redigir conteúdo textual, o quadro branco (update_whiteboard) para planejamento visual da estrutura, e o construtor de miniaplicativos (create_app) para gerar um site de portfólio interativo completo em um único arquivo HTML. O fluxo de trabalho é dividido em três etapas: planejar a estrutura do portfólio no quadro branco, redigir seções como 'Sobre', projetos e contato no editor de documentos, e construir o site final com o create_app, seguindo diretrizes visuais específicas (fundo #141414, margem superior de 48px, cantos arredondados de 28px e rótulo do Curastem no canto inferior direito). A skill é ideal para estudantes que desejam criar um portfólio para candidaturas a empregos ou estágios, e suporta iteração contínua com base no feedback do aluno.

Funciona com~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/loganngarcia/framer-chatbot/tree/HEAD/skills/create-a-portfolio

Perguntar na sua IA favorita

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

Documentação

Criar um Portfólio

Guie os estudantes na construção de um portfólio profissional usando as ferramentas integradas do Curastem. O Curastem oferece três capacidades principais que você deve usar: o editor de documentos (update_doc) para conteúdo escrito, o quadro branco (update_whiteboard) para planejamento visual e o construtor de miniaplicativos (create_app) para sites de portfólio interativos.

Ferramentas do Curastem a Serem Usadas

1. Editor de Documentos (update_doc)

Use para redigir o texto do portfólio, seções 'Sobre', descrições de projetos e informações de contato. O documento suporta HTML completo: cabeçalhos, listas, links, negrito, itálico. Perfeito para escrever e editar texto antes de passar para o aplicativo de portfólio.

2. Quadro Branco (update_whiteboard)

Use para planejar a estrutura do portfólio: mapas mentais das seções, fluxogramas da jornada do usuário, esboços de wireframe do layout. Crie diagramas visuais mostrando o fluxo página inicial → projetos → sobre → contato. Ajuda os estudantes a se organizarem antes de construir.

3. Construtor de Miniaplicativos (create_app)

Use para gerar um site de portfólio funcional. Gere um único arquivo HTML com CSS e JavaScript embutidos. Deve incluir: cartões de projeto, navegação, seção 'Sobre', formulário de contato ou links. Siga as diretrizes do aplicativo Curastem: fundo #141414, margem superior de 48px, rótulo Curastem.org no canto inferior direito, cantos arredondados de 28px em estilo neobrutalista ou moderno, IDs únicos em todos os elementos interativos.

Quando Aplicar

  • O estudante deseja criar um portfólio para candidaturas a empregos ou estágios
  • O estudante precisa mostrar trabalhos de design, programação ou criativos
  • O estudante pergunta sobre estrutura de portfólio, plataformas ou melhores práticas
  • O estudante deseja feedback sobre um portfólio existente ou construir um do zero

Fluxo de Trabalho

  1. Planejar — Use o quadro branco para mapear as seções e a estrutura do portfólio
  2. Redigir — Use o editor de documentos para escrever o texto 'Sobre', descrições de projetos e informações de contato
  3. Construir — Use create_app para gerar um site de portfólio interativo que o estudante possa visualizar e iterar

Orientações Principais

  • Recomende a estrutura: hero, projetos (com descrições), sobre, contato
  • Enfatize clareza, estudos de caso de projetos com resultados e contato fácil
  • Para create_app: garanta layout responsivo para dispositivos móveis, botões acessíveis, links que abrem em nova aba
  • Itere: os estudantes podem solicitar alterações no aplicativo, documento ou quadro branco conforme refinam

Habilidades Relacionadas