<aside> <img src="https://s3-us-west-2.amazonaws.com/secure.notion-static.com/8c328f07-5d20-4fd4-8d49-6c7b9f80e8e0/avatar.jpeg" alt="https://s3-us-west-2.amazonaws.com/secure.notion-static.com/8c328f07-5d20-4fd4-8d49-6c7b9f80e8e0/avatar.jpeg" width="40px" />
Fiz parte desse projeto na construção dos wireframes para um website de negociação de NFTs. O time já possuía um detalhamento das páginas e funcionalidades, mas precisavam de ajuda para organizar as informações (todos os desejos e necessidades) de forma que fizesse sentido.
</aside>
Benchmark
Iniciei fazendo uma pesquisa em outros sites de compra e venda de NFTs para ampliar meu repertório e pegar algumas referências visuais. Também busquei entender como funcionavam os filtros, as buscas, e a compra dos NFTs.
https://www.figma.com/embed?embed_host=notion&url=https%3A%2F%2Fwww.figma.com%2Fproto%2Fee9lnLYu6IjXHZt9X0dJRn%2FEstudo-UI%3Fpage-id%3D125%253A85%26type%3Ddesign%26node-id%3D295-1990%26viewport%3D-2044%252C-861%252C0.46%26t%3DHOIkqUPMxhJjV4wV-1%26scaling%3Dscale-down%26starting-point-node-id%3D295%253A1990%26mode%3Ddesign
Identidade Visual | Guia de Estilo
Também analisei as ilustrações que eles já possuíam, e com base na paleta de cores, comecei a criar a Identidade visual, cores da marca, tipografia e alguns componentes que serviriam de base para apresentar a proposta inicial.
<aside> 💡 Usei algumas ferramentas de cores como: Eva Design System, Color Review e Scale
</aside>
Wireframes de alta fidelidade
Depois de ter a aprovação dessa parte inicial, comecei a construir os wireframes com base nas referências e necessidades pontuadas.
Eles eram construídos por parte, de acordo com a necessidade apresentada, e a medida que eram tidas as aprovações.
