Guia de acesso
Comece com uma tela e uma tarefa clara para o usuário. Depois, verifique o que o destino realmente permite fazer antes de se comprometer com um projeto maior. App Design oferece um ponto de partida no navegador, mas esta página não pode confirmar quais recursos, se houver, estão disponíveis sem pagamento.
Você precisa de um objetivo para a tela, uma lista do conteúdo essencial e uma forma de avaliar o resultado. Não precisa ter um sistema visual completo para começar a planejar.
Considere um aplicativo de agendamento. Defina a tarefa, esboce a tela de reserva e depois verifique se alguém consegue escolher um horário e entender o que acontece em seguida. Estas quatro perspectivas tornam essa avaliação mais útil.
Anote o único objetivo da tela: permitir que alguém escolha o horário de um agendamento. Liste a data, os horários disponíveis e a ação de confirmação antes de escolher as cores.
Uma descrição de tela pequena e testável mantém a primeira versão focada na tarefa de agendamento.
Esboce o fluxo de agendamento, da seleção do serviço à confirmação. Marque onde devem aparecer a disponibilidade, a duração e as condições de cancelamento.
Um fluxo que pode ser avaliado revela informações ausentes antes de começar o trabalho visual detalhado.
Verifique se os horários disponíveis, os rótulos e a ação de confirmação continuam fáceis de ler e tocar em uma tela estreita.
As limitações dos dispositivos móveis passam a fazer parte do briefing de design, em vez de serem uma correção tardia.
Percorra a tela como um usuário cujo horário escolhido acabou de ficar indisponível. Observe a mensagem e a próxima ação disponível.
A revisão abrange um estado de erro, além do caminho ideal de agendamento.
Considere estas três opções iniciais, em ordem de esforço. Escolha a mais simples que responda à sua questão atual de design; nenhuma delas estabelece as condições de acesso ao destino.
Melhor quando a ideia ainda está vaga. Informe o usuário, a tarefa de agendamento, as informações necessárias e um possível estado de erro. Mantenha isso breve nas suas próprias anotações para poder reutilizá-las independentemente da ferramenta que abrir.
Melhor quando não está claro qual é o lugar da tela na jornada. Desenhe as etapas de seleção, revisão e confirmação com caixas simples; decida o que deve acontecer quando um horário estiver indisponível.
Melhor quando o fluxo já faz sentido. Verifique a clareza dos rótulos, as áreas de toque, o contraste e a ação principal em um layout com tamanho de dispositivo móvel. Confirme se o editor escolhido oferece suporte às alterações necessárias.
Um ponto de entrada no navegador não é evidência de edição, exportação, colaboração ou publicação sem restrições. Verifique as condições atuais do destino antes de depender de qualquer um desses recursos.
O acesso a uma página da web não estabelece quais ações de design estão incluídas nem se o uso contínuo está sujeito a condições.
O que fazer em vez disso
Verifique os detalhes atuais de acesso ao destino e teste o recurso necessário para a sua tela antes de ampliar o projeto.
Um conceito de tela não inclui automaticamente uma lógica de agendamento funcional, dados de disponibilidade, notificações ou um aplicativo móvel publicado.
O que fazer em vez disso
Separe o briefing da interface dos requisitos de engenharia e registre cada interação que ainda precisa ser implementada.
Um layout que parece claro em uma janela ampla do navegador pode falhar quando o texto quebra em mais linhas ou os controles ficam apertados em um celular.
O que fazer em vez disso
Analise uma versão para telas estreitas e teste o fluxo de agendamento com alguém que não participou do design.
Cores e ícones não resolvem a falta de clareza sobre a próxima etapa nem a ausência de uma mensagem de erro no fluxo de agendamento.
O que fazer em vez disso
Confirme a tarefa do usuário e os estados necessários da tela antes de refinar a tipografia e as cores.
Tenha em mãos uma tarefa específica, o conteúdo necessário para sua tela e uma pergunta que você quer que o design responda. Abra a página de destino no navegador para conhecer o fluxo de trabalho atual e as condições de acesso; não presuma que todos os recursos descritos em um guia geral de design estejam disponíveis lá.
Você pode abrir a página de destino vinculada no navegador para conhecer o fluxo de trabalho inicial. Esta página não confirma o acesso atual aos recursos; por isso, consulte as condições de acesso no destino antes de presumir que determinada ação está disponível sem pagamento.
Você não precisa instalar nada para escrever o briefing de uma tela ou esboçar um fluxo no papel. O ponto de partida vinculado abre em um navegador, mas você deve confirmar os requisitos atuais e as ações disponíveis lá.
Prepare uma tarefa do usuário, as informações que a tela deve mostrar e a ação que o usuário deve realizar em seguida. Para uma tela de agendamento, inclua o que acontece quando o horário selecionado não está disponível.
Não. O design de uma tela comunica a disposição dos elementos e as interações previstas; um aplicativo funcional também precisa de implementação, tratamento de dados e testes. Trate o design como uma especificação a ser revisada, não como prova de que esses sistemas existem.
Tente responder a uma pergunta específica, como se os usuários conseguem encontrar e confirmar um horário de agendamento. Verifique se as ações disponíveis permitem representar o conteúdo e os estados necessários e, em seguida, analise o resultado no tamanho de uma tela de celular.