Wiframes do sistema

  Os wireframes são representações visuais de baixa/média fidelidade que servem para planejar e estruturar a interface do usuário antes da implementação do sistema. No projeto do Hospital de Clínicas da UNICAMP, os wireframes são fundamentais para garantir que todas as interações do usuário estejam claramente definidas, organizadas e funcionais.

  A criação dos wireframes possibilita:

• Melhor visualização do fluxo de navegação do usuário.
• Antecipação de possíveis problemas de usabilidade.
• Alinhamento entre equipe de design, desenvolvimento e stakeholders.
• Definição clara das funcionalidades antes da implementação.

  Para o desenvolvimento do projeto, os wireframes foram criados utilizando a ferramenta Figma disponível aqui, permitindo colaboração e ajustes rápidos durante a fase de planejamento.

Principais telas desenvolvidas

  A tela inicial funciona como uma "home" da aplicação que direciona os usuários para diferentes seções do sistema. Nesse sentido, existe botões que permitem acessar o dashboard, o histórico de medicamentos, a configuração do sistema, a seção de perguntas frequentes e o registro de logs. Dessa forma, essa estrutura facilita a navegação e melhora a experiência do usuário, permitindo que ele encontre rapidamente a funcionalidade desejada.

_{Figura 1 - Tela inicial}

^{Fonte: Autoria própria}

  A tela de dashboard exibe informações essenciais para os operadores do sistema. Nesse sentido, permite-se visualizar as receitas médicas pendentes para separação, acompanhar o status dos medicamentos que já foram separados e conferir aqueles que ainda estão em separação. Além disso, a tela apresenta indicadores do status do robô, informando se está ativo e funcionando corretamente. Assim, esse painel fornece uma visão geral das operações e ajuda a otimizar o fluxo de trabalho.

_{Figura 2 - Tela de dashboard}

^{Fonte: Autoria própria}

  A tela de estoque apresenta as informações do ID do medicamento, a validade, o BIN, o lote, e a data de entrada e a quantidade presente. Nesse sentido, o principal objetivo da implementação dessa tela é obter maior controle dos medicamentos e processos do sistema.

_{Figura 4 - Tela de estoque}

^{Fonte: Autoria própria}

  A criação dos wireframes no Figma permitiu estruturar toda a experiência do usuário, garantindo que o sistema seja funcional, intuitivo e bem planejado antes do desenvolvimento.