Sessão de percurso
Um dia de trabalhoR$ 780
- Um percurso principal desenhado
- Lista de telas numerada
- Folha de decisões e limites
- Gravação da sessão
O produto desenhado antes da primeira linha de código
Estúdio de UI/UX em Fortaleza. Levantamos o que a pessoa precisa resolver no seu produto, desenhamos o percurso dela, as telas e um protótipo que abre no celular — e entregamos esse material comentado para quem vai programar.
- Percurso antes da tela
- Protótipo que abre no celular
- Entrega comentada tela a tela
10
telas desenhadas
7
revisões com você
8
semanas de projeto
12
produtos por ano
Como o desenho anda
Cinco passos entre a ideia do produto e o protótipo na mão de quem usa
A ordem importa mais do que a ferramenta. Quase todo produto que chega aqui já tem telas desenhadas e nenhuma frase escrita sobre o que a pessoa veio fazer nele — e é essa frase que sustenta o resto.
01
Quem entra e para quê
Escrevemos em uma frase o que cada tipo de pessoa vem resolver no produto. Quando essa frase não existe, o desenho vira um menu com muitas portas e nenhuma direção.
02
O percurso em uma folha
Entrada, decisão, confirmação e saída cabem numa folha só. Mudar a ordem enquanto é traço custa uma borracha; mudar depois custa semana de quem programa.
03
Telas em cinza
Blocos, hierarquia e texto verdadeiro antes de qualquer cor. É aí que aparece o campo que ninguém preenche e o botão que ninguém acha.
04
Estado por estado
Lista vazia, dado carregando, erro do servidor, primeiro acesso e permissão negada. São cinco telas por função, e não uma decidida às pressas na hora de programar.
05
Protótipo que responde ao toque
As telas viram um arquivo navegável no aparelho de quem vai usar. A primeira pessoa a tocar no produto não precisa ser um cliente.
Os passos
Seis passos do projeto, cada um com algo que dá para abrir e olhar
Nenhum passo termina em promessa de passo seguinte: termina em folha, link ou arquivo que você recebe no mesmo dia.
Passo 1
Conversa de partida
Uma hora e meia para entender o produto, quem paga por ele e o que trava hoje. Sai uma folha com objetivo e limites.
Passo 2
Percursos desenhados
Os dois ou três caminhos principais, com as decisões marcadas e os pontos em que a pessoa costuma desistir.
Passo 3
Inventário de telas
A lista de todas as telas que o percurso exige, numerada e com o conteúdo que cada uma precisa carregar.
Passo 4
Rascunho em cinza
Hierarquia, espaçamento e texto real sem cor nenhuma. É o passo em que mais coisa muda, e de propósito.
Passo 5
Visual e estados
Cor, tipografia e os cinco estados de cada função aplicados às telas já aprovadas em cinza.
Passo 6
Protótipo e entrega
Arquivo navegável no celular, medidas e comentários tela a tela para quem vai programar.
Formatos
Três formas de trabalhar com o estúdio
Da sessão avulsa de percurso ao produto desenhado por inteiro, com acompanhamento enquanto o time programa.
Produto desenhado
Telas e protótipoR$ 2.520
- Percursos e inventário de telas
- Rascunho em cinza aprovado a dois
- Visual aplicado e estados previstos
- Protótipo navegável no celular
Desenho com acompanhamento
Projeto inteiroR$ 4.540
- Tudo do formato anterior
- Comentários tela a tela na entrega
- Revisões durante a programação
- Conferência das telas prontas
Sobre o orçamento
O valor fechado sai depois da conversa de partida, quando já se sabe quantos percursos o produto tem. Antes disso qualquer número seria chute.
Relatos
Quem já viu o próprio produto desenhado antes de existir
Cada relato abaixo foi lido e liberado por quem o escreveu.
O percurso em uma folha mostrou que a agenda tinha quatro telas onde eu imaginava uma. Descobrir isso em papel foi barato.
A tela de lista vazia me pegou de surpresa. Ninguém nunca tinha me perguntado o que o motorista vê no primeiro dia.
Peguei o protótipo, dei na mão de três recepcionistas e voltei com nove ajustes. Nenhum deles custou código.
Desenharam em cinza primeiro e eu reclamei. Na terceira reunião entendi que a cor estava escondendo a bagunça.
A entrega veio comentada tela a tela. O rapaz que programa parou de me ligar para perguntar o que era cada campo.
Contei o que o cliente vem fazer no aplicativo em uma frase. Metade das telas que eu queria não servia para essa frase.
Antes de começar
O que perguntam na primeira conversa
Seis perguntas que aparecem quase sempre, respondidas aqui para poupar a sua ligação.
Vocês programam o produto depois?
Não. Entregamos o desenho, o protótipo e os comentários de cada tela para o seu time ou para o estúdio de programação que você contratar. Ficamos por perto durante essa fase.
Já tenho telas prontas. Serve?
Serve como material de partida. Antes de redesenhar, refazemos o percurso: quase sempre o problema está no caminho, e não no botão.
Quem decide o que entra em cada tela?
Você decide o conteúdo, nós defendemos a ordem. Quando os dois não cabem na mesma tela, a conversa acontece no rascunho em cinza.
O protótipo funciona de verdade?
Ele abre no celular e responde ao toque, com os percursos principais navegáveis. Não guarda dados nem conversa com servidor: é para testar caminho, não para atender cliente.
Preciso ter usuários para testar?
Três pessoas do perfil certo já mostram onde o percurso trava. Se você não tiver acesso a elas, combinamos como recrutar.
Como funciona o pagamento?
Metade na assinatura do escopo e metade na entrega do protótipo. Projeto com acompanhamento tem uma terceira parcela ao fim da fase.
Interface desenhada do zero
Conte em uma frase o que a pessoa vem fazer no seu produto
Se a frase sair torta, o desenho já tem por onde começar. A conversa de partida dura uma hora e meia e termina com a folha de limites na sua mão.
Contato
Escreva para o estúdio
Conte que produto você quer desenhar e em que ponto ele está hoje.
EndereçoOnde ficamos
Rua Lineu Jucá 504;500
Fortaleza — CE
CEP 60420-090
AtendimentoQuando atendemos
- Segunda a sexta, das 9h30 às 17h
- Sábados, das 10h às 12h
- Domingos e feriados: fechado