Sobre o projeto
Escopo
Essa aplicação foi desenvolvida como um trabalho para a disciplina de Projeto Integrado I do curso de Sistemas e Mídias Digitais da UFC, o objetivo da disciplina foi durante todo o semestre uma equipe trabalhar na criação de um produto digital para um cliente real, apresentando ao final uma aplicação finalizada e funcional.
Sobre nossa cliente
A Associação Marta é uma organização formada por mulheres dedicadas à prevenção e conscientização sobre a violência estrutural contra a mulher. O grupo desenvolve diversas iniciativas, incluindo campanhas periódicas como o Marta Escuta, palestras em instituições de ensino sobre o tema, além de um podcast próprio. Também mantém uma forte presença nas redes sociais, como o Instagram, para ampliar o alcance e fortalecer o diálogo com seu público-alvo.
Meu papel
Atuei nesse projeto desde a fase de pesquisa até os testes finais dos protótipos, participando de todas as etapas como UX/UI Designer da equipe.
Acesse
Desafio
Criar uma maneira de contribuir para maximizar o alcance da Associação Marta para com seu publico alvo, buscando progredir com a missão de acesso a informação e educação, assim como o acolhimento e suporte às mulheres vítimas de violência.
Metodologia
Sobre a metodologia, foi necessário seguir um documento de orientações da disciplina, mas trazendo para o contexto da área, seguimos o mesmo modelo da metodologia Lean UX, buscando ser uma equipe multifuncional focando sempre em solucionar o problema.
Descoberta
Nesta etapa inicial, buscamos compreender como nossa cliente utilizava as plataformas digitais para se comunicar e oferecer suporte. Para isso, realizamos um grupo focal com algumas representantes da associação, onde identificamos desafios e necessidades. O principal ponto levantado foi a dificuldade no atendimento e na comunicação com as mulheres que procuram apoio.
Com base nesses insights, avançamos para um questionário quantitativo, com o objetivo de coletar dados sobre o público-alvo e definir os requisitos essenciais para o desenvolvimento da aplicação.
Questionário Quantitativo
Para compreender melhor o público-alvo, divulgamos um formulário com perguntas de múltipla escolha. Ao final do processo de coleta, reunimos 50 respostas, que nos forneceram insights valiosos para definir o perfil do usuário primário da aplicação.
Perfil de usuário
Amostra | 50 mulheres |
---|---|
Faixa etária | Entre 18-34 anos (92%) |
Classe socioeconômica | Classe média (80%) |
68% das usuárias já sofreram algum tipo de violência de gênero
25 usuárias informaram não terem procurado ajuda
76% das usuárias têm muito interesse em conteúdos de conscientização sobre a violência de gênero
99% das usuárias nunca usaram nenhum aplicativo com foco na segurança da mulher
Apenas 7 usuárias afirmaram que não baixariam um aplicativo com essa proposta
94% da usuárias afirmaram que estaria mais propensa a baixar um aplicativo desse tipo caso ele tivesse um botão de emergência
Definição
Personas
Com base nas características e necessidades identificadas, criamos duas personas inspiradas tanto nas colaboradoras da Associação Marta quanto em seu público-alvo. Essas personas nos ajudaram a compreender melhor os usuários e a tomar decisões mais assertivas durante o desenvolvimento da solução.


Modelo de Negócio
A criação do modelo de negócio foi fundamental para guiar o processo de desenvolvimento. Ele nos ajudou a manter o foco nos objetivos da aplicação e nos resultados que desejávamos alcançar para atender melhor nossos usuários.

Mapeamento de Requisitos
Buscando atender as necessidades dos nossos usuários e apresentar uma melhor experiência trazendo soluções para a problemática principal, realizamos o mapeamento dos requisitos que foi utilizado para o desenvolvimento de funcionalidades do nosso produto.
Requisito | Descrição |
---|---|
Prover Informações | O sistema deve prover conteúdos pertinentes a mulheres que estão procurando por ajuda ou aprofundamento em relação à violência de gênero. |
Área de Agendamento | O sistema deve prover uma área onde seja possível agendar um atendimento com a Associação Marta. |
Consultar agendamento | O usuário pode consultar um agendamento inserindo o número de telefone no campo especificado. Com isso, ele pode ver todos os detalhes do atendimento, por exemplo, o tipo de atendimento, data e horário. |
Botão de Pânico | O sistema deve oferecer um botão de emergência para auxiliar usuários que estão em situação de urgência. |
Mapa da Rede de Proteção | O sistema deve disponibilizar um mapa para facilitar a procura de serviços da rede de proteção à mulher. |
Onboarding | Ao entrar no aplicativo pela primeira vez, o usuário irá visualizar uma apresentação do aplicativo onde suas principais funcionalidades serão mostradas. Caso queira, o usuário poderá pular esta apresentação. |
Ideação
Fluxo de usuário
Após definirmos o escopo de requisitos que nossa aplicação apresentaria, partimos para a criação de um fluxo de usuário que apresentasse todas as funcionalidades que seriam apresentadas para os usuários.

