Tutorial completo: crie um lindo aplicativo móvel com código Claude e lápis em 16 minutos

In This Article

Caros assinantes, Hoje quero mostrar a vocês como construir um lindo aplicativo móvel para monitorar seus treinos. Construir um aplicativo móvel costumava exigir uma equipe de engenheiros. Mas ferramentas de IA como Claude Code e Pencil tornaram mais fácil para você enviar um lindo aplicativo sozinho, mesmo que você não saiba como codificar.Assista ao meu tutorial para ver como fazer isso em apenas 16 minutos.Carimbos de data e hora:(0:00) O que construiremos: Um lindo aplicativo móvel para monitorar seus treinos(2:01) Etapa 1: Definir requisitos com Claude(6:11) Etapa 2: Criar designs com Pencil(8:56) Etapa 3: Crie o aplicativo com Claude Code(14:21) Obtendo o aplicativo na App Store(15:19) Recapitulação de todas as 3 etapasAssista agora no YouTube ou leia o guia escrito abaixo.Estou orgulhoso da parceria com…GranolaGranola acaba de lançar o Spaces — uma nova maneira para sua equipe organizar e compartilhar anotações de reuniões entre si. Por exemplo, você pode criar um espaço “Chamadas de usuários” com suas entrevistas para permitir que qualquer pessoa faça perguntas sobre as necessidades dos usuários. Você pode até fazer perguntas diretamente no Claude, ChatGPT ou Gemini com as novas APIs e MCP da Granola. Experimente Granola gratuitamenteO que criaremos: Um aplicativo móvel para monitorar seus treinosVivemos em uma época em que é mais fácil codificar seu próprio aplicativo móvel do que encontrar um existente que você goste. Então, vamos criar um aplicativo que possa:Criar treinos selecionando um exercício e, em seguida, o número de séries e repetições.Acompanhe os treinos ao vivo tocando em cada série de exercícios para concluí-los. Meça o progresso por meio de um calendário e gráficos para cada exercício. Mostrarei como construí-lo nas três etapas abaixo.1. Defina os requisitos com Claude Sempre peça ao Claude para fazer perguntas ao definir os requisitos juntos. Vamos começar colando este prompt no Claude: Vamos trabalhar juntos nos requisitos para um aplicativo de fitness móvel. Quero três telas:Adicionar/editar treinos: Crie treinos e adicione exercícios com séries e repetiçõesSessão de treino: Acompanhe os treinos em tempo real, toque para completar as sériesCalendário: veja em quais dias você treinou e veja os detalhes do treinoEste é o básico, mas vamos trabalhar nas especificações juntos. Quero que você seja claro sobre os requisitos e, se tiver alguma dúvida, pergunte em uma lista numerada. A parte mais importante desta solicitação é “Se você tiver alguma dúvida, pergunte em uma lista numerada”. Eu sempre incluo esta linha ao discutir requisitos com Claude para que ele possa me fazer perguntas para melhorar as especificações. Aqui estão alguns exemplos de perguntas e respostas: Claude: Você quer um temporizador de descanso? Eu: Sim, deixe-me personalizá-lo nas configurações. Claude: Você deseja descarregamento automático após conjuntos com falha? Eu: Não, vamos manter as coisas simples. Depois que Claude deixar as especificações em um estado que você esteja satisfeito, peça para ele: "Divida as especificações em design e requisitos técnicos. Não seja muito detalhado nos requisitos de design para que haja espaço para flexibilidade." Inclua a última linha porque Pencil (nosso designer de IA) é melhor em design do que Claude. 🙂 Vamos abordar isso a seguir. À medida que os modelos melhoram, fico mais preguiçoso em minhas instruções (e pior na ortografia)2. Projete as telas do celular com o PencilPencil criou 8 lindas telas do zero a partir de nossos requisitosÉ aqui que a mágica acontece. Veja como usar o Pencil para criar telas móveis lindamente elaboradas em vez de desperdício de IA: Leia mais

You May Also Like

13 Trending Songs on TikTok in March 2026 (+ How to Use Them)

Our Best AI PM Workflows for Prototyping, Strategy, and Personal OS (2026)

China’s Cybersecurity Agency Issues Security Warning About OpenClaw