Design component template screenshot preview

Template Componente de Design

Criado por:

Atlassian logo

Crie uma biblioteca de componentes de design documentados com cuidado

Categorias

  • Design

Principais funções

  • Documentação

  • Requisitos

  • Base de conhecimento

Design component template screenshot preview

Monitorar todos os componentes que a equipe usa nos designs pode ser complicado, ainda mais quando a equipe está crescendo. O template do componente de design ajuda a documentar cada um, desde os princípios básicos, como o que o componente faz e como ele funciona, até como ele se parece e age em contextos diferentes. Existe até uma seção para orientação adicional, em que você pode explicar regras específicas do componente, acessibilidade, mobilidade etc. Crie uma biblioteca inteira de componentes do zero!

Como usar o template de componente de design

  1. 1

    Comece com o básico

    Antes de entrar no aspecto mais importante das especificações de um componente, você precisa conhecer o básico. Comece preenchendo as linhas em Noções básicas do componente: dê um nome ao componente, descreva o que ele faz e carregue um diagrama de anatomia com textos explicativos numerados. Use esses textos explicativos para criar uma chave e defina cada elemento da anatomia do componente. O objetivo desta seção é explicar às pessoas que usam o componente como tudo se encaixa nele.

  2. 2

    Descreva as especificações

    É aqui que você começa a descrever as diferentes formas de usar um componente como parte dos designs para uma função maior. Descreva como o componente é usado, incluindo o objetivo geral no design, e como ele se parece e age em contextos diferentes. Use o código ao vivo do repositório do sistema de design para exibir variações diferentes. Por último, descreva o estilo visual do componente. Inclua exemplos do que fazer e do que não fazer.

  3. 3

    Documente dicas, truques e práticas recomendadas

    Todo componente tem peculiaridades. Faça o registro delas em Orientações adicionais. Comece com o conteúdo: existem regras de pontuação específicas para esse componente? E quanto às etiquetas padrão? Anote cada uma delas junto a dúvidas de acessibilidade específicas do componente e dicas para aplicar o componente em ambientes móveis. Se houver práticas recomendadas padrão do setor sobre como o componente é usado, também faça uma lista delas. Por fim, adicione links a quaisquer componentes ou padrões relacionados.

Templates relacionados

Design

glossário de design de conteúdo

Ensine escritores a usar nomes de produtos, termos do setor e outros conteúdos com um guia de A–Z.

Design

estratégia de conteúdo

Mapeie a estratégia de conteúdo e organize o calendário editorial

Gestão de produto

Relatório de entrevista com o cliente

Transforme as entrevistas com o cliente em dados com o último relatório de entrevista com o cliente.