Conceitos-Chave
- AI (Inteligência Artificial): Tecnologia que permite que as máquinas simulem a inteligência humana, permitindo-lhes aprender, raciocinar e resolver problemas.
- Prompt: Um comando de texto usado para instruir um modelo de IA. Na Lumi, os prompts são a ferramenta fundamental que utilizará para criar e modificar cada componente da sua aplicação.
Termos Específicos da Lumi
- Modo de Discussão: Mais do que um gerador de código, a Lumi atua como um parceiro de desenvolvimento interativo. Guia-o através do planeamento, depuração e lançamento, ajudando-o a construir com confiança.
- Modo de Edição: O ambiente para fazer alterações diretas ao código e conteúdo da sua aplicação.
- Editar: Uma ferramenta alimentada por IA com controlos visuais nativos do Tailwind para um refinamento preciso e intuitivo.
- Remix: Duplique qualquer projeto para usar como um novo ponto de partida. O Remixing permite-lhe experimentar alterações e explorar ideias, preservando a versão original.
- Pré-visualização: Uma vista interativa e em tempo real para testar funcionalidades e conteúdo antes de publicar as suas alterações.
Produto e Desenvolvimento
Gestão de Produto e Estratégia
- MVP (Produto Mínimo Viável): A versão mais simples de um produto com funcionalidades suficientes para atrair os primeiros utilizadores e validar a ideia central.
- Roadmap: Um plano de alto nível que descreve a visão, direção e futuras funcionalidades de um produto ao longo do tempo.
- Pedido de Funcionalidade: Uma sugestão de utilizadores ou partes interessadas para uma nova capacidade ou melhoria.
- História de Utilizador: Uma descrição breve e simples de uma funcionalidade da perspetiva do utilizador final.
- Jornada do Utilizador: O caminho que um utilizador percorre para atingir um objetivo dentro do seu produto.
- Persona: Um perfil detalhado e fictício de um utilizador-alvo, criado a partir de pesquisa para orientar as decisões de design e desenvolvimento.
Conceitos de Engenharia
- PRD (Documento de Requisitos do Produto): Um documento que detalha o propósito, as funcionalidades e as especificações técnicas de um produto para orientar a equipa de desenvolvimento.
- API (Interface de Programação de Aplicações): Um conjunto de regras que permite que diferentes aplicações de software comuniquem e troquem dados. Os tipos comuns incluem APIs REST e GraphQL.
- Refatorizar: O processo de reestruturar o código para melhorar a sua qualidade e manutenibilidade sem alterar a sua funcionalidade.
- GitHub: Uma plataforma popular para controlo de versões e desenvolvimento de software colaborativo.
Dados e Análise
- Teste A/B: Comparar duas versões de uma página web ou funcionalidade para ver qual delas tem melhor desempenho.
- Taxa de Conversão: A percentagem de utilizadores que concluem um objetivo específico, como inscrever-se ou fazer uma compra.
- Taxa de Abandono (Churn Rate): A percentagem de utilizadores que deixam de usar o seu produto durante um período específico.
- Taxa de Retenção: A percentagem de utilizadores que continuam a usar o seu produto ao longo do tempo.
- Rastreamento de Eventos: Monitorizar ações específicas do utilizador (como cliques ou submissões de formulários) para compreender o envolvimento.
UI/UX e Desenvolvimento Frontend
Desenvolvimento Frontend
- Frontend: A parte de uma aplicação que os utilizadores veem e com a qual interagem, incluindo a interface do utilizador e a experiência geral.
- React: Uma biblioteca JavaScript popular para construir interfaces de utilizador dinâmicas, especialmente para aplicações de página única.
- Gradiente: Uma transição suave entre duas ou mais cores.
- Tailwind CSS: Uma framework CSS “utility-first” para construir rapidamente designs personalizados diretamente no seu HTML.
- Sistema de Design: Uma coleção padronizada de componentes reutilizáveis e diretrizes que garante a consistência do design em todo o produto.
Conceitos de Design UI/UX
- Cor de Destaque: Uma cor contrastante usada para realçar elementos-chave como botões ou links.
- Tema: A aparência geral de uma aplicação, definida pelo seu esquema de cores, tipografia e layout.
- Design Responsivo: Uma abordagem que garante que a sua aplicação tenha uma boa aparência e funcione bem em qualquer dispositivo, desde computadores de secretária a telemóveis.
- Acima da Dobra (Above the Fold): O conteúdo visível numa página web sem necessidade de rolar. É um espaço privilegiado para informações importantes.
- CTA (Chamada para Ação): Um apelo, como um botão ou link, que incentiva os utilizadores a realizar uma ação específica (por exemplo, “Inscrever-se”, “Comprar Agora”).
Estrutura da Página e Navegação
- Títulos: Títulos (H1, H2, etc.) que estruturam o conteúdo e estabelecem uma hierarquia visual clara.
- Rodapé: A secção na parte inferior de uma página web, que normalmente contém links, informações de contacto e avisos legais.
- Breadcrumb: Um rasto de navegação que mostra a localização atual de um utilizador num site (por exemplo, Início > Produtos > Portáteis).
- Favicon: O pequeno ícone que representa o seu site no separador do navegador ou nos favoritos.
- Meta Título: O título da página exibido nos resultados dos motores de busca e nos separadores do navegador, crucial para SEO.
- Meta Descrição: O breve resumo de uma página web mostrado nos resultados de busca para atrair cliques.
- URL Canónico: Uma tag que informa os motores de busca sobre a versão preferida de uma página para evitar problemas de conteúdo duplicado.
- Slug do URL: A parte amigável de um URL que identifica uma página específica (por exemplo,
/sobre-nos
). - Sitemap: Um ficheiro que lista todas as páginas do seu site para ajudar os motores de busca a indexá-las eficazmente.
- Barra de Navegação (Nav Bar): O menu principal que fornece links para as secções principais do seu site.
- Links de Salto: Links de acessibilidade que permitem aos utilizadores contornar a navegação e saltar diretamente para o conteúdo principal.
- Paginação: Um sistema para dividir longas listas de conteúdo em páginas separadas.
- Link Âncora: Um link que leva o utilizador a uma secção específica na mesma página.
- Página 404: Uma página de erro personalizada exibida quando um utilizador tenta aceder a um URL que não existe.
Notificações e Feedback
- Toast: Uma notificação pequena e temporária que fornece feedback breve sobre uma ação.
- Snackbar: Semelhante a um toast, mas aparece frequentemente na parte inferior do ecrã e pode incluir um botão de ação (por exemplo, “Desfazer”).
- Tooltip: Uma caixa pop-up com informações extra que aparece ao passar o rato sobre um elemento.
- Emblema (Badge): Um pequeno marcador visual num ícone ou botão para indicar uma contagem, estado ou notificação.
- Spinner de Carregamento: Um ícone animado que indica que um processo está a decorrer em segundo plano.
- Barra de Progresso: Uma barra visual que mostra o progresso da conclusão de uma tarefa.
- Skeleton Loader: Uma UI de placeholder que imita o layout do conteúdo final, melhorando a perceção da velocidade de carregamento.
Sobreposições e Pop-ups
- Popover: Uma sobreposição que fornece contexto adicional ou opções relacionadas com um elemento específico.
- Diálogo (Modal): Uma janela que aparece sobre o conteúdo principal, exigindo a interação do utilizador para ser fechada.
- Gaveta (Painel Lateral): Um painel que desliza da lateral, contendo normalmente navegação ou definições.
- Lightbox: Uma janela modal que exibe multimédia, como imagens, numa vista focada e ampliada.
- Caixa de Alerta: Uma mensagem do sistema que informa os utilizadores sobre informações críticas, erros ou avisos.
Navegação e Seleção
- Botão: Um elemento clicável que desencadeia uma ação.
- Interruptor (Toggle): Um controlo que permite aos utilizadores alternar entre dois estados, como ligado e desligado.
- Separadores (Tabs): Um componente que organiza o conteúdo em diferentes vistas entre as quais um utilizador pode alternar.
- Stepper (Assistente): Um processo guiado de múltiplos passos que mostra aos utilizadores o seu progresso.
- Acordeão: Uma série de painéis recolhíveis usados para organizar e revelar conteúdo.
- Menu Suspenso (Dropdown): Uma lista de opções que aparece quando um utilizador interage com um botão ou campo.
Formulários e Entrada de Dados
- Formulário: Um conjunto de campos para recolher dados do utilizador, como um formulário de inscrição ou de contacto.
- Grupo de Botões de Rádio: Um conjunto de opções onde o utilizador pode selecionar apenas uma.
- Caixa de Seleção (Checkbox): Um controlo que permite aos utilizadores selecionar uma ou mais opções de uma lista.
- Campo de Texto: Uma caixa de entrada padrão para a inserção de texto de uma única linha.
- Área de Texto: Uma caixa de entrada maior para texto de várias linhas, como comentários ou mensagens.
- Select (Caixa de Seleção Suspensa): Uma lista suspensa para escolher uma opção de um conjunto predefinido.
- Seletor de Data: Uma interface de calendário que permite aos utilizadores selecionar uma data facilmente.
- Slider: Um controlo para selecionar um valor de um intervalo contínuo.
- Carregamento de Ficheiros: Um componente que permite aos utilizadores carregar ficheiros do seu dispositivo.
- Preenchimento Automático (Autocomplete): Um campo de entrada que sugere resultados à medida que o utilizador digita.
Estilos e Tendências de Design
Use estes termos nos seus prompts para definir a estética que deseja alcançar.- Neobrutalismo: Um estilo de design cru, de alto contraste, com tipografia arrojada e elementos não refinados.
- Retro: Um design que evoca nostalgia ao usar estilos de décadas passadas.
- Hacker: Uma estética inspirada em interfaces de terminal, com fundos escuros e fontes monoespaçadas.
- Glassmorfismo: Um estilo que usa camadas translúcidas, semelhantes a vidro fosco, para criar profundidade.
- Nudy: Uma abordagem minimalista que usa paletas de cores suaves e neutras para um visual discreto.
Desenvolvimento Backend e Bases de Dados
Fundamentos de Backend
- Backend: O lado do servidor de uma aplicação que lida com dados, lógica e operações centrais.
- Webhooks: Mensagens automatizadas enviadas por aplicações quando algo acontece, permitindo a troca de dados em tempo real.
Gestão de Bases de Dados
- CRUD (Create, Read, Update, Delete): As quatro operações fundamentais para gerir dados.
- SQL (Structured Query Language): A linguagem padrão para gerir e consultar dados em bases de dados relacionais.
- PostgreSQL: Uma poderosa base de dados relacional de código aberto, conhecida pela sua fiabilidade e funcionalidades avançadas.
Segurança e Autenticação
- OAuth: Um padrão de autenticação que permite aos utilizadores iniciar sessão com contas de terceiros, como Google ou GitHub.
- Autenticação de Dois Fatores (2FA): Uma camada de segurança que exige que os utilizadores forneçam duas formas de identificação para iniciar sessão.
- CORS (Cross-Origin Resource Sharing): Um mecanismo de segurança que controla como os recursos no seu servidor podem ser acedidos a partir de outros domínios.