Close

Categorieën

Sjabloon voor ontwerpcomponenten

door Tony Starr, Lead Content Designer @ Atlassian

Maak een bibliotheek van zorgvuldig gedocumenteerde ontwerpcomponenten

Sjabloon gebruiken
Sjabloon voor ontwerpcomponenten

Het bijhouden van alle componenten die je team gebruikt in zijn ontwerpen kan moeilijk zijn, vooral wanneer je team aan het groeien is. Met de sjabloon voor ontwerpcomponenten kun je elk component documenteren, van de basisinformatie zoals wat de component doet tot de specificaties zoals hoe de component eruitziet en wat deze doet in verschillende omgevingen. Er is zelfs een gedeelte voor extra ondersteuning waar je componentspecifieke regels voor content, toegankelijkheid, mobiliteit en meer kunt uitleggen. Maak een complete componentenbibliotheek vanaf nul!

Het Ontwerpcomponent-sjabloon gebruiken

Stap 1. Begin met de basisinformatie

Voordat je in kunt gaan op de belangrijkste specificaties van een component, moet je eerst zorgen voor een goede basis. Begin bij het invullen van de rijen Basisgegevens component: geef je component een naam, beschrijf wat deze doet en upload een structuurdiagram met genummerde tekstvakjes. Gebruik die tekstvakjes om een code te maken en elk element van de structuur van de component te definiëren. Het doel van dit gedeelte is om mensen die de component gebruiken een beter beeld te geven van alle onderlinge relaties.

Stap 2. Leg de specificaties vast

Hier ga je de verschillende manieren waarop een component gebruikt kan worden als onderdeel van je ontwerpen voor een grotere functie. Beschrijf hoe de component wordt gebruikt, waaronder zijn doel in je gehele ontwerp. Vervolgens geef je aan hoe de component wordt weergegeven en zich gedraagt in verschillende omgevingen. Gebruik de live code van de repo voor je ontwerpsysteem om verschillende variaties weer te geven. Tot slot, beschrijf je de visuele stijl van de component. Zorg ervoor dat je voorbeelden noemt van wat je wel en niet moet doen.

Stap 3. Documenteer tips en best practices

Elk component heeft unieke kenmerken. Leg deze vast in Extra ondersteuning. Begin met content: zijn er specifieke interpunctieregels voor deze component? Zijn er standaardlabels? Schrijf ze op en noteer ook opmerkingen over componentspecifieke toegankelijkheid en tips voor het toepassen van de component in mobiele omgevingen. Als er toonaangevende best practices zijn voor hoe de component wordt gebruikt, neem je deze ook op. Ten slotte, voeg je links naar gerelateerde componenten of patronen toe.

Stap 3. Documenteer tips en best practices
Atlassian

Tony Starr

Lead Content Designer @ Atlassian


Tony is een Lead Content Designer bij Atlassian. Hij is een multidisciplinaire technische en contentschrijver die het geweldig vindt om normen op te stellen en de grenzen op te zoeken van ondersteunende content.

  • Content design glossary template

    Atlassian

    Content design glossary

    Teach writers how to use product names, industry terms, and other content with an A-Z guide.

    Sjabloon gebruiken Meer informatie
  • Customer interview report template

    Atlassian

    Rapport klantgesprek

    Zet met het rapport voor klantgesprekken deze gesprekken om in waardevolle inzichten.

    Sjabloon gebruiken Meer informatie
  • Design decision template

    Atlassian

    Design decision

    Use our design decision template to review design options, present design examples, and log design decisions. 

    Sjabloon gebruiken Meer informatie