Design de app mobile

Univesell. Um evento, o orçamento e os convidados em uma só tela

Um app de marketplace de dois lados para eventos. Quem organiza um evento acompanha tarefas, orçamento e convidados em um só lugar, e os fornecedores acompanham os ganhos no lado deles.

Meu papel: Fluxos de produto e design de interface
Status do projeto: Design de interface · Acervo do Figma

Capa de apresentação do Univesell, do arquivo de design original. — Capa de apresentação do arquivo original.

Telas do arquivo de design original no Figma, com dados de exemplo.

Minha contribuição

Univesell é um app de marketplace de dois lados para eventos: de um lado, quem organiza um evento; do outro, os fornecedores. Quem organiza navega por empresas, profissionais e agências e gerencia cada evento no mesmo app.

O arquivo mostra os dois lados como fluxos do usuário, junto com as telas que desenhei. Este case acompanha as ferramentas de evento e termina nos ganhos do fornecedor.

Um passeio pelas telas do design, não uma gravação: a gestão de um evento, dos detalhes ao convite e aos ganhos do fornecedor.

Detalhes do evento: orçamento, convidados, dias restantes e tarefas em uma só rolagem. Dados de exemplo.

Tela de evento de um casamento de exemplo, com cabeçalho escuro, gráfico em anel do orçamento, número de convidados, dias restantes e um checklist de tarefas. — Detalhes do evento: orçamento, convidados, dias restantes e tarefas em uma só rolagem. Dados de exemplo.

Um evento em uma tela

A tela de detalhes do evento junta em uma só rolagem as perguntas em torno dele: quanto do orçamento já foi usado, como está a lista de convidados, quantos dias faltam e quais tarefas continuam abertas. Um cabeçalho escuro traz o nome do evento, e cada bloco abaixo responde a uma pergunta.

A lista de eventos aplica a mesma ideia um nível acima. Cada card mostra tarefas e orçamento em duas barras de progresso, então dá para comparar os eventos antes de abrir um deles.

Lista de eventos: tarefas e orçamento em duas barras em cada card.

Tela de gestão de eventos com um casamento e um aniversário, cada card com barras de progresso de tarefas e orçamento, e um botão New no topo. — Lista de eventos: tarefas e orçamento em duas barras em cada card.

O outro lado do marketplace

No lado do fornecedor, a tela de ganhos reaproveita a mesma estrutura: um gráfico em anel no topo e uma lista de histórico abaixo, agora separando valores em andamento e passados, com pedidos e saques na lista. Com o mesmo padrão, dá para reconhecer os dois lados como um só produto.

Lado do fornecedor: ganhos, com o mesmo padrão de gráfico e histórico. Dados de exemplo.

Tela de ganhos com um gráfico em anel de valores em andamento e passados, acima de um histórico de pedidos e saques. — Lado do fornecedor: ganhos, com o mesmo padrão de gráfico e histórico. Dados de exemplo.

Convites: mensagem, validade, lembretes e um arquivo anexo.

Formulário de configurações do convite com campos de título, mensagem, data e hora de expiração, lembretes e arquivo enviado, acima de Save settings e Cancel. — Convites: mensagem, validade, lembretes e um arquivo anexo.

O produto inteiro em um mapa

No lado de quem organiza, o fluxo do usuário começa no primeiro acesso e no cadastro, passa por marketplace, carrinho, pedidos e carteira e chega às ferramentas de evento. As cores marcam quais telas estavam prontas e quais ainda não tinham começado naquela etapa, então o mapa também servia de quadro de progresso do trabalho.

Diagrama largo de caixas verdes e lilás conectadas, com as telas do fluxo do usuário, do primeiro acesso às ferramentas de evento, passando por marketplace, pedidos e carteira. — Fluxo do usuário do lado de quem organiza, com cores por status naquela etapa.