É muito mais provável que os clientes aprove ou comprem um design, se puderem imaginar como ele ficará na realidade. E em um mundo em que as soluções de negócios em ritmo acelerado são a norma, é mais importante do que nunca que os designers possam apresentar rapidamente um layout realista do design criado.
Neste breve tutorial, examinaremos o processo de três etapas para encontrar, entender e usar arquivos de layout para seu design.
Etapa 1: encontre e baixe o layout!
Você pode encontrar quase tudo o que precisa na Internet, e isso também se aplica aos arquivos de layout do dispositivo. Existem muitos layouts gratuitos e pagos, e recomendamos que você verifique as duas opções para decidir por si mesmo qual é o melhor para suas necessidades.
Depois de encontrar o que está procurando, baixe o arquivo. A maioria dos arquivos de layout contém uma pasta que geralmente contém conjuntos dos seguintes arquivos: .psd, .jpg e .txt ou .pdf. Vamos analisar o objetivo de cada um deles:
O arquivo
.psd é o arquivo de origem no qual você trabalhará e editará o conteúdo para posteriormente inserir seu design.
O arquivo
.jpg é uma visualização do layout, projetado para ver como o layout pode parecer com o design dentro dele.
.Txt ou
.pdf - descreve os detalhes do arquivo, como o autor do layout, as informações de licenciamento e sua composição.
Como exemplo, tomaremos este modelo do iPhone X como exemplo:
Etapa 2: abra o arquivo e encontre o objeto inteligente nele
Quando baixamos e descompactamos o arquivo de layout, é hora de abri-lo no Adobe Photoshop e se familiarizar com as camadas de layout.
É importante entender como editar camadas, pois você substituirá o modelo no layout pelo seu próprio design.
A maioria dos layouts consiste em pelo menos três camadas: a cor do plano de fundo, o próprio objeto e o espaço para o logotipo. Obviamente, as camadas podem variar dependendo do número de objetos no layout, bem como da simplicidade ou complexidade do design que você deseja inserir nesse layout.
Para editar um objeto inteligente, clique nele, após o qual você irá para a tela de edição.
Objetos inteligentes
Um objeto inteligente é um objeto que nunca perde sua qualidade - não importa como você o redimensione. Consiste em imagens vetoriais ou de bitmap, que são camadas de dados de imagem criadas no formato de arquivo Illustrator ou Photoshop. Ele foi projetado para armazenar com segurança as características da imagem, independentemente das alterações feitas, daí a palavra "inteligente".
Objetos inteligentes são arquivos não rasterizados. O que isso significa?
A rasterização é uma ação que visa converter uma imagem vetorial (arquivo Illustrator), consistindo de pontos e curvas, em um computador ou versão impressa com gráficos em pixel. Algumas ferramentas, como apagador, preenchimento e filtros, funcionam apenas com arquivos rasterizados.
Objetos inteligentes não são rasterizados porque o processo de rasterização significa que você não pode mais dimensionar uma imagem sem perder a qualidade.
Para encontrar um objeto inteligente, encontre o pequeno ícone acima da camada, geralmente localizado no canto inferior direito. Quando você passa o mouse sobre ele, o texto pop-up indica que você está em um objeto inteligente.
Etapa 3: publique seu conteúdo
Finalmente, o último passo é inserir o design que você criou no layout.
Na janela de edição que contém o objeto inteligente, basta arrastar seu design para a tela para substituir o conteúdo do layout pelo seu próprio trabalho.
Em seguida, clique em "Salvar" e retorne ao arquivo PSD original para ver as alterações.
No nosso caso, o arquivo atualizado terá a seguinte aparência:
Conclusão
Os layouts ajudarão seu cliente a visualizar como o design dele ficará no mundo real. Os layouts são incrivelmente fáceis de encontrar e usar e podem afetar significativamente a percepção do seu design por clientes e usuários.
Você acha que o uso desses modelos de dispositivos é útil em design e publicidade?