Conceitos essenciais sobre design systems

O digital mudou, e muito a forma dos consumidores se relacionarem com as marcas. A economia que outrora estava alicerçada na simples produção e comercialização de bens transformou-se num mercado global. Mercado esse onde a tecnologia enquanto ferramenta de comunicação, criou nos consumidores e nas marcas necessidades novas e digitais.

Toda esta transformação digital trouxe consigo vários desafios a diferentes áreas da comunicação. Desde o marketing às relações públicas, passando pela publicidade e o planeamento de meios, muitas áreas tiveram que se reinventar num curto espaço de tempo.

Também o design, como não poderia deixar de ser, com a transformação digital da relação dos consumidores com as marcas, necessitou de reinventar as suas áreas de atuação e as suas abordagens. A área que nasceu muito ligada às artes manuais, é hoje um espaço projetual cada vez mais virado para as necessidades digitais dos consumidores. O design evoluiu da simples especialização de saber-fazer objetos para o dia-a-dia, para uma metodologia de saber-fazer mas também saber-pensar os produtos digitais do quotidiano.

Paralelamente a esta necessidade, o design tem sido também amplamente exposto a uma necessidade clara das marcas na relação com os seus consumidores: a rapidez. Fazer, só por si, já não chega. É preciso fazer rápido.

Os processos de decisão dos consumidores são hoje menos lineares e mais colaborativos. Isto obriga as marcas a procurarem constantemente construir relações inovadoras mas ao mesmo tempo duradouras. Relações, muitas delas digitais, com várias tipologias de públicos ao mesmo tempo, em alguns casos, em diferentes pontos do globo.

Desafio do design no digital

O paradigma do design mudou, especialmente com o aparecimento de muitos dos produtos digitais que vieram transformar em muito a vida do dia-a-dia. No contexto digital, a área de competência que outrora procurava olhar para o produto como um todo, vê-se hoje obrigada pensar os produtos cada vez mais por partes.

A complexidade dos produtos em que o design se vê hoje envolvido, seja um website, uma aplicação móvel ou um qualquer outro produto digital, obriga cada vez mais a uma segmentação do desafio de pensamento e desenho. Passámos de um paradigma de pensamento global do produto, para uma visão parcelada do processo de design.

O desafio do design digital nos dias de hoje está intimamente ligado com a capacidade de conseguir trabalhar ao longo do tempo, de forma evolutiva e segmentada nas várias dimensões de um produto, envolvendo no processo vários tipos de profissionais (algumas vezes distribuídos por vários pontos do globo) mas também contributos concretos dos utilizadores.

A resposta a este desafio está muito longe de ser consensual. A democratização do processo e a pluralidade de abordagens levou a um contexto em que a resposta a este desafio possa ser dada através de várias soluções, muito dependente dos produtos, equipas e metodologias em causa. Contudo, o pensamento de desenvolvimento segmentado e evolutivo de produtos digitais tem vindo a desafiar a comunidade criativa a encontrar consensos entre si no que toca a novos métodos de pensar e desenhar.

Das muitas soluções que têm surgido no contexto do desenho e desenvolvimento de produtos digitais, os design systems são provavelmente umas das abordagens mais interessantes. Esta nova perspetiva do desenho e desenvolvimento de produtos digitais tem ganho bastante relevância, muito por causa de numa mesma metodologia; conseguir segmentar a intervenção das equipas no produto, ao mesmo tempo que enquadra essa intervenção num contexto macro de evolução.

Definição de design systems

Embora a definição de design systems possa variar um pouco conforme a perspetiva de cada equipa, é relativamente simples encontrar alguns pontos comuns entre todas as caracterizações possíveis.

Na generalidade dos casos entende-se que design systems são um conjunto de orientações que funcionam essencialmente como uma base de trabalho comum entre as equipas de desenho e desenvolvimento de um qualquer produto digital. Por conseguinte, a finalidade principal destes sistemas escaláveis passa por definir de forma evolutiva todos os elementos, componentes e páginas essenciais à construção da user experience (UX) e user interface (UI) de um produto digital.

A construção e integração de diferentes conteúdos nestes conjuntos de orientações poderá depender muito do produto digital que se está a desenhar e desenvolver. Conforme cada projeto, poderá ser necessário incluir diferentes tipos de orientações, o que não desvirtua em nada o conceito de design systems, muito pelo contrário, fortalece sim a sua lógica de adaptabilidade e versatilidade a diferentes tipos de produtos, contextos e equipas.

Elementos, componentes e páginas

Mais que um simples conceito de pensar através de sistemas, os design systems, conseguem tangibilizar em dimensões aquilo que são as suas diferentes peças. Uma das ideias fundamentais a interiorizar quando se trabalha com um design systems é que a tarefa de desenho e desenvolvimento será mapeada por dimensão e acima de tudo de forma crescente na sua abrangência.

