ATIVIDADE 1 - ADSIS - IMERSÃO PROFISSIONAL: PROJETO DE INTERFACE - 53_2025

ATIVIDADE 1 - ADSIS - IMERSÃO PROFISSIONAL: PROJETO DE INTERFACE - 53_2025

Um wireframe é um esboço visual básico que representa a estrutura esquelética de uma página da web ou aplicativo. Ele é usado principalmente nas fases iniciais do desenvolvimento de produtos digitais para estabelecer a disposição básica dos elementos na interface, antes de adicionar detalhes de design gráfico como cores, imagens ou estilos de tipografia. Os wireframes são focados em funcionalidades, hierarquia de conteúdo e comportamento de elementos interativos, como menus e botões. Eles ajudam a definir a arquitetura da informação e a planejar a experiência do usuário. Além disso, servem para facilitar a comunicação entre membros da equipe de projeto, como designers, desenvolvedores, redatores e stakeholders. A partir do wireframe garante-se que todos tenham uma compreensão clara das funcionalidades essenciais e da estrutura da interface antes do desenvolvimento e design detalhado.



Fonte: https://www.adtail.ag/post/wireframe-o-que-tipos-ferramentas. Acesso em: 16 jul. 2025.



Agora, imagine que você está trabalhando em um projeto chamado "Hábito+”, um aplicativo que ajuda os usuários a criarem e manterem hábitos saudáveis. O aplicativo deve ter um design funcional e focado na experiência do usuário para facilitar o acompanhamento diário.



Crie um protótipo de baixa fidelidade (wireframe) contendo duas telas principais do aplicativo Hábito+, seguindo os requisitos:



1) Tela de Monitoramento Diário:

- Apresentar uma lista de hábitos cadastrados pelo usuário (ex: beber água, caminhar, estudar).

- Cada hábito deve ter um indicador visual de progresso diário (ex: checkbox, barra de progresso ou ícone).

- Incluir um botão ou ícone para marcar como feito.

- Oferecer um menu suspenso ou ícone de filtros com as opções: “Hoje”, “Últimos 7 dias” e “Todos”.

- Incluir botão para Adicionar Novo Hábito.



2) Tela de Cadastro de Hábito:

- Nome do hábito.

- Frequência desejada (diário, semanal, personalizado).

- Horário sugerido para notificação.

- Botões: Salvar Hábito e Voltar.



Entrega:



Você pode desenhar seu wireframe:

- Em papel e caneta (e enviar uma foto legível).

- Ou usar ferramentas digitais como Figma, Canva, Adobe XD, Miro, wireframe.cc etc.

 

Orientações gerais:

- Acesse o link com um vídeo tutorial para ajudá-lo nesse processo de criação e desenvolvimento. O acesso deverá ser realizado em: Materiais >> Material da Disciplina.

- A entrega deve ser feita exclusivamente por meio do Template de entrega da Atividade de Estudo 1 (AE1) disponível no material da disciplina.

- Lembre-se que evidências de cópias de materiais, incluindo de outros acadêmicos, sem devidas referências, serão inquestionavelmente zeradas. As citações e referências, mesmo que do livro da disciplina, devem ser realizadas conforme normas da - Instituição de Ensino.

- Não são permitidas correções parciais no decorrer do módulo, ou seja, o famoso: “professor, veja se minha atividade está certa?”. Isso invalida seu processo avaliativo. Lembre-se de que a interpretação da atividade também faz parte da avaliação.

- Procure sanar suas dúvidas junto à mediação em tempo hábil sobre o conteúdo exigido na atividade, de modo que consiga realizar sua participação.

- Atenção ao prazo de entrega, evite envio de atividade em cima do prazo. Você pode ter algum problema com internet, computador, software etc., e os prazos não serão flexibilizados, mesmo em caso de comprovação.

Bons estudos!