Aprender sobre sistemas de design
Objetivos de aprendizagem
Após concluir esta unidade, você estará apto a:
- Identificar as características e os recursos de um bom sistema de design.
- Descrever como os designers e desenvolvedores usam, gerenciam e contribuem para sistemas de design.
- Explicar como o Salesforce Lightning Design System (SLDS) auxilia os desenvolvedores na criação de soluções na Salesforce Platform.
- Descrever como e de que forma o SLDS difere da maioria dos sistemas de design.
O que é um sistema de design?
Antes de nos aprofundarmos e explorarmos seus poderes mágicos, vamos definir sistema de design.
Definição de sistema de design |
Explicação |
|---|---|
|
Sistema de design é uma coleção de código reutilizável e padrões de design que podem ser repetidos, chamados componentes. Os componentes incluem botões, menus, sons, animações, padrões visuais e muito mais. Em alguns sistemas de design, eles podem ser totalmente funcionais e criados com base em uma plataforma de IU. Em outros, incluindo o SLDS, eles são independentes da plataforma. |
Pense em um sistema de design como um conjunto de blocos de construção (até mesmo aqueles tais blocos de plástico amados por crianças e adultos). |
Um sistema de design é orientado por padrões, princípios e documentos claros e acessíveis. |
Assim como os blocos amados, os componentes em um sistema de design são bastante padronizados, com aparência reconhecível. |
Os desenvolvedores combinam os componentes do sistema de design de várias maneiras para criar aplicativos em JavaScript. As diretrizes de design servem como instruções para montar componentes como padrões para casos de uso específicos. |
Os componentes não fazem muita coisa sozinhos, mas, quando unidos, podem criar quase tudo. |
Um bom sistema de design é:
-
Escalável. À medida que o sistema de design vai amadurecendo, menos tempo e dinheiro são gastos na criação de elementos fundacionais (blocos de construção). Os desenvolvedores reutilizam esses elementos em vários produtos e recursos.
-
Eficiente. Os sistemas de design economizam tempo e energia, liberando designers e desenvolvedores para se concentrarem na usabilidade e no significado.
-
Visualmente coeso. Os padrões de um sistema de design são ligados à finalidade. Seus elementos estéticos vêm das necessidades dos usuários. Os componentes padronizados reforçam tanto o estilo quanto a identidade visual, resultando em produtos e recursos que têm aparência consistente e oferecem uma experiência de usuário consistente.
-
Compartilhado. Elementos reutilizáveis, documentados e acessíveis permitem a colaboração, facilitando a divisão de partes do projeto ou criação entre pessoas.
Começar a criar agora
Assim como os blocos de construção, um sistema de design permite a você começar a criar imediatamente. O uso de componentes pré-criados permite a você se concentrar em resolver problemas complexos e oferecer a melhor experiência de usuário.
Outra grande vantagem de um sistema de design é que ele permite gerenciar o design em larga escala. A biblioteca de componentes, regras e diretrizes ajuda a manter a consistência entre designers, desenvolvedores, equipes e produtos. Um sistema de design evolui quando precisa de mudanças, permitindo que designers e desenvolvedores atualizem interfaces e ferramentas em uma plataforma complexa de maneira rápida e fácil.
Conhecer os jogadores
Um sistema de design é tão bom quanto suas partes interessadas.
-
Consumidores são os designers, desenvolvedores e partes interessadas que usam elementos do sistema de design para criar aplicativos. Os consumidores vêm tanto de dentro quanto de fora da empresa que criou o sistema de design quando a empresa, como a Salesforce, tem um ecossistema de clientes que criam aplicativos em sua plataforma.
-
Colaboradores criam elementos e padrões que compõem o sistema de design. Para cada lançamento, todos podem propor novos padrões, componentes ou diretrizes, ou sugerir alterações nos que já existem.
-
Curadores são guardiões do sistema de design. Essa equipe de engenheiros, designers de produto e designers visuais mantém o sistema de design, supervisiona o código e ensina a comunidade a usá-lo. Os curadores analisam as atualizações propostas e as incorporam para melhorar o sistema de design.
Se você está lendo este texto, provavelmente é um consumidor ou colaborador do SLDS.
O Lightning Design System na Salesforce
Na Salesforce, adoramos sistemas de design. Um motivo pelo qual a Salesforce Platform é tão poderosa é que ela se adapta às necessidades complexas de uma grande quantidade de usuários.
Também estamos crescendo rapidamente, expandindo tanto nosso escopo de produto quanto número de funcionários. À medida que vamos crescendo, tratamos de mais necessidades de usuários. É essencial criamos uma experiência de produto coesa de forma eficiente e em larga escala.
O SLDS permite que as equipes do Salesforce façam isso. Os padrões específicos de casos de uso permitem que os designers iterem mais rapidamente e criem soluções coesas mais eficientemente. Os desenvolvedores de componentes sempre têm a estrutura mais recente, com marcações acessíveis e limpas e CSS perfeito até os pixels, para poderem trabalhar mais rapidamente e sem erros. Os clientes e parceiros criam personalizações na Salesforce Platform usando um sistema consistente, limpo e frequentemente atualizado que inclui explicações e exemplos de design claros, eliminando a tentação de fazer engenharia reversa nos softwares.
A maioria dos sistemas de design oferece código totalmente funcional. Mas como o SLDS é compatível com tantas bases de código diferentes, como componentes web do Lightning e React, ele precisa se manter independente. (Para saber mais sobre como o SLDS difere de outros sistemas de design, confira os Recursos ao final desta unidade.)
Em seguida, vamos voltar no tempo até o nascimento do SLDS.