DS
1518
portfolio_page-template-default,single,single-portfolio_page,postid-1518,bridge-core-2.7.7,qode-page-transition-enabled,ajax_leftright,page_not_loaded,,vertical_menu_enabled, vertical_menu_hidden,vertical_menu_hidden_with_logo, vertical_menu_width_260,qode-title-hidden,qode_grid_1400,side_area_uncovered_from_content,qode-theme-ver-26.2,qode-theme-bridge,transparent_content,disabled_footer_top,disabled_footer_bottom,qode_header_in_grid,wpb-js-composer js-comp-ver-7.9,vc_responsive

Mini Design System / Site

Site integrado com sistema de exames e resultados. 

Contexto

O Ultravetlab é um laboratório veterinário de análises clínicas que solicitou a criação de um site e design system para um futuro desenvolvimento de sistema.

Objetivos

Criar um site e um design system com interface moderna, atraente e focada na usabilidade, com ênfase em fornecer uma experiência de usuário excelente.

Solução

Um site com conteúdo completo, permitindo que os usuários acessem resultados e solicitem exames. Detalhamento de componentes para Design System.

Meu papel

Como única designer no projeto, fui responsável pelo contato direto com o cliente, análise dos requisitos e criação do site e design system com foco na experiência do usuário, interação e interface.

Mini Design System / Site

Site integrado com sistema de exames e resultados. 

Contexto

O Ultravetlab é um laboratório veterinário de análises clínicas que solicitou a criação de um site e design system para um futuro desenvolvimento de sistema.

Objetivos

Criar um site e um design system com interface moderna, atraente e focada na usabilidade, com ênfase em fornecer uma experiência de usuário excelente.

Solução

Um site com conteúdo completo, permitindo que os usuários acessem resultados e solicitem exames. Detalhamento de componentes para Design System.

Meu papel

Como única designer no projeto, fui responsável pelo contato direto com o cliente, análise dos requisitos e criação do site e design system com foco na experiência do usuário, interação e interface.

Para uma melhor experiência de visualização, recomendo acessar o projeto pelo desktop.

Fluxo de usuário

O fluxo ilustra o caminho que o usuário percorre para encontrar as soluções que busca, sendo encontrar o exame escolhido, solicitar esse serviço ou acessar o resultado de outros exames. A função do fluxo é ilustrar de forma mais clara, qual a melhor solução para que essa busca seja simples e eficiente.

Fluxo de usuário

O fluxo ilustra o caminho que o usuário percorre para encontrar as soluções que busca, sendo encontrar o exame escolhido, solicitar esse serviço ou acessar o resultado de outros exames. A função do fluxo é ilustrar de forma mais clara, qual a melhor solução para que essa busca seja simples e eficiente.

Ideação, wireframing e prototipagem

Representação visual esquemática em baixa do projeto.

Mobile
  • mobile-3
  • mobile-1
  • mobile-2
  • mobile-5
  • mobile-4
Desktop

Ideação, wireframing e prototipagem

Representação visual esquemática da prototipagem do CRM.

Mobile
Desktop

Design Tokens

Design Tokens

Interação e especificações de Handoff para desenvolvedores

Interação e especificações de Handoff para desenvolvedores

Aprendizados e próximos passos

O principal aprendizado pessoal foi conciliar a liberdade de criar soluções internas do zero, alinhando os interesses do stakeholder com as necessidades do produto, levando em consideração as diretrizes visuais da marca e vendo como isso potencializava a entrega final do produto experiência.