Jämförda versioner

Nyckel

  • Dessa rader lades till.
  • Denna rad togs bort.
  • Formateringen ändrades.

...

Här hittar du grafiska element och komponenter som tillhör

...

varumärkena 1177

...

och Inera. Till varje komponent finns:

  • en beskrivning,

  • visuell gestaltning

...

  • ,

  • länkar till Figma och Storybook samt

  • tillgänglighetsinformation.

Se mer information om

...

Vill du läsa mer om designmönster respektive komponent så finns det mer information under Designmönster - öppna webbplatser. Se under både Generiskt webb samt Invånartjänster.

...

Om tjänsten riktar sig mot invånare eller profession påverkar det ramverkets design:

  • tjänst mot invånare har bl.a. röda H1 och H2 rubriker, röd/rosa sajthuvud, röd sajtfot.

  • tjänst mot profession har bl.a grå H1 och H2 rubriker, vitt sajhtuvud och sajtfot.

Om tjänsten förmedlar information/inspiration eller är ett verktyg styr det hur innehållet gestaltas:

  • information/inspiration har t.ex röda lister på navigationsbrickor

  • verktyg har t.ex blå lister på navigationsbrickor

...

Figma här.

Namn på kategorier och komponenter är på engelska, för att matcha namngivningen i komponentbiblioteken i Figma och Storybook.

...

Innehållsförteckning
minLevel1
maxLevel3

...

Vad gäller?

Tillgänglighet

Komponenterna i detta bibliotek är designade för att placeras på vit bakgrund. Om annan bakgrundsfärg används behöver färgkontrasterna ses över. Till varje komponent finns även tillgänglighetskrav, se avsnittet “Tillgänglighet” på respektive komponentsida.

Regler - vad man får och vad man inte får förändra

Syftet med komponentbiblioteket är att så långt som möjligt använda samma komponenter med samma design för att få en enhetlig look and feel över olika tjänster. I vissa fall kan dock komponenter behöva förändras för att passa sin kontext. Exempelvis textfält, dropmenyer och knappar kan behöva ändra höjd eller storlek i vissa verktyg. Det viktigaste är att man försöker behålla samma känsla som i övriga tjänster.

Ej förändringsbart:

  • Logotyper

  • Typsnitt

  • Färger

Logotyper, typsnitt och färger anges i 1177

...

:s varumärkesmanual och får inte ändras.

Möjligen förändringsbart

  • Textfält

  • Dropmenyer

  • Knappar

  • Etc

...

Sketchbibliotek 1177 Vårdguiden

Sketchbiblioteket är ett designverktyg för UX/UI och ska säkerställa att rätt komponenter används redan i skisserna.

Färger, logotyper och ikoner - 1177

1177 Vårdguidens färgpalett, typografi, logotyper, ikoner samt den grid som vi utgår ifrån.

Ramverk och navigation - 1177

Här hittar du sajthuvud och sajtfot för desktop, tablet respektive mobil. Dessa skiljer sig åt beroende på målgrupper: riktad mot invånare eller mot profession.

Formulär - 1177

Alla formulär- och interaktiva objekt utöver navigering och sajtfot kännetecknas av den blå färgen. Du hittar alla beståndsdelar här.

Sök, listor och accordions - 1177

Komponenter som hör till sök, olika listor och accordions.

Meddelanden och modaler - 1177

Olika typer av komponenter som hör till meddelanden och modaler.

Puffar - 1177

Puffar leder oftast till relaterat innehåll.

Bild och video - 1177

Bildstorlekar, bildtext, bildspel och video.

Övriga komponenter - 1177

Tabeller, grafisk datummarkör, tooltip etc och mer.

...

Sidmallar - 1177

...

  • .