Portuguese
Portuguese
Portuguese

Conectando vendedores
e amantes de NFTs

visão geral

O mercado de NFTs (Tokens Não Fundíveis) cresceu exponencialmente nos últimos anos, se tornando uma grande fonte de renda para várias pessoas.


Com o objetivo de ajudar ainda mais este mercado a crescer no Brasil, o Clube NFT foi criado. Uma plataforma para realizar transações de NFTs, tanto para criadores quanto para colecionadores.

ÁREA

UI Design

ano

2022

Ferramentas

Figma

CLIENTE

Clube NFT

O problema

Criar um site para a venda e compra de NFTs do absoluto zero.


Embora o cliente tenha fornecido um esboço do que seria necessário para o desenvolvimento do projeto, o site possuía um conteúdo pesado e bagunçado, difícil de navegar e não era personalizado de forma alguma.


Assim, queríamos criar um site que passasse segurança para os usuários, fornecendo a eles uma boa experiência de compra e venda de NFTs.

Fluxo de trabalho

Tão importante quanto minhas habilidades, me preocupo com a comunicação, prazos e o andamento do projeto. Um trabalho de sucesso não é apenas um belo design, mas um processo que atende às expectativas de todos.

🚀

Kickoff

1/7

Reunião inicial com o cliente para definir as expectativas do projeto

🔍

Pesquisa

2/7

Pesquisa exploratória para se inteirar sobre o assunto e projeto.

📝

Conteúdo

3/7

Desenvolvimento do contéudo que é criado e validado junto com o cliente.

🖥️

Wireframes

4/7

Organização das páginas e conteúdos.

🎨

Design

5/7

Finalização do wireframe com cores, tipografia e ilustrações.

🎮

Protótipo

6/7

Criação das animações e visualização fiel do webisite.

🤝

Handoff

7/7

Preparação dos arquivos e componentes para serem passados para o desenvolvimento.

Site Map

Para ter uma visão geral de todas as páginas do site, listamos todos os conteúdos principais que cada usuário poderia acessar começando pela página inicial do site.

Exploração, ideação e wireframes

Exploração, ideação e wireframes

Junto com a pesquisa e o moodboard de referências, os wireframes são partes fundamentais do meu processo criativo. Eles começam com rabiscos no papel e na medida que a ideia vai sendo validada, transformo em arquivos de média fidelidade.

Refinamento

Após a validação das ideias, os wireframes são refinados com adição de cores, tipografia, ícones, imagens e elementos da marca.

Reforço de marca

Uma compra de NFT não é tão fácil de ser realizada, podem ter dúvidas técnicas e também de segurança. É por isso que queríamos garantir que o Clube NFT deveria ter uma experiência segura e direcionada para que os usuários não tenham dúvidas do que fazer.

Priorizando a modernidade, estabelecemos uma linguagem visual tecnológica, neutra, consistente, flexível e atemporal, pronta para servir a marca por muitos anos.

Consistência

Para manter a consistência e harmonia no layout, facilitar a navegação e tornar a experiência do usuário ainda mais satisfatória, foi feito o uso de grids.

Dark e light mode

A pedido do cliente, foi desenvolvida as versões dark e light mode, dando a opção para o usuário escolher o modo de sua preferência.

Responsivo

Não é mistério para ninguém que a maioria dos acessos de um site são dos dispositivos móveis.

Por isso, um dos meus principais cuidados foi em conseguir projetar um site com um design responsivo.

Micro interações

Além de deixar o website mais dinâmico, as micro interações são uma opção que ajudam a tornar a experiência do usuário memorável, principalmente por ajudá-los a visualizarem os resultados de suas ações.

Diminuindo frustrações

Acessar uma página de erro não é uma experiência boa e pode causar o sentimento de frustração.

Para suavizar a situação utilizei ilustrações juntamente com os botões e os menus. Assim os usuários conseguem acessar a página que estão procurando.

Moderno, tecnológico e seguro

Retrospectiva

Sem dúvidas nenhuma, esse foi um projeto que gostei muito de participar. Além de ter toda a liberdade e apoio pelo lado do cliente, senti uma grande evolução na minha parte de pesquisa e nas relações/reuniões com os colaboradores e também desenvolvedores.


Fazer o design tanto para desktop quanto para mobile também foi outro ponto que queria destacar. Embora o conteúdo nos dois dispositivos seja o mesmo, dependendo do layout ele pode não funcionar tão bem quanto você imaginava.


Criar o design em duas versões, dark e light mode, também foi uma tarefa desafiadora, foi de grande aprendizado encontrar cores que trabalhassem bem nas duas situações.