
Coffeeverse
UI design de app · Cafés especiais
Briefing
O café especial é uma bebida complexa, que exige cuidado em cada etapa da produção para chegar a uma boa xícara. Mesmo assim, sua venda está espalhada entre lojas físicas e os canais próprios de cada fazenda ou torrefação, o que limita o poder de escolha de quem compra.
O desafio era criar um produto digital que reunisse em um só lugar as melhores torrefações e fazendas produtoras de café do país, aproximando o consumidor de quem produz.
Solução
Pensamos em um aplicativo que reúne, em uma única vitrine, torrefações e fazendas produtoras parceiras, regionais e nacionais. Para quem não sabe qual café escolher, criamos uma busca por características: o usuário descreve o que mais gosta em uma bebida e o app mostra os cafés que melhor combinam com o seu gosto.
Cada produto apresenta dados de origem, como região, altitude, produtor, variedade e torra, para apoiar uma escolha mais consciente. O envio é feito sob demanda, direto do local de torra, sem o café ficar parado em estoque, porque quanto mais perto da data de torra, mais saboroso ele chega à xícara.
Resultados
O Coffeeverse concentra em um só lugar uma oferta que antes estava espalhada, dando ao consumidor mais poder de escolha. A busca por características aproxima quem está começando no café especial das bebidas que combinam com o seu paladar, e as informações de origem transformam a compra em uma experiência de descoberta.
Para torrefações e fazendas, o app abre um novo canal de venda com envio direto do local de torra.
Cores e tipografia
Cores
Vermelho rebaixado, de saturação moderada, no campo dos tons de café torrado, que ocupa as grandes áreas de cor das telas. Escuro o bastante para receber texto creme com leitura confortável, funciona como fundo de conteúdo, e não só como acento.
Branco quente no lugar do branco puro: reduz o contraste máximo da tela e a fadiga em leitura prolongada. É a cor de texto sobre as duas cores escuras do sistema, com leitura garantida tanto sobre o terracota quanto sobre o verde-petróleo.
Matiz praticamente complementar ao terracota. A diferença entre os dois é de matiz e não de valor, já que as luminâncias são muito próximas; por isso ele é reservado aos botões de ação, onde o contraste de matiz isola a ação do resto da tela. Pelo mesmo motivo, nunca é usado como texto sobre o terracota.
Tipografia
- Títulos e subtítulos
- Unbounded29px e 15px
Sans geométrica de proporções expandidas. A largura acima da média dá massa aos títulos curtos, e o contraste de largura com a Manrope cria hierarquia pela proporção das letras, não só pelo tamanho.
- Texto
- Manrope12px
Sans de construção geométrica com altura-x alta e aberturas amplas em letras como a, c, e e s. Em 12px, corpo das descrições, preços e dados de origem do café, essas características preservam o reconhecimento das letras na tela do celular, onde a largura da Unbounded prejudicaria a leitura.
Outros trabalhos
Ver todos os trabalhosTem um projeto em mente?
Me conta um pouco sobre ele.
Vamos conversar no WhatsApp (abre em nova aba)