o projeto
A CODI, de Caxias do Sul/RS, é uma solução de gestão da produção industrial que envolve hardware e software para entregar à empresa o controle e visão geral de absolutamente todos os aspectos que tangem a produção de suas máquinas.
Ao procurar exibir toda essa grande quantidade de informações em uma tela menor, a CODI nos procurou com a necessidade de trazer experiência, organização e design de ponta para que a exibição de uma grande quantidade de dados fossem bem organizadas em uma tela de um smartphone.
CODI
Eduardo Matos
imersão dentro da
necessidade do usuário
entendendo o
contexto
Antes de iniciarmos o desenvolvimento do projeto, acompanhamos uma reunião da CODI com um de seus clientes para entendermos o perfil de uso, as dores, necessidades e expectativas dos clientes em relação ao sistema. Ao absorver esses aspectos, partimos para entrevistas em profundidade com os stakeholders do projeto, entendendo o sistema já existente e o seu funcionamento.
Em um segundo momento, visitamos uma indústria que utilizava-se do sistema CODI para o seu funcionamento e ao fazer esta imersão absorvemos detalhes do cenário real de uso dos diversos tipos de usuários e de como o fluxo de navegação do vindouro app poderia afetar positivamente a produtividade da rotina de produção da indústria.

pesquisa analítica e referencial
para direcionar o design
documentação
e análise
Após todo o processo de imersão, seguimos para a nossa etapa de pesquisa, onde consumimos todos os insumos absorvidos nas etapas de imersão e documentamos todas as nossas observações. Nesta pesquisa conseguimos identificar três tipos de usuário que têm diferentes objetivos dentro do sistema e
conseguimos entender quais informações deveriam ser priorizadas para cada perfil, personalizando atalhos e fluxos focando nos objetivos de cada um destes. Também trouxemos diversas referências e analisamos estas para absorver e enriquecer o produto mobile da CODI.

wireframes e
design de interface
criando os
protótipos do app
Validando a pesquisa com o cliente, nós tivemos confiança para seguir com a construção dos wireframes, que são blocos estruturais de conteúdo que norteiam a navegação em relação a ordenação de elementos e de estruturas em geral, mas sem visual ainda. Sendo bem-sucedidos na exibição deste fluxo de telas e questões estruturais, partimos para a montagem do design final da interface e de seu respectivo Design System,
que é um compilado de componentes que se repetem ao longo do sistema e permitem ao cliente fazer novas telas depois do término do projeto sem a necessidade de um designer, considerando que existe só a demanda de encaixar certos componentes padrões dentro das necessidades da nova tela.