Das várias perspetivas e linhas de pensamento sobre design systems, esta identificação de dimensões poderá variar um pouco, contudo não é difícil encontrar em quase todas as perspetivas, uma consolidação de três diferentes níveis: elementos, componentes e páginas.

A primeira dimensão e mais básica de um design systems, é o conjunto dos elementos que representam no fundo todas as unidades primárias e transversais do desenho de um qualquer interface. Exemplos de elementos: tipografia, estilos de texto, cores, espaçamentos, iconografia, ilustrações, fotografias, botões, etc.

Consolidados os principais elementos do interface, é possível então relacionar todas as essas peças entre si, criando com isso os componentes representativos das várias funcionalidades e conteúdos do produto. Exemplos de componentes: menu, agenda, notícias, listagens, subscrição de newsletter, rodapé, etc.

Na dimensão dos componentes podemos atribuir diferentes níveis de abrangência à palavra propriamente dita, pois um componente poderá integrar em si diferentes tipos de componentes mais pequenos, como por exemplo: num componente de “notícias” cada um dos “cartões” dedicados a cada notícia, poderá ser identificado, de forma lata, como componente.

Por fim, definidos todos os componentes necessários, é possível criar então as páginas que são transversalmente os espaços que relacionam os vários componentes. Exemplos de páginas: homepage, categoria, artigo, etc.

Vantagens dos design systems

Os design systems não são apenas mais uma ferramenta para o desenho e desenvolvimento de produtos digitais. São, com toda a certeza, um contributo muito interessante para aumentar a eficiência do processo de evolução do produto e uma maior rapidez na integração de novos contributos dos utilizadores.

Para além desta premissa de aumento da eficiência e rapidez, os design systems, como qualquer ferramenta, personificam também um conjunto mais alargado de vantagens, que podem ser um argumento muito valioso quando se questionar as mais-valias da utilização desta lógica de desenho e desenvolvimento num qualquer produto.

Afirmação de uma visão modular e evolutiva do produto digital

Adotar uma abordagem como um design systems, pressupõe sempre uma visão modular do processo de desenho. Visão essa que nunca perde a noção da globalidade do produto digital que está a trabalhar, mas que a dada altura consegue circunscrever o seu foco no desenho de componentes mais pequenos. É precisamente esta capacidade de fazer evoluir o produto digital, através da evolução de componentes mais pequenos, que podem dentro de uma equipa ser trabalhados por diferentes profissionais, que ajuda a garantir, segundo uma lógica de design systems, a implementação transversal de um conceito de modularidade, mais do que uma visão absoluta no processo de desenho.

Agilidade na criação, implementação e manutenção de componentes

Pensar segundo uma lógica de componentes, tem a vantagem de conseguir autonomizar, até certo ponto pequenas partes do desenho do produto. Esta organização modular, aliada à necessidade de documentar todas as etapas e decisões do processo de desenho e a partilha recorrente em equipa de toda essa documentação, garante uma maior agilidade, hierarquia de prioridades e amplitude de opções na gestão de evoluções, testes ou até mesmo experimentalismos que podem em algum momento vir a integrar a versão final do produto digital.

Construção de orientações transversais entre equipas de forma colaborativa

Cada vez mais, os produtos digitais são suportados por equipas localizadas em diferentes pontos do globo. A evolução constante do produto e a oportunidade de integrar diferentes profissionais em diferentes fases do processo trouxe consigo a necessidade de passagem cada vez mais frequente de tarefas entre equipas. Num design system é essencial que todo o desenho seja suportado por documentação de apoio, no fundo uma “fonte da verdade” a que qualquer elemento da equipa possa recorrer quando tem a tarefa de desenhar um novo componente, mas que permita também a inclusão de novos contributos para que esta fonte nunca fique desatualizada ou obsoleta.

Fortalecimento da coerência entre os diferentes componentes

O facto de num design system existir sempre uma necessidade de criar guidelines comuns a todas as equipas, quer sejam de desenho ou desenvolvimento, potencia em grande medida uma abordagem coerente em todos os momentos do produto digital. Assim sendo, se todas as equipas estiverem a trabalhar segundo uma mesma base e a contribuírem para um mesmo centro de documentação, para além de ser muito mais fácil encontrar inconsistências nas abordagens, é também relativamente mais simples evitar que essas inconsistências se repitam ou perdurem no tempo.

Otimização do tempo e do custo de desenho e desenvolvimento

