# Aprova o desenho antes de pedires o código.

> Pede primeiro um artboard da página. Mudar um desenho custa minutos; mudar código já feito custa horas.

Categoria: Claude Code · Publicado: 2026-10-28 · Autor: Carlos Imlau (https://www.carlosimlau.com)

## O problema

Quando peço uma página nova diretamente em código, a primeira versão quase nunca é a que eu queria. Cada ajuste visual obriga a mexer em componentes, estilos e textos ao mesmo tempo.

## O prompt

```text
Antes de escreveres código, monta um artboard desta página
com o design system do site: [cores, fontes, componentes].

Quero ver:
- a versão para desktop e a versão para telemóvel;
- os textos reais, sem lorem ipsum;
- o que é clicável a funcionar (filtros, botões, formulários).

Não toques no projeto até eu aprovar o artboard.
```

## Onde o testei

Nas páginas /formacao (17 de outubro) e /dicas (20 de outubro) deste site. Nas duas, aprovei o artboard primeiro, e a construção passou a ser só aplicar o que já estava decidido.

## Quando não usar

Em ajustes pequenos numa página que já existe, como trocar um texto ou uma cor. Aí, o artboard é mais trabalho do que a alteração.

Fonte: https://www.carlosimlau.com/dicas/mostra-o-design-antes-do-codigo