Afirmativas

Solução digital para empregar pessoas de grupos sub-representados promovendo a inclusão social.

EMPRESA

Projeto do curso

FUNÇÃO

UX Designer

DATA

Maio de 2024

Este projeto faz parte do curso de UX Design da Escola Britânica de Artes Criativas (EBAC). Foi uma excelente forma de desenvolver habilidades na prática.

A proposta foi identificar algum problema na sociedade e criar uma solução que tivesse impacto na vida das pessoas. Com tema a livre escolha, eu decidi criar uma plataforma de emprego inclusiva.

O projeto

O meu projeto foi entregar uma solução digital de empregabilidade com foco em pessoas de grupos sub-representados. Pessoas negras, pessoas com deficiência, pessoas que se identificam como LGBTQIAP+ e pessoas com idade acima dos 60 anos, fazem parte desse grupo.

.

A ideia principal é promover a inclusão social e a diversidade ajudando pessoas a ter sucesso em suas carreiras conectando-as a empresas que tenham compromisso social.

Análise e definição

1. Conhecendo os usuários

Mapa de stakeholders

No desenvolvimento da plataforma inclusiva de empregos Afirmativas.com.br, uma das primeiras etapas foi o mapeamento dos stakeholders. Este processo envolveu identificar e analisar todas as partes interessadas que poderiam impactar ou ser impactadas pelo projeto.

Para isso, examinei grupos e indivíduos envolvidos, empregadores, especialistas em inclusão e organizações parceiras.

Proto-persona

Além do mapeamento dos stakeholders, desenvolvi uma proto-persona como parte da fase inicial de pesquisa. A proto-persona é uma representação preliminar e simplificada do usuário ideal, baseada em dados disponíveis e suposições informadas.

Embora a empresa seja fictícia, criei uma proto-persona para direcionar as decisões de design com base em características e necessidades comuns identificadas durante a pesquisa inicial. Esta persona incluiu detalhes como perfil demográfico, objetivos profissionais e desafios enfrentados na busca por empregos.

A criação da proto-persona ajudou a guiar o desenvolvimento da plataforma, assegurando que as funcionalidades e o design fossem alinhados com as expectativas e necessidades do público-alvo.

Levantamento de hipóteses

Na fase de imersão do projeto Afirmativas.com.br, minha abordagem incluiu várias etapas para garantir uma compreensão abrangente do contexto e das necessidades dos usuários.

A primeira hipótese está relacionada a forma que as pessoas buscam emprego: online ou feirões de emprego. Também sobre pessoas com perfil de grupos de diversidade que concorrem com o público geral por não ter muitas vagas afirmativas.

Sobre players de mercado, a principal hipótese: As vagas são publicadas para um público geral. Apenas algumas plataformas possuem uma área dedicada a vagas afirmativas.

Essas suposições serviram como ponto de partida para uma pesquisa mais aprofundada.

2. Pesquisa

Desk research

Realizei Desk Research para reunir informações existentes e relevantes sobre o mercado de trabalho inclusivo e as melhores práticas para plataformas similares. 

Fiz um levantamento do número de pessoas desempregadas no Brasil dividido pelos seguintes grupos: gênero, raça e faixa etária. Além de um mapeamento de vagas afirmativas publicadas.

Benchmarking

Em seguida, fiz um benchmarking para comparar funcionalidades de outras plataformas no mercado.

Esse processo revelou insights sobre configurações e estratégias em plataformas similares, permitindo identificar oportunidades de inovação.

Entrevistas com usuário

Para aprofundar ainda mais o entendimento sobre os usuários, realizei entrevistas em profundidade com indivíduos que poderiam representar o público-alvo.

Essas conversas tinham objetivos como: Entender as maiores dificuldades de pessoas de grupos de diversidade para conquistar o emprego, entender como estas pessoas estão buscando emprego e como poderia ajudá-las.

Mapa de empatia

Complementando as personas, elaborei um mapa de empatia para explorar mais profundamente os sentimentos, pensamentos e experiências dos usuários.

