Vantagens dos Design Systems na ótica dos profissionais | Blog EDIT.
Vantagens dos Design Systems na ótica dos profissionais
À medida que o design digital se torna parte dos negócios e empresas, o design tornou-se tão complexo como as próprias organizações. Neste sentido, a InVisionapp juntou um Front-end Developer, um Designer & Creative Director e um Product Director & Interaction Designer e lançou o repto de desconstruírem os desafios organizacionais que surgem ao desenhar à escala produtos digitais. Ao mesmo tempo, o objetivo seria revelarem como é que os Design Systems podem unir equipas e trazer consistência face à crescente procura por produtos digitais, hoje em dia.
Brad Frost é um Front-end Developer cujo principal foco baseia-se em construir código que seja escalável, flexível, com bom desempenho e estimável. Preocupa-se com a forma como estes componentes de User Interface (UI) percorrem o seu caminho até tornarem-se produtos de software de trabalho reais.
Dan Mall é Designer & Creative director e trabalha no âmbito de um design colaborativo denominado SuperFriendly. O seu dia-a-dia é a ajudar os designers a perceber como trabalhar com Design Systems, quais são os seus verdadeiros papéis, como podem colaborar melhor e estar em sintonia com todas as outras pessoas que trabalham num mesmo projeto.
Josh Clark é Product Director & Interaction Designer e dirige um estúdio de design denominado Big Medium. Josh ajuda as pessoas a compreender como criar um Design System como um produto, que vá de encontro ao ADN de determinada organização.
Desenhar à escala
"Quando se tem uma equipa pequena a trabalhar em algo, toda a gente nesta equipa sabe como tudo funciona e está familiarizado com a forma como o sistema que estão a criar trabalha" refere Josh Clark. Contudo, à medida que o trabalho e projetos crescem, não é de todo possível manter-se a par dos mesmos e acompanhar tudo ao pormenor. É natural que quantas mais pessoas trabalham em algo, "mais ineficiências" possam surgir.
O Product Director acrescenta que este é um desafio real, particularmente para organizações maiores, mas também para qualquer pessoa que trabalhe num grande projeto ou num grande número de projetos ou produtos. Muitas vezes, surge uma solução ou ideia de design que é implementada, mas outra pessoa, da mesma empresa ou do outro lado do mundo, também apresenta uma solução similar. Isto acaba por ser uma perda de energia, esforço, criatividade e talento, com pessoas a resolver o mesmo problema, mais do que uma vez.
Para Brad Frost, existe um conjunto de benefícios em ter um Design System: estes promovem consistência e coesão em UI, permitem uma produção mais rápida e de alta qualidade, estabelecem um vocabulário partilhado entre disciplinas e diferentes produtos, tornando assim as coisas mais fáceis de se testar. Fornecem ainda uma base amigável para fazer crescer e evoluir o sistema ao longo do tempo. O resultado? Soluções "mais resistentes e resilientes".
Design System não é um UI kit
O Designer & Creative Director Dan Mall afirma que trabalha com vários designers e equipas de design e que a primeira impressão destes sobre o que é um Design System, é ser um kit de UI. Todavia, não é verdade. Um UI Kit de Sketch ou Photoshop pode fazer parte de um DS, mas é só uma ferramenta, que só os designers podem usar por estarem mais familiarizados. Uma parte bastante boa de um Design System é que esta é uma ferramenta acessível a todos os membros da equipa. Por este motivo, permite que as pessoas saiam da zona de conforto, trabalhem mais uns com os outros e se envolvam ainda mais nos projetos.
De uma forma mais específica, Brad revela que um Design System pode incluir aspetos como princípios de design, guidelines de UX de alto nível, guidelines de desenvolvimento, padrões de interface do utilizador e ao mesmo tempo a voz da marca, tom e guidelines de escrita, recursos internos e externos.
Inventário de interface
Brad Frost partilha, no contexto dos Design Systems e do seu trabalho diário, o que é um inventário de interface, e como se processa. Este é um "exercício onde se reúnem todas as instâncias de padrões de UI design nos diferentes produtos de uma organização" e que podem incluir diferentes propriedades da web, propriedades nativas, aplicações internas e externas. Este inventário é verdadeiramente útil por obter o ADN dos vários produtos da organização, permitindo ditar e determinar a composição e roteiro dos Design Sytems.
O primeiro passo ao conduzir um destes inventários diz respeito à reunião de todas as pessoas, para agregar as diferentes disciplinas responsáveis ​​pelo sucesso do Design System: inclui designers, developers, responsáveis de Quality Assurance, gestores de produto, entre outros. Uma vez que estas equipas não falam a mesma linguagem, este será um importante exercício para estabelecer o já mencionado vocabulário partilhado. Através do mesmo poderá concluir-se, por exemplo, porque é que algumas interfaces de utilizador são inconsistentes e incongruentes.
A segunda etapa do inventário passa por preparar capturas de ecrãs (screenshots), basicamente, passando por diferentes produtos e ecrãs, capturando padrões exclusivos de UI. Por isso, precisamos estabelecer um lugar comum para colocar e categorizar todas as imagens. Brad sugere o Google Slides, por permitir às equipas colocar estes screenshots num só local e rapidamente partilhar o link com o resto das pessoas.
Depois, combinando estes produtos e procura por padrões, dividem-se pelo tipo de categoria de UI a que os componentes pertencem. Por exemplo, o gestor de produto pode ser responsável por encontrar cabeçalhos e rodapés ao longo das diferentes propriedades; a pessoa seguinte pode ser responsável por encontrar estilos de botões únicos; outra pessoa pode recolher diferentes formas de componentes, como checkboxes, campos de formulário, áreas de texto e menus de seleção; outra pela tipografia; outra pelo motion.
Quando todos mostram o que encontraram, a todas as equipas, no quinto passo são consolidados todos os padrões de UI encontrados no exercício, e colocados num grande documento, que se pode fazer circular pela organização. Ao serem mostrados todos estes aspetos, a ao consolidar os padrões inconsistentes, uns ao lado dos outros, torna-se bastante real – a "mágoa do design em escala".
Concluindo, os inputs de vários profissionais podem oferecer uma visão do mundo real, no âmbito dos Design Systems, e muitos dos aspetos que estes podem resolver. E, neste sentido, porque devem as organizações adotá-los.