O designer de interface e o desenvolvedor de front-end são especialistas diferentes, mas suas tarefas estão intimamente relacionadas. Tanto que os designers inteligentes entendem o básico do layout e os programadores conhecem os princípios do bom design. Isso ajuda a evitar mal-entendidos e a obter o resultado esperado. Detalhes diz Vladimir Sinitsyn, chefe de
Design e UX em Netology.
Oi Aqui estão duas razões principais pelas quais os desenvolvedores de front-end precisam conhecer o básico do design.
A primeira razão. Frontender e designer resolvem um problema comum
O designer cria o layout e o desenvolvedor front-end o transforma em uma interface completa do site. Um produto de alta qualidade é obtido quando os dois especialistas entendem a essência do trabalho um do outro.
- O designer deve entender os conceitos básicos de layout e CMS (se ele fizer um layout para o sistema de controle). Isso possibilita definir melhor as limitações técnicas e quão difícil será para o front-end implementar a ideia.
- O desenvolvedor deve entender corretamente a lógica e a estrutura do layout, descobrir o que e como ele funciona, como a animação é exibida, como ocorre a interação entre os elementos na página. Porque as idéias dos designers nem sempre são óbvias à primeira vista.
Os designers geralmente pensam incomuns e encontram soluções inovadoras para a interface da web do site. É mais fácil para um desenvolvedor front-end entender a lógica do designer, entender o fluxo de seus pensamentos.
Os sistemas de colaboração com layouts nem sempre simplificam o trabalho. Agora, os sistemas para criar layouts são tão desenvolvidos que o designer pode transmitir ao front-end todas as informações necessárias sem reuniões e discussões pessoais - simplesmente organizando o trabalho conjunto no programa. Por um lado, isso economiza tempo da equipe. Por outro lado, o desenvolvedor precisa entender a ideia do colega e descobrir como o design do layout funciona. Caso contrário, longas discussões e melhorias não poderão ser evitadas.
Como estabelecer a interação entre um designer e um desenvolvedor: regras básicas
Vou dar algumas dicas da experiência pessoal sobre como estabelecer cooperação e tornar o trabalho em equipe confortável.
Se você é um designer e prepara um layout, tente simplificar o trabalho do desenvolvedor front-end:
- Trabalhe na grade. Sim, a assimetria como técnica agora está se tornando popular, mas também deve ser inscrita na grade.
- Digite os objetos o máximo possível no layout. A digitação facilita e acelera o layout.
- Mostre os estados dos objetos na interação.
- Classifique as camadas e nomeie-as com nomes amigáveis. Por exemplo, a camada de cabeçalho é cabeçalho, a camada de botões é botões. Portanto, o desenvolvedor descobrirá rapidamente seu layout.
- Reúna todas as imagens, ícones, fontes e outros elementos em um só local para não perder tempo exportando elementos do layout posteriormente.
- Crie um kit de interface do usuário em uma página separada e mostre todos os estados e elementos.
- Não tenha preguiça de comentar sobre o layout do protótipo antes de passá-lo ao fornecedor front-end - desta forma, um colega descobrirá mais rapidamente.
Se você é um fornecedor front-end e transforma o layout em uma interface de site:
- Sinta-se à vontade para fazer uma pergunta ao designer se algo não estiver claro.
- Se você perceber, por experiência própria, que precisa fazer alterações no layout, primeiro discuta-as com o designer. Quaisquer alterações precisam ser acordadas.
- Se o projeto for de equipe, na primeira etapa do trabalho, discuta com os colegas quais ferramentas você planeja usar e qual a melhor forma de transferir o layout para você.
- Não tenha medo de discutir design e fazer comentários construtivos. Se você perceber que algo não pode ser realizado, explique por que e o que pode ser substituído.
Quando cada membro da equipe entende o que seus colegas estão fazendo e como simplificar suas tarefas, o trabalho ocorre sem problemas. O resultado é uma interface de qualidade, entregue no prazo.
A segunda razão. É mais fácil para um desenvolvedor que conhece design encontrar um emprego
Um desenvolvedor com um bom conhecimento de design pode se tornar um especialista universal e fechar duas posições ao mesmo tempo.
Onde os designers de front-end estão em demanda
Grandes empresas estão dispostas a pagar dois especialistas separados - um desenvolvedor e um designer. Em outros segmentos do mercado, a situação é diferente - geralmente as empresas preferem contratar especialistas universais que, por si só, podem fechar um grande conjunto de tarefas.
Os construtores de sites agora são populares e a maioria dos sistemas CMS funciona como construtores. Com a ajuda deles, um programador pode criar uma interface simples, mas para criar um layout de alta qualidade, você ainda precisa das habilidades de um designer. Designers usam massivamente pequenas empresas e clientes particulares. É mais lucrativo contratar um especialista universal que fará o layout e o transformará em uma interface com ou sem um construtor. Uma situação semelhante é com freelancer.
O que aprender primeiro sobre design se você é um desenvolvedor front-end
Lembro-me imediatamente de uma boa
ilustração dos 20 princípios básicos de design. Eu aconselho você a começar a mergulhar com ela.
Na próxima etapa, entenda na prática as ferramentas de criação de interface: Figma, Adobe XD ou Sketch. Leia, veja as opiniões de cada uma e escolha qual está mais perto de você. O principal não se limita aos manuais. Assista-os e pratique imediatamente suas habilidades na prática, diretamente na ferramenta.
No futuro, recomendo entender os programas 3D: Cinema 4D e Adobe Dimension; e animações de interface: ProtoPie e Adobe After Effect.
Onde estudar
Na universidade. Não vou recomendar universidades, elas dão muito mais para começar rapidamente e o treinamento em si é esticado. Se esta é sua primeira educação, você pode ir à universidade por um diploma. Quem já tem formação deve procurar intensidades (elas são ministradas mesmo em algumas universidades) ou cursos on-line.
Independentemente. A auto-educação é adequada para quem sabe filtrar e estruturar informações, ter perseverança e autodisciplina. Agora, no domínio público, há muitas informações nem sempre verificadas e úteis; nele você pode ficar confuso e se afastar ainda mais das habilidades necessárias.
Em cursos online. Uma opção para quem se preocupa em obter informações estruturadas, instruções e feedback dos professores.
Dicas
- Aprenda o básico do design para entender melhor os layouts e transformá-los em interfaces sem muita discussão e refinamento.
- Estude o design em profundidade para se tornar um especialista universal e candidatar-se a cargos não apenas em grandes empresas, mas também em agências digitais, start-ups e procurar clientes freelancers.
- Domine as ferramentas do designer não pelo manual, mas manualmente - abra o programa e entenda-o.
- Se você estiver pronto para filtrar informações e encontrar materiais úteis de treinamento na Internet, aprenda a projetar você mesmo. Se você deseja acelerar o processo e estudar em um programa estruturado e relevante, escolha cursos.
Se você estiver pronto para aprender o básico do web design, convidamos você para um novo curso em Netology
Lançamos o curso “
Web Design do Zero ao Médio ” e convidamos desenvolvedores de front-end que desejam dominar a interface “do ponto de vista do designer”.
Quatro meses e meio de treinamento em formato de vídeo, workshops e análise de trabalhos de casa. Consolidamos a teoria com a prática e também dominamos as principais ferramentas de um web designer.