Este exercício me ajudou a visualizar a perspectiva dos usuários de forma mais completa, identificando o que eles veem, ouvem, pensam e sentem em relação à busca de emprego inclusivo. Com essas informações, pude compreender melhor as emoções e motivações que impactam suas interações com plataformas de emprego.

Jornada do usuário

Desenvolvi também uma jornada do usuário para mapear cada etapa da experiência do usuário com a plataforma, desde a descoberta até a aplicação e o feedback. Este mapeamento detalhado destacou os pontos de contato críticos e os momentos de frustração, permitindo-me identificar áreas-chave para melhoria e inovação.

Por fim, utilizei uma matriz de priorização para avaliar e classificar as possíveis funcionalidades e melhorias com base em dois critérios principais: a facilidade de implementação e o impacto para o usuário. Essa ferramenta me permitiu priorizar as iniciativas que ofereciam o maior retorno sobre o investimento, garantindo que as soluções mais valiosas fossem implementadas primeiro.

Essas abordagens estruturadas garantiram que a definição do problema fosse baseada em uma compreensão profunda dos usuários e das suas necessidades, e que as soluções propostas fossem práticas e eficazes para a plataforma Afirmativas.com.br.

3. Estratégias de UX

Protótipo de usabilidade

Na sequência, entrei na fase de design, onde o foco foi a criação de um wireframe funcional para a plataforma Afirmativas.com.br. O objetivo era garantir que o usuário pudesse realizar de forma intuitiva as principais tarefas identificadas como essenciais durante as fases anteriores.

O wireframe foi desenhado para permitir que os usuários pudessem pesquisar por vagas de maneira simples e eficiente. Para isso, desenvolvi uma interface de busca com filtros que facilitavam a navegação por diferentes categorias de emprego, localização e critérios de inclusão. A ideia era garantir que, independentemente das especificidades do candidato, ele pudesse encontrar vagas que atendessem às suas necessidades e expectativas.

Além da busca por vagas, uma das funcionalidades centrais do wireframe foi a possibilidade de cadastrar currículos. Criei um fluxo claro e direto, onde o usuário pudesse adicionar suas informações pessoais, experiências profissionais e habilidades de forma rápida e sem complicações. Para tornar o processo mais inclusivo, considerei diferentes formatos de apresentação de currículo, permitindo que os candidatos pudessem subir arquivos ou preencher diretamente os campos na plataforma. Outro ponto importante foi o processo de candidatura às vagas. Desenhei uma interface que possibilitasse aos usuários se candidatarem de forma simples, com poucos cliques, sem sobrecarregar a experiência com etapas desnecessárias. O objetivo era oferecer uma jornada fluida, desde a busca até a aplicação para a vaga desejada.

Esse wireframe serviu como uma base visual clara para testar a usabilidade das principais funcionalidades da plataforma e garantir que o design estivesse alinhado com as necessidades e expectativas dos usuários.

Após o desenvolvimento do wireframe, a próxima etapa foi realizar o teste de usabilidade. O objetivo desse teste foi verificar se os usuários conseguiam navegar pela plataforma de forma intuitiva e realizar as principais tarefas sem dificuldades.

Conduzi sessões de teste com usuários que representavam as personas criadas na fase de definição do problema. Durante esses testes, observei como os usuários interagiam com o wireframe, focando especialmente nas tarefas de pesquisar por vagas, cadastrar o currículo e se candidatar a uma vaga. Essas interações forneceram insights valiosos sobre a facilidade de uso da plataforma e possíveis pontos de fricção.

Durante o teste, notei quais partes do fluxo de navegação eram mais claras e funcionais, e também identifiquei áreas que precisavam de ajustes. Algumas questões que surgiram incluíam dificuldades com a usabilidade dos filtros de busca e a necessidade de tornar mais evidente o botão de candidatura. Esses feedbacks foram fundamentais para melhorar a experiência do usuário e garantir que a plataforma atendesse às suas expectativas de forma eficiente.