Uma abordagem segundo um design system permite uma série de inovações, é certo, mas acima de tudo garante um processo focado na eficácia das tarefas. Eficácia, porque reduz em grande medida o esforço de criação a partir do início de algo, mas também elimina ao máximo tarefas redundantes. Por exemplo, garante que os profissionais se concentram naquilo que podem fazer a diferença, criando pelo caminho um histórico de projeto, reutilizável em diferentes momentos. Eficácia em design systems, quer em última análise dizer, poupanças de tempo e custo, que são sempre argumentos muito valiosos em qualquer negócio.

Mitos sobre design systems

Contudo, é fundamental olhar para uma ferramenta como os design systems com algum sentido crítico, pois não são única solução possível para um produto digital. Como qualquer ferramenta, os design systems têm vantagens claras, mas com o tempo também foram aparecendo em torno do tema alguns mitos. Mitos, ou melhor dizendo, falsas ideias, que mais que não são do que visões prematuras e desinformadas da verdadeira abrangência desta ferramenta.

Limitam de forma excessiva a criatividade

Um processo que utilize uma ferramenta como os design systems está longe de ser um processo limitativo da criatividade. Pelo contrário, os design systems ao permitirem, a dada altura do processo, organizar de forma muito concreta tudo aquilo que são os elementos, componentes e páginas fruto da criatividade, otimizam ao máximo tudo aquilo que são tarefas de ligação entre as equipas de desenho e desenvolvimento. Ao simplificar a colaboração entre equipas, os designs systems permitem não só uma ligação mais eficiente, mas também contribuem precisamente para que exista mais tempo disponível no processo para toda a dimensão e dinâmicas criativas de cada metodologia.

Obrigam a padronizar demasiado o desenho do produto

Sistematizar todas as componentes de desenho de um produto num design systems é diferente de padronizar esses mesmos componentes. Enquanto ferramenta, não pretendem limitar, seja em número ou forma os vários componentes. Pretendem sim, estabelecer denominadores comuns entre eles, reduzindo ao máximo a redundância ou incoerência entre os vários componentes.

Exigem um planeamento inicial demasiado grande

A modularidade é um dos conceitos fundamentais dos design systems. É possível olhar para este conceito de várias perspetivas, mas uma das mais interessantes é numa lógica de crescimento. Crescimento no sentido em que, para a criação de elementos e componentes é preciso pensar que estes ao longo do processo vão crescer em número. Acima de tudo, o mais importante e que contraria de forma categórica este mito, os design systems não necessitam de um planeamento inicial demasiado grande. É fundamental sim, compreender que tudo aquilo que se vai criando durante o processo deve ter a propriedade de ser replicado e reutilizado.

Só são possíveis de construir com conhecimentos de código

Tempos houve que este mito era bem verdade e que para se criar um design systems eram necessários alguns conhecimentos de código. Mas, nos dias de hoje, nada poderia ser mais enganador. As próprias ferramentas de desenho de produtos digitais, como por exemplo o Sketch, caminharam numa lógica de desenho através de design systems. Quase todas estas ferramentas, permitem logo na fase de criação de protótipos, implementar lógicas de desenho modulares e de reutilização de elementos e componentes gráficos.

São mais fáceis de criar no final do projeto

Um design system criado no final dos processos de desenho e desenvolvimento é uma ferramenta desnecessária. Desnecessária no sentido de que não se aproveitou a versatilidade e adaptabilidade que algo como os design systems permitem incorporar em qualquer metodologia. Sendo uma ferramenta que permite grandes economias de tempo, implementar um design systems no final ou numa fase avançada do processo torna-se uma redundância. Esta aplicação não está a libertar nas fases de desenho e desenvolvimento propriamente ditas o tempo que pode ser aplicado noutras tarefas da metodologia.

Sugestões de leitura

Tal e qual como no desenho e desenvolvimento, a investigação e aprofundamento sobre a temática dos design systems deve relacionar diferentes tipos de perspetivas. Atualmente é bastante simples encontrar online conteúdos relacionados com a temática dos design systems e que poderão enriquecer em muito a exploração desta abordagem. Por conseguinte, dos vários conteúdos publicados, existem alguns que são referências importantes quando o assunto são design systems, quer seja numa lógica teórica ou prática:

O tema dos design systems está muito longe de ser uma verdade absoluta ou a única ferramenta possível para o desenho de produtos digitais. São o resultado da evolução natural do design em contexto digital na procura de uma maior eficiência e rapidez. Ao mesmo tempo que permite uma participação cada vez maior dos utilizadores nos processos iterativos de evolução dos seus produtos do dia-a-dia. São também um espaço onde cada equipa pode desenvolver as suas aptidões, num contexto que acolhe o erro e o utiliza como fator de evolução, seja ela humana ou tecnológica.

Ilustração © Ana Rute Costa