Wireframe de baixa fidelidade
Inicialmente, em um processo de ideação com toda a equipe decidimos fazer um quadro de votação apresentando algumas sugestões de protótipos feitos por alguns membros, cada um dos protótipos possuiam anotações que descreviam como seriam apresentadas as funcionalidades.

Dessa forma, a partir dos recursos mais votados, baseados nos estudos com o modelo conceitual da solução feito a partir dos requisitos gerados inicialmente, foram confeccionadas as versões de telas da aplicação em baixa fidelidade, a fim de pensar modelos de diagramação que fizessem sentido para o usuário da aplicação.
Prototipação
Média fidelidade
Com base nas validações e decisões tomadas pela equipe, partimos para a construção do protótipo de média fidelidade com o objetivo de validar a arquitetura da informação e a interatividade com os elementos da interface, foi elaborada a seguinte proposta de layout, priorizando a hierarquia das informações e o fluxo de navegação. (Visualizar)

Style Guide
Para construir a parte visual da aplicação buscamos utilizar no style guide as cores já presentes na identidade visual da nossa cliente buscando consistência e reconhecimento imediato, fazendo uma adaptação para o uso de interfaces gráficas e utilizando o design system Material Design.
Alta fidalidade

Testes
Com a fase de prototipação concluída em uma primeira fase, decidimos realizar testes com a interface e as interações com o objetivo de validar se o protótipo desenvolvido atendia às necessidades e expectativas dos usuários, garantindo a usabilidade e eficiência do produto.
Avaliação Heurística
Nesta etapa, contamos com a participação de Rachel de Carvalho, pesquisadora em Interação Humano-Computador e Designer de Produto na Agenda Edu. Ela realizou uma avaliação heurística do recurso com base nas heurísticas de Nielsen (1994). O relatório completo pode ser acessado aqui.
Teste de Usabilidade
Para avaliar a usabilidade da aplicação, utilizamos o framework DECIDE (Preece et al., 2002). Foram selecionados usuários dentro do perfil identificado, desenvolvidos termos de consentimento e definidas atividades específicas para os testes. A avaliação foi realizada por meio do Figma e Maze, com testes conduzidos remotamente via Google Meet, sendo gravados para análise posterior.
Os testes envolveram 10 participantes, que exploraram as funcionalidades da aplicação e realizaram quatro atividades seguidas de perguntas quantitativas e qualitativas.
Os principais problemas identificados foram:
Navegação na Tela de Artigos:
Problema: 66,7% de cliques errados na primeira atividade devido à falta de título explicativo.
Solução Sugerida: Incluir um título claro para indicar onde o usuário se encontra.
Confusão com Nomenclaturas e Funcionalidades:
Problema: Nomenclaturas como "Destaques" e "Comece por aqui" geraram confusão, assim como a percepção errada sobre a campanha “Marta Escuta”.
Solução Sugerida: Revisar a linguagem utilizada para torná-la mais intuitiva e clara.
Reconhecimento da Seção "Apoio" no Menu:
Problema: Apenas 3 de 10 usuários inicialmente reconheceram a funcionalidade da seção "apoio" no menu.
Solução Sugerida: Melhorar o destaque visual dessa funcionalidade.
Identificação do Botão de Emergência:
Problema: 50% das entrevistadas não conseguiram identificar a função do botão de emergência, acreditando ser um botão de dúvidas.
Solução Sugerida: Alterar a cor do botão para algo mais relacionado à emergência, como o vermelho.
Esses insights foram fundamentais para orientar melhorias na interface e na experiência do usuário.
Equipe do Projeto
Jadson Alcantara - UX/UI Designer