Novo Aprenda a editar vídeos com o Claude. Você só grava, ele edita. Curso Só Grava por R$97. Quero aprender ›

Passo a passo grátis

Faça o Claude desenhar como a Apple.

Duas skills gratuitas ensinam pro Claude as regras de design da Apple: cor, fonte, espaço, toque e animação. Você instala em 2 minutos e ele passa a entregar site com essa cara.

Instalar agora Ver o site que eu fiz
pomar-iphone.vercel.app
Site da Pomar, loja de iPhone feita com as duas skills
O mesmo site no celular

O que você instala

Duas skills. Uma cuida do visual, a outra do toque.

Skill é um arquivo de instruções que o Claude lê antes de trabalhar. Essas duas ensinam o jeito Apple de fazer tela.

O visual

apple-hig-designer

Cores da Apple com modo claro e escuro, a fonte do iPhone, espaço medido em múltiplos de 8 e as curvas de animação que eles usam.

coresfonteespaçamentomodo escuro
Ver no GitHub

O toque

apple-design

Botão que responde na hora do toque, animação com efeito de mola e coisa que acompanha o dedo quando você arrasta. Ainda revisa o seu site e aponta o que foge do padrão.

toquemolaarrastarrevisão
Arrasta e solta
Ver no GitHub

Nenhuma das duas é da Apple. Foram feitas pela comunidade em cima das regras que a própria Apple publica e das palestras da WWDC, o evento anual deles.

O resultado

Olha o que sai com elas.

Eu fiz a Pomar, uma loja de iPhone de mentira, só pedindo pro Claude com as duas skills ligadas. Abre no celular e arrasta o iPhone pra ver ele girar.

Abrir o site da Pomar
Seção da câmera na Pomar
Uma ideia por telaCada parte mostra uma coisa só, igual a Apple faz.
Modelos lado a lado na Pomar
Modelos lado a ladoComparar fica fácil, com preço e botão em cada um.
Tela de montar o iPhone na Pomar
Monte o seuEscolhe cor e tamanho e o preço muda na hora.

Outro exemplo

A página da minha comunidade também foi refeita com elas.

Mesmo texto, mesmo preço, só o visual mudou. Ficou com cara de página de produto da Apple.

Ver a página
Página da Comunidade Dinastia no estilo Apple

Passo a passo

Instala em 2 minutos.

Escolhe onde você usa o Claude. Os dois jeitos funcionam.

O Claude Code é o mais rápido: você cola uma frase e ele faz o resto.

  1. Abre o Claude Code

    Pode ser no terminal, no VS Code ou no app do Claude, na aba Code.

  2. Cola essa frase e aperta enter

    Ele baixa as duas skills e coloca cada uma no lugar certo. Se pedir permissão, aprova.

  3. Fecha e abre de novo

    A skill só aparece numa conversa nova. Fecha o Claude Code e abre outra vez.

  4. Confere se deu certo

    Pergunta isso. Ele tem que citar a apple-hig-designer e a apple-design.

Novo curso · Só Grava

Aprenda a editar vídeos com o Claude.

Você grava falando pro celular e o Claude corta o silêncio, escreve a legenda, coloca música, animação e desenho na tela. O vídeo sai pronto pra postar.

  • Corta silêncio e repetição sozinho
  • Legenda palavra por palavra
  • Música, animação e desenho na tela
  • Sem abrir programa de edição
R$97pagamento único · acesso na hora
Quero aprender a editar
Reel editado pelo Claude com legenda e cartão
Reel editado pelo Claude: você só grava
Os três vídeos foram editados pelo Claude.

Prompts prontos

Copia, cola e pede.

Com as skills instaladas, é só pedir. Esses são os pedidos que eu mais uso.

Dúvidas

Perguntas que todo mundo faz

É de graça?
É. As duas skills são abertas e gratuitas, com licença MIT. Você pode usar até em projeto de cliente.
É oficial da Apple?
Não. As duas foram feitas pela comunidade em cima das regras de design que a Apple publica e das palestras da WWDC. Não têm nenhuma ligação com a Apple.
Funciona no plano grátis do Claude?
Funciona. No app do Claude as skills estão liberadas em todos os planos, inclusive no grátis. Só precisa ligar a execução de código, que está no passo 2.
Preciso saber programar?
Não. Você pede em português e o Claude faz. A skill só ensina pra ele o jeito Apple de fazer.
Instalei e parece que o Claude não está usando
Abre uma conversa nova e cita o nome no pedido, tipo “usa a skill apple-design”. No Claude Code, confere se existe a pasta .claude/skills/apple-design dentro da sua pasta de usuário. No app, confere se as duas estão ligadas em Personalizar › Skills.
Prefiro baixar direto do GitHub
Pode. Os dois links estão logo acima. No Claude Code, cola o link e pede “instala essa skill pra mim”. No pacote do Emil Kowalski vêm várias skills juntas: se quiser só a do toque, pede pra instalar só a apple-design.

Quer ir além?

Aprenda a construir sites assim.

Na Comunidade Dinastia eu ensino a criar site, sistema e ferramenta com o Claude, sem programar.

Conhecer a Dinastia
Capa do curso Só Grava Só Grava! O resto o Claude faz.Aprenda a editar vídeos com o Claude por R$97. Quero aprender ›
Copiado