Vídeo: Tutorial Rápido - Como usar e criar protótipos navegáveis no Invision 2025
Comps , como eles são chamados em círculos de design web, são maquetes visuais de um novo e proposto design web. Eles são a chance do designer de estabelecer o que o site irá finalmente parecer - das cores e texturas de fundo da página, opções de fontes, cores e tamanhos para navegação e design de botões. A chave para conceber comps é focar na concepção de modelos.
Geralmente, há um comp desenvolvido para cada modelo (muitas vezes com múltiplas camadas do Photoshop e conjuntos de camadas que mostram diferentes estados de componentes interativos). Portanto, ao projetar um comp, você deve pensar nos pilares de cada modelo. Qual é a grade que essa página usa? Como e onde os diferentes tipos de elementos de texto serão exibidos? Existem seções expansíveis e flexíveis para as quais você precisa mostrar as duas visualizações? Existe um tratamento ou limite especial para imagens ou formulários? Como é a navegação e os botões?
Ao desenvolver comps, escolha uma página de exemplo que use um dos modelos. Use manchetes reais, cópia de botão e fotos (ou perto do que será a cópia e as fotos reais), a fim de capturar o bom humor e tom do site proposto.
Muitas vezes, um comp exigirá que você inclua elementos do sistema do navegador, como barras de rolagem, botões de rádio e caixas de seleção. Não há necessidade de cortar screenshots ou (pior) criar widgets personalizados a partir do zero (a menos que seja o que você está procurando). Existem sites online, como Design Toolbar Toolbox, que permitem baixar arquivos do Photoshop que possuem esses elementos em camadas transparentes, facilitando a sua incorporação em seus projetos.
