Desafio 2 | Wireframing

Laís Martins
2 min readAug 15, 2020

--

Essa publicação faz parte dos meus estudos do Bootcamp de UX/UI Design na Ironhack São Paulo.

Para este desafio, a proposta foi escolher um aplicativo e criar uma versão wireframe do fluxo de usuárie com base em capturas de tela ou telas de protótipo de alta fidelidade desse aplicativo.

Wireframe, para quem está se perguntando, é um esboço usado para sugerir a estrutura, uma ilustração semelhante de como ficará o produto final.

O aplicativo escolhido foi o MeetUp, que reúne pessoas, atualmente só por encontros onlines (saudade de um encontro presencial né, minha filha?), pelos seus interesses em comum sobre diversos assuntos, permitindo ao usuárie escolher assuntos de seu interesse e procurar eventos para participar.

No processo de desenvolvimento dos wireframes, acabei criando meus próprios logos e símbolos pela diversão em si :)

comecei rascunhando à mão e foi ótimo para entender e até agilizar no criação posteriormente pelo Figma
Link para meu protótipo no Figma: https://bit.ly/2PWHGsc

Na ordem de criação de telas, primeiro são feitos os wireframes, testados, até chegar na versão final com a interface exatamente na forma que es usuáries verão. Nesse caso, como a ordem desse processo foi invertida (desenvolvi wireframes a partir de telas finalizadas), foi curioso e um pouco intrigante ter certeza sobre quais ícones, botões e principalmente quais textos manter na sua forma original ou passar para uma estruturação mais simples.

Fluxo escolhido:

escolher grupo > ver eventos > selecionar eventos > confirmar presença > confirmação da escolha

O link para o protótipo no Figma está abaixo da segunda imagem :)

Seguindo a ideia de entender ao máximo o que era primordial para a compreensão do fluxo escolhido, o resultado final foi esse, e foi bem divertido!

--

--

Laís Martins

UX/UI Designer, aplicando a diversidade do design e das pessoas nas soluções centradas nos usuários. Figma | Arquitetura da informação | UI