Publicar URL

Para o facilitador⏱ 10 min

Esta é a fase final de conteúdo técnico. Publique as duas versões em URLs separadas — assim cada participante pode compartilhar os dois links e qualquer pessoa pode comparar. O momento de abrir as duas URLs no celular lado a lado é o encerramento visual do workshop.

Vamos publicar as duas versões da landing page em URLs públicas separadas para comparação direta. A V1 é a interpretação livre do UX agent. A V2 é a mesma LP depois do sistema de design do Claude Design. Dois links, uma decisão de design.

10 min · Fase 09 de 10

Comparar localmente antes de publicarConfirme que as duas versões estão como esperado:

terminal

# abrir as duas versões no browser local para referência
open docs/pages/page-ux-v1.html docs/pages/page-ux-v2.html

Se o servidor ainda está rodando na porta 4321: e .

Publicar com o agente DevOpsCole o prompt no Claude Code para publicar automaticamente:

claude code — devops

Você é um especialista em DevOps. Sua tarefa é publicar as duas versões da landing page deste projeto em URLs públicas para comparação.

LEIA ANTES DE COMEÇAR:
- docs/brand-brief.md (para o nome do domínio)
- docs/pages/page-ux-v1.html (Versão 1 — pré Claude Design)
- docs/pages/page-ux-v2.html (Versão 2 — pós Claude Design)

PUBLIQUE AS DUAS VERSÕES COM SURGE.SH:

Versão 1:
npx surge docs/pages [nome-da-marca]-v1.surge.sh

Versão 2:
npx surge docs/pages [nome-da-marca]-v2.surge.sh

Substitua [nome-da-marca] por um slug baseado no brand-brief (ex: joao-silva, maria-dev).

APÓS PUBLICAR:
1. Confirme que ambas as URLs estão acessíveis
2. Teste no celular (responsividade)
3. Registre as duas URLs em docs/smart-memory/shared-context.md

RESULTADO ESPERADO:
- [nome]-v1.surge.sh → Versão 1 (pré Claude Design)
- [nome]-v2.surge.sh → Versão 2 (pós Claude Design)
- URLs registradas na smart-memory

Ou publicar manualmente com Surge.sh

Versão 1 — pré Claude Design

terminal

npx surge docs/pages [nome-da-marca]-v1.surge.sh

Versão 2 — pós Claude Design

terminal

npx surge docs/pages [nome-da-marca]-v2.surge.sh

Substitua por um slug baseado no brief. Ex:

Comparar e compartilharCom as duas URLs no ar:

V1 — pré Claude Design

[nome]-v1.surge.sh
UX livre com só tokens

V2 — pós Claude Design

[nome]-v2.surge.sh
Mesma jornada, sistema visual real

Abra as duas no celular. Compartilhe os dois links no chat do workshop — todos podem comparar as versões de cada participante.

O argumento finalA V1 e a V2 têm o mesmo copy, a mesma estrutura de jornada, as mesmas decisões de UX. A diferença é o vocabulário visual — e a V2 é mais consistente porque o botão, o card e a tipografia vêm de um sistema com regras, não de decisões ad-hoc. É isso que um design system faz: não muda o que você diz, muda como parece quando diz.

Do briefing ao deploy. Dois links. Você decide.