A partir dos resultados dos testes, fiz refinamentos no design do wireframe, ajustando a interface e simplificando certos fluxos para assegurar que a plataforma fosse acessível e fácil de usar para todos os públicos. O teste de usabilidade foi essencial para validar as escolhas de design e garantir que as funcionalidades mais importantes da Afirmativas.com.br estivessem em pleno funcionamento antes de seguir para as etapas finais do projeto.

Ideação

4. Conceitos visuais

Referências visuais

Layout e composição

Depois do teste de usabilidade, entrei na fase de definição do conceito visual da plataforma Afirmativas.com.br. Para isso, comecei criando um moodboard, uma ferramenta que me ajudou a reunir referências visuais que representassem a identidade inclusiva e acessível que o projeto exigia.

O moodboard incluiu uma paleta de cores neutras e acolhedoras, imagens que remetiam à diversidade e inclusão, além de tipografias e ícones que transmitiam clareza e profissionalismo.

Empoderamento

A palavra escolhida para essa fase de conceito foi: Empoderamento.

As palavras-chavas selecionadas: Sonhos; Ambição; Apoio financeiro; Progresso; Conexão; Inovação; Crescimento; Determinação.

Moodboard conceitual

Moodboard gráfico

Fortalecimento e capacitação dos micro e pequenos empreendedores. Oferecendo suporte necessário para alcançar seus objetivos comerciais, realizando assim seus sonhos e aspirações.

Padrões de interface

Com o conceito visual definido, comecei um trabalho exploratório em padrões de layout e interface, sempre com a acessibilidade como prioridade.

A ideia era garantir que o design não só fosse visualmente atraente, mas também funcional para todos os tipos de usuários, independentemente de suas habilidades.

Isso significou escolher cores com alto contraste para facilitar a leitura, utilizar tamanhos de fonte adequados e garantir que todos os elementos da interface fossem facilmente navegáveis por meio de teclados e leitores de tela.

5. Prototipação

Criação de Protótipo

Depois de fazer algumas telas, eu passei a trabalhar na prototipação para testar a navegação do produto.

Acessibilidade

Nessa fase, eu tive o cuidado de testar todas as cores para garantir que não haveria problema de acessibilidade.

Como critério, eu decidi usar todas as cores que passassem com padrão AAA de contraste. Esses parâmetros são oferecidos pela WCAG.

Guia de estilo

Seguindo o conceito visual, desenvolvi um style guide, um documento que estabelecia as diretrizes de uso de elementos gráficos, tipografia, cores, espaçamentos e componentes da interface.

Isso ajudou a manter a consistência visual em toda a plataforma e serviu como um guia para futuros desenvolvimentos.

Além disso, foquei no design responsivo, garantindo que a plataforma funcionasse perfeitamente em dispositivos móveis, tablets e desktops, proporcionando uma experiência fluida e adaptada a diferentes tamanhos de tela.

Font - Albert Sans

Esta é uma font disponível no Google Fonts. Foi escolhida devida sua boa leiturabilidade em diversos tamanhos e cenários.

Colors - Diversidade

As cores foram selecionadas para transmitir diversidade. Todas elas passam nos critérios de acessibilidade.

Icons - Font Awesome

Os ícones são importados da biblioteca Font Awesome 6 Free.

Para garantir um contraste maior foi utilizado a versão preenchida dos ícones a fim de oferecer uma melhor experiência.

Alguns ícones foram feito sob demanda.

Componentes - UI Kit

Estes são os principais componentes para o desenvolvimento da interface gráfica da aplicação web e mobile.

Resultados

6. Telas

Design responsivo

Por fim, entrei na etapa de refinamento do layout, onde revisitei cada detalhe do design, ajustando espaçamentos, alinhamentos e pequenos elementos visuais.

Essa fase foi crucial para garantir que o layout final estivesse alinhado com o conceito visual definido e as boas práticas de usabilidade, acessibilidade e design responsivo.

O refinamento trouxe o equilíbrio necessário entre estética e funcionalidade, assegurando que o Afirmativas.com.br estivesse pronto para oferecer uma experiência inclusiva e intuitiva para todos os usuários.