navikt / Designsystemet-old

Designsystem-teamet i NAV sitt offisielle område på Github
https://design.nav.no
MIT License
8 stars 1 forks source link

Revurdere ikonbibliotek #115

Closed Lillebo closed 3 years ago

Lillebo commented 4 years ago

Det er flere problemer med dagens ikonbibliotek:

Det bør gjøres en vurdering om vi ønsker å beholde dagens ikon-bibliotek eller ikke. Noen alternative løsninger kan være:

  1. Kjøpe et annet ikon-bibliotek med bedre ikoner
  2. Adoptere et annet gratis, åpent ikon-bibliotek (f.eks. Material Icons)
  3. Lage nye egne ikoner
  4. En kombinasjon av 2 og 3: f.eks. adoptere Material for vanlige, generiske ikoner (som "delete", "save" osv.) og heller lage egne for NAV-spesifikke domene-behov (som "ytelse", "trygd", "sykepenger", "dagpenger", "barnebidrag" osv.)

Fra @Miaag:

Lillebo commented 4 years ago

@Vikingwind Har laget et sett med egne ikoner som et mulig alternativ.

Screenshot 2020-02-18 at 12 58 13

Det har blitt avtalt at Team Personbruker skal teste litt med disse i arbeidet med ny dekoratør, og ~@Lilyngs skal teste litt med dem på interne flater~ (for tidlig, muligens senere).

@Vikingwind Er det slik at disse ikonene er modifiserte versjoner av Streamline-ikonene vi har fra før?

Lilyngs commented 4 years ago

Her en oversikt over ikoner vi trenger i Sykepenger akkurat nå.

Arbeidsgiver Manuell vurdering Ikke tilgjengelig data Data fjernet Forenkletvurdering Periode Oppgave Forlengelser Overstyring Saksbehandler Beslutter Til godkjenning Til behandling Til utbetaling Ufullstendig Venter Utbetalt Ytelse Infotrygd Kildeikoner Historikk Mappe Arbeid Kopier Død Overlapp Meny (3 prikker)


Vi vil måtte trenge fylte versjoner for god hierarki og tydelighet. Tydelighet når det er "viktig" interaksjon eller tydelighet når ikonene er små.

Skal man skille på ikoner for interne og eksterne flater? System/funksjonelle ikoner, illustrative ikoner osv.

Når bør ikonene være minimalistiske, når kan man tillate mer detaljer?

Vikingwind commented 4 years ago

@Lillebo de er ny tegnet, ingen fra den gamle streamline

Lilyngs commented 4 years ago

@Lillebo Er det store kostnader i det å oppgradere Streamline ikonene til nyeste versjon, der de bla tilbyr tykkere strek? Det vil uansett være behov for tilpassede ikoner, og det er en jobb DS kanskje har mulighet til å gjøre. Men det å designe alle ikoner, oppdatere, optimalisere samt dekke nye behov høres ut som en veldig stor jobb.

ghost commented 4 years ago

Logg inn og ut ikon Nå har begge pilen inn i «døren». Ingen av pilene går ut av «døren» Nå «går» man inn på begge ikonoene. Endringsønske: Endre plassering/retning på pil for å illustrere at man «går» ut av døren. Logg inn – Pil inn i dør Logg ut – Pil ut av dør

logg-inn-ut_ikon
Miaag commented 4 years ago

Status: Wei har laget ca 50 stk nye ikoner med 2px tykkelse og med et enklere uttrykk enn streamline ikonene. Planen videre er at disse ikonene skal testes sammen med Team personbruker i arbeidet med ny designretning, og i dialog med kommunikasjonsavdelingen. Sammen vil vi vedta en beslutning når vi har testet og utprøvd nye ikoner.

Lillebo commented 4 years ago

@Lilyngs Den ikonpakken vi har nå (Streamline 2.5) kostet ca. 150 000 kroner da den ble kjøpt i 2016. Dette var for unlimited-lisensen som gir ubegrenset antall brukere. Prisen for denne lisensen står dessverre ikke oppført på nettsiden deres, men jeg har en kvittering liggende. Vil anta den nye 3.0-versjonen koster minst like mye, men vi får visst også en 35% rabatt hvis vi oppgraderer (fordi vi allerede eier den forrige). Samtidig er jo noe av problemet med Streamline-pakken at lisensen gjør det vanskelig for oss å dele ikon-pakken mellom oss (alt må være adgangskontrollert) - og det gjelder nok like mye for 3.0 som for 2.5.

Synes uansett du har et veldig godt poeng om hvor stor jobb det vil være å lage en helt egen ikonpakke fra scratch. Jeg er litt redd for at omfanget her lett kan undervurderes - spesielt med tanke på behovet for flere stiler (outline og fill), og ikke minst det at vi også trenger ikoner for mer NAV-spesifikke ting som de du nevner over.

Som jeg har nevnt før så er det kanskje spesielt de NAV-spesifikke ikonene som vil være de vanskeligste og mest tidkrevende å lage. Vi bør f.eks. være varsomme når vi velger ikoner for ting som er ganske sensitive og alvorlige (død, uførhet, økonomisk nødhjelp, aleneforsørger osv). Å ta hensyn til riktig tone på akkurat slike ting er kanskje litt vanskeligere enn man først skulle tro (vi har jo noen utfordringer med dette i illustrasjonene våre allerede).

Når vi da vet at det allerede finnes veldig gode ikonpakker der ute som er helt gratis og som dekker de aller fleste generelle behovene våre, så synes jeg det bør veie ganske tungt at vi kan adoptere disse og slippe å bruke tid på å lage generiske ikoner som allerede er blitt laget tusen ganger før. Da kan vi i stedet bruke de begrensede ressursene vi har på å heller utarbeide gode ikoner for de NAV-spesfikke tingene.

Her er f.eks. noen ikon-pakker som er 100% open source og helt gratis:

Lilyngs commented 4 years ago

Fint dere tester! Spent på å høre erfaringene. Med en tykkere strek slik Wei har designet nå, vil man kunne få bedre lesbarhet. For interne flater er behovene litt annerledes, så jeg håper at en beslutning også er basert på både interne og eksterne flater.

Jeg heller likevel mot kjøpt ikon-pakke i kombinasjon med tilpassede designede ikoner. Pga behov som stadig oppstår må man være tilgjengelig og kunne gi den hjelpen.

Fordelen med å beholde Streamline er at de tilbyr mange tusen ikoner, en annen fordel kan være at "overgangen" ikke blir særlig stor. Man bevarer look and feel som i dag og jobber heller med "lesbarhet" og riktig symbolbruk der det trengs. Det er mange av ikonene i pakken som er i for detaljerte, men de fleste er helt ok.

Lillebo commented 4 years ago

Hm, jau. Det kan godt hende lisens-problemene med Streamline-pakkene ikke er så plagsomme likevel. Det ble jo bygget en egen galleri-app for Streamline-pakken av noen sommerstudenter her på huset for en liten stund tilbake som dessverre måtte legges bak brannmuren vår pga. lisensen. Men nå skjønner jeg at Streamline har bygget en egen slik app på nettsidene sine for 3.0-versjonen? Da kan det jo godt hende at de begrensningene som Streamline-lisensen medfører er til å leve med likevel 🤔

Jeg kan jo be dem om å gi oss et pristilbud på en 3.0-oppgradering i alle fall.

Mine foretrukne utfall her er uansett følgende (i prioritert rekkefølge):

  1. Adoptere en gratis ikonpakke for basic-ikoner + lage selv for NAV-spesifikke behov
  2. Kjøpe en ikonpakke for basic-ikoner + lage selv for NAV-spesifikke behov
  3. Lage alt selv
Lilyngs commented 4 years ago

Gratis eller ikke, så lenge det er bra :) Streamline-ikonene inneholder nå 30 000 ikoner om jeg leser riktig, og de har en fin søkefunksjon på nettsiden deres. Så lenge designerne har tilgang på noe gjør man seg ikke helt avhengig DS. Hva om Wei tar en lang ferie eller en lang pappaperm. Da er det bedre å ha tilgang på noe, som man kan optimaliserer senere.

Lillebo commented 4 years ago

Helt enig 🙂Har sendt en forespørsel til Streamline om å gi oss et pristilbud på 3.0 👍

Lilyngs commented 4 years ago

Så fint!

Lillebo commented 4 years ago

Da har jeg fått svar fra Streamline, og merkelig nok er 3.0-versjonen mye billigere enn det vi ga for 2.5-versjonen 🤨 Lisens-modellen deres virker å ha endret seg litt, hvor prisen nå ser ut til å være avhengig av hvor mange ansatte som trenger å få tilgang til hele ikon-pakken. Det betyr at vi slipper å betale lisenser for utviklere som bare skal bruke et lite utvalg av ikonene - som de da får fra designerne våre når ting skal implementeres.

Hvis vi da betaler for 100 lisenser (som er mer enn nok for alle våre designere) så kommer prisen for 3.0-versjonen på 3400 dollar, som er ca. 32 000 kroner.

Neste trinn er 500 lisenser som har en prislapp på 9000 dollar, som er ca. 85 000 kroner, og da fortsatt mye billigere enn det vi betalte for 2.5-versjonen.

Da tenker jeg det absolutt er verd å vurdere en slik oppgradering 👍

Lilyngs commented 4 years ago

Det var jo en god nyhet! Med 3.0 versjonen vil man da ha tilgang på en tykkere strek samt et stort bibliotek av ikoner. Absolutt noe å vurdere :)

randisolli commented 4 years ago

Link til Figma prototype med ikonene som Wei har laget: https://www.figma.com/proto/UmEVH3pZ71uJPsSz9ilP3Y/NAV-ikoner-2.1-Figma-i-test?node-id=241%3A696&scaling=min-zoom

Vi skal ha en periode med tilbakemeldinger før vi bestemmer oss for neste steg.

KenAJoh commented 3 years ago

Nye ikoner her: https://design.nav.no/resources/icons