Um bom design de PCB (placa de circuito impresso) é a base de qualquer dispositivo eletrónico. As empresas especializadas em design de placas de circuito impresso devem utilizar as mais recentes tecnologias e processos para entregar os melhores resultados. Ao usar um configurador de PCB, os fabricantes podem visualizar rapidamente as alterações de materiais e o impacto do design em qualquer lançamento de novo produto. As equipas de marketing também podem beneficiar de ter um embed no site a mostrar o novo design.
O objetivo deste configurador de PCB é demonstrar diferentes possibilidades, focando-se no uso de materiais emissivos, onde podes selecionar entre um material emissivo animado, um material emissivo constante ou um não emissivo. As interações ocorrem através dos ícones adicionais do Floating UI.
A Floating UI deve:
O objetivo era visualizar o fluxo de dados da unidade do chipset para os outros componentes do PCB. Os materiais escuros foram escolhidos para melhorar a visibilidade do material emissivo animado. O efeito de bloom foi aplicado para o enfatizar ainda mais.
O modelo foi preparado no 3ds Max. As texturas foram unwrapped e preparadas no Substance Painter. Era importante mostrar as pequenas ligações entre todos os componentes da placa para aumentar o realismo.
Foi selecionada uma paleta de cores escuras para todas as diferentes partes da unidade de PCB. Ao trabalhar com materiais escuros num ambiente escuro, é fundamental experimentar vários tipos. Existe uma grande variedade de contrastes entre materiais metálicos e plásticos. Outro parâmetro importante é a rugosidade (roughness), que afeta a forma como a luz se difunde na superfície. Podes melhorar o aspeto geral com algumas texturas, principalmente nos canais de roughness ou metallic, como o noise.
Para o componente do corpo principal do PCB, um material com thin film é uma das melhores opções. O thin film está localizado nas definições de Advanced Materials. Sugerimos que explores como diferentes cores de gradiente podem afetar o aspeto final do material.
O material animado foi criado no Adobe After Effects e importado como ficheiro Lottie. Utiliza a projeção planar para se ajustar a todos os componentes.
Não foi feito muito baking neste projeto, uma vez que já estava tudo bastante escuro e as sombras eram suficientes.
Para projetos realistas detalhados em pequena escala, uma parte importante do design são os autocolantes, tais como as informações nas unidades de bateria ou do chipset, que acrescentam complexidade.
A foi usado o HDRI predefinido, definido para uma intensidade de 30% com parâmetros modificados. Ao todo, existem quatro luzes:
O principal objetivo era obter bons reflexos de todos os ângulos para que a superfície escura contrastasse bem com o fundo preto.
Existem dois grupos de interações:
Para os materiais emissivos dos pinos, existe uma interação on-load que ativa uma textura animada para ser reproduzida em loop. Com o Floating UI, podes então selecionar um material emissivo constante ou desligá-lo ao mudar para um material escuro. As interações utilizam a alteração de material ao clicar e a visibilidade com ações de mostrar/ocultar.
Dica: Clicar no ícone com a amostra de gradiente de cor ativa uma alteração de material, mas também oculta a amostra do ícone de gradiente e mostra a amostra de cor preta. Clicar na amostra de cor preta oculta-a e mostra a amostra de gradiente de cor. Desta forma, podes criar um loop simples onde podes sempre escolher a opção seguinte disponível. O mesmo princípio aplica-se aos materiais emissivos; só tens de ocultar e mostrar mais ícones.
