Qual é a melhor estrutura frontal para a criação de um site de design de materiais?

Tentarei responder a esta pergunta com meus 3 anos de experiência como desenvolvedor de front-end & UX Designer.

Quando se diz design, o seu a não tem um significado/roles/responsabilidades padrão. Este termo design depende do contexto e perspectiva. Pode-se pedir-lhe para desenhar uma solução ou desenhar uma ideia ou desenhar um ícone, o significado muda com o contexto.

Vamos mergulhar no FED(desenvolvimento front-end), Em geral muitas empresas maiores como a Facebook/Microsoft/Amazon o desenvolvimento front-end faz parte do fluxo da Engenharia de Software e não do fluxo do Design. Estas pessoas são chamadas de Engenheiros de Front-end.

Aqui é o que eles fazem't fazem
1. Decisão sobre tamanho da fonte/cor/background color
2. Projetar um Layout
3. Projetar um botão
4. Decidir margens & paddings
5. Decidir onde colocar o quê. 7. ideias de Brainstorm para desenhar
8. criar um pequeno gráfico fixe
9. Decida as cores no gráfico de barras ou no gráfico de linhas.
10. E talvez mais....

Aqui é o que eles fazem
1. Decida sobre um framework front end (Angular.js, React.js)
2. Crie a arquitetura front-end
3. Construa um CSS orientado a objetos escaláveis
4. Faça revisões de código front-end
5. Preocupe-se com o tempo de carregamento da página/ciclos de pintura
6. Certifique-se de que não há vazamento de memória/XSS/Globais
7. Torne as animações suaves
8. Preocupe-se com a compatibilidade entre navegadores
9. Trabalhe com API's
10. Tente reduzir os tamanhos dos arquivos CSS/JS
11. Escreva uma marcação semântica para o design.
12. E muito mais.....

Em geral estes são do e don'ts,
No entanto existem lugares onde os designers farão o desenvolvimento do front-end.

Por exemplo um designer (seja visual ou UX designer) pode usar bootstrap para construir essas maquetes de alta fidelidade e dar aos desenvolvedores para que eles possam reutilizar o código e fazer o wire up com banco de dados.

Então o código dado pelo UX designer pode não estar pronto para produção, mas ajuda os engenheiros a entender o que o designer está pensando e como o designer quer que ele seja implementado.

Expedia dose isso agora, assim todos os designers convertem seus designs para maquetes de alta fidelidade com alguns dados imaginários e todas as interações, que podem ser consumidas pelo desenvolvedor com alguns ajustes e mudanças.

Quero mencionar apenas um papel no google chamado UI Engineer, este é o papel onde você deve fazer tanto o design da interface como o desenvolvimento Front-end :)

E para concluir tudo depende da equipe em que você está trabalhando.