Jämförda versioner

Gammal version 217

changes.mady.by.user Patrik Hobring

Sparat den

jämfört med

Ny version Aktuell

changes.mady.by.user Rebecka Näsström

Sparat den

Nyckel

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

...

Ineras UX-ramverk (instruktioner, designsystem och komponenter) utvecklas löpande. Denna sida visar nya komponenter och större förändringar i UX-ramverket samt direktlänkar till sidorna..

2024

...

Juli

Panel
panelIconId1f3dd
panelIcon:island:
panelIconText🏝️
bgColor#FFFAE6

I juli har IDS-teamet semester. Mellan måndag 1 juli och måndag 5 augusti har vi stängt för hantering av supportärenden. Vi återupptar supporten från och med 5/8. Du kan fortfarande:

Trevlig sommar önskar IDS-teamet! ☀️

Juni

Nya regler gällande användningstester och ersättning. INGEN ERSÄTTNING utgår till användare vid användningstester med omedelbar verkan. Vi undersöker om det kommer finnas andra sätt att ge ersättning och återkommer då. Du kan läsa mer om ersättning vid användningstester på sidan Deltagare.

IDS (kod)

Ingenting nytt - du kan se det vi arbetar på just nu under Pågående arbete.

Figma

Text styles
Nu styrs även text styles med modes. Text styles som tidigare var uppdelade i mobile och desktop har ersatts med nya text styles med variabler. Det blir enklare att välja rätt text style och antalet text styles i listan halveras.
Exempel: Istället för att välja "Mobile/Heading large" eller "Desktop/Heading large" väljer du bara "Heading large". Följande komponenter har uppdaterats med modes som ersätter varianter för device:

  • Modal

    • Ny variant "Custom" har lagts till med en placeholder slot som kan användas för annat innehåll med lokal komponent.

  • Stepper

    • Vid långa rubriker fyller texten ut på ny rad (fill).

  • Progress bar

    • Nya varianter "Empty" och "full".

  • Global alert

  • Agent (1177)

  • Preamble

  • Body text

Confluence

Kommande:

  • Sommarstädning

  • Uppdatering av information

  • Nya designriktlinjer för

    • Tabell i mobil

    • Sök i select/multiselect

    • Card i mobil

Maj

IDS (kod)

Release av 4.10.0.

  • Alert ribbons

  • Button group kontroller för breakpoint

  • Angular länk, 1177 avatar och card bugfix.

Release av 4.9.0.

  • 1177-pro har bytt till blått (första steget mot 1177-admin)

  • Intervaller för range

  • Nya card

Figma

  • Versalrubriker i Expandable har tagits bort, komponenten använder nu modes för device.

  • Versalrubriker i komponenten Heading har tagits bort, komponenten använder nu modes för device.

April

IDS (kod)

Release av 4.8.0.

  • Card utan ram på mobil.

  • Textarea som växer med content.

  • Header skip-link.

  • Ikoner i länkar placeras med första rad.

...

  • Nya och uppdaterade ikoner.

  • All formulär CSS är nu migrerad till design.

  • Bugfixar och prestandaförbättring (borttagning av gamla ikonbiblioteket, mindre CSS-redundans i formulären).

  • Total omskrivning av formulär-element hantering. IDS formulärelement kan nu integreras mycket enklare med manuell validering.

  • Agent och Alerts har nu öppna headline slots för egna h-taggar.

Figma

  • Ikon “double arrow” (dubbelriktade pilar) byter namn till “swap” för att matcha IDS

  • Komponenter med versaltext - beslut tagna, ej genomförda ännu

    • Versalrubriker utgår, påverkar alla komponenter som använder dessa, t ex expandables och cards med versalrubriker

    • Badges blir versalgemena (inledande stor bokstav, följt av små)

    • Knappar fortsatt versala

  • Alert ombyggda för att utgå från nya 8-baserade avstånden och använder nu också layer modes (desktop/mobil)

  • Alert ribbon - ny variant: en mer slim och stängbar variant av alert utan rubrik, med mindre ikon

  • Description list - ny komponent: visar listor med innehåll där varje informationspost har en beskrivande term/rubrik

Confluence

...

  • Vi numera endast hanterar buggfixar och akuta problem

  • Sista planerade release är 2 september 2024

Mars

IDS (kod)

Release av 4.6.0 som innehåller förbättringsarbetet för ids-angular.

Figma

...

  • Uppdaterad information för Cards

  • Uppdaterad information för List

...

Juni

Uppdateringar i IDS (kod):

...

  • Följande komponenter har bytts ut för att bli enklare att arbeta med

    • Link - nu finns inte längre pil som alternativ ikon

    • Local navigation

    • Content navigation

    • Global alert

    • Agent (1177)

    • Heading - ny komponent med varianter som ersätter alla befintliga komponenter för rubriker

    • Bullet and numbered list - ny komponent som ersätter Bullet list och Numbered list vilket gör att det nu går att växla mellan dom utan att behöva skriva in texten igen

  • Följande komponenter uppdateras

    • Preamble mobile och Preamble desktop slås ihop till en komponent

    • Body text mobile och Body text desktop slås ihop till en komponent

  • Komponenterna med text har nu text properties

  • Link, Local navigation och Content navigation har nu Hover och Active states

  • Följande komponenter tas bort och finns nu istället som exempel

    • Link list

    • Navigation card

    • Article footer

    • Pagination button - använd istället sekundär knapp (Button) för pagination

...

Maj

Uppdateringar i IDS (kod):

...

...

  • Kodkomponenter:
    Tabs
    Breadcrumbs
    Checkbox (error state)
    h1 Small
    Mer info finns i changelog (1.6.0->1.7.1)

  • Följande komponenter har acceptanstestats samt tillgänglighetsgranskats: Breadcrumbs, Truncated Breadcrumbs, Table, samt H1 small och Error state för radioknapp/checkbox.

  • Tillgänglighetskrav har tagit fram för Content navigation, Tool tip och Scroll back to top komponenterna.

Juli

Juni

  • Kodkomponenter:
    Tabs

  • Figma uppdateringar:

    • Expandables (1177, Inera) - ny komponent. Tidigare komponent "Expanderbara ytor" utgår och finns nu istället som exempel som byggs ihop av Expandables och Cards.

    • Article footer (1177, Inera) - modifierad komponent med desktop och mobil som varianter i samma komponent

    • Alerts (1177, Inera) - justering av marginal i mobil

    • Mobilmeny (1177, Inera) - justeringar med markering för active state nivå 1

    • Badge (1177, Inera) - ny komponent som ersätter labels. Finns nu fler färger att välja på.

    • Bullet list (1177, Inera) - uppdatering med fler (dolda) punkter. 

    • Numbered list (1177, Inera) - uppdatering med fler (dolda) punkter. 

    • Popover (1177, Inera) - ny komponent som ersätter Pop up-tip

    • Tooltip (1177, Inera) - liten justering av marginaler

    • Table cell, Table header, Table example (1177, Inera) - komponenter som ersätter tidigare tabell

    • Search (1177, Inera)- ny komponent som ersätter tidigare Sökfält i Forms

    • Nya effect styles (1177, Inera): Inner shadow default, Drop shadow default

    • Header (1177-profession) - uppdaterad med plats för extra rubrik ovan eller under tjänstens namn.

    • Progress bar (1177, Inera) - ny komponent som ersätter tidigare Progress bar.

    • Carousel (Inera) - ny komponent som ersätter Slideshow.


      Dessa komponenter har tagits bort från biblioteket i Figma och finns nu istället som exempel i ”Exempel på sidor"

    • Panel 

    • A-Ö lista

    • Puffar

    • Filtreringslist

    • Faktaruta (Inera)

Maj

  • Kodkomponenter:
    @inera/ids-core 1.2.1 → 1.3.0 (Webcomponents)
    @inera/ids-angular 1.1.0 → 1.3.0 (Angular)
    @inera/ids-react 1.1.0 → 1.3.0 (React)
    Dokumentation uppdaterad (Webcomponents, Angular, React)
    Release inkluderar:

    • Nytt 1177-proffessions-tema.

    • Nytt inera-admin-tema.

    • Release av Header, med subkomponenter:
      Header-avatar
      Header-item
      Header-navigation
      Header-navigation-mobile-item
      Header-mobile-menu

    • Footer, Link, Notification-badge

    • Mobile-meny, med subkomponenter:
      Mobile-menu-item
      Mobile-menu-avatar

    • Utökning av ikonutbut, Bug fixar m.m.

  • Ny rekommendation gällande möten: Möten med stakeholders

  • Nu finns även den nya logotypen för 1177 utan friyta här: Logotyper och favikoner - 1177

  • Ny logotyp för 1177
    1177 Vårdguiden har bytt namn till 1177 och i samband med detta har Figma och Confluence uppdaterats. Vi bör så skyndsamt det går byta ut loggor i produktion. Det kommer inte gå att samordna så alla tjänster gör detta så snart det går. Hitta filer här: Logotyper och favikoner - 1177

  • Figma uppdateringar:

    • Agent (1177) - ny färg (grå) för att skilja ut agent banner mot globala meddelanden

    • Grid (1177, Inera) - Ny grid för admin/verktyg “Desktop wide”

    • Header 1177 profession - uppdaterad header för 1177 profession med minskad höjd och därmed justerad storlek på textlänkar och ikoner

    • Tabs (1177, Inera) - ny komponent som ersätter Flikar

    • Tables (1177,Inera) - ny komponent som ersätter gamla tabeller, nya är skapade för skalbarhet samt blivit modulär så man kan skapa tabeller efter de behoven man har i sitt projekt

...

Juli

I Juli är större delen av oss som arbetar med UX-ramverket på semester så förvänta er inga större uppdateringar

  • Våra designsystem har flyttat in i Figma och arbetet kan påbörjas med migrering till den plattformen. Rekommendation för hur arbetet skall bedrivas framöver kommer.

Juni

  • Designhistorik

  • Sketchbibliotek - 1177:

    • Uppdaterad design på modaler med vänsterjusterad rubrik och text, samt centrerade knappar.

    • Design på tillbakalänk i mobil.

  • Sketchbibliotek - Inera:

    • Uppdaterad design på expandables (accordions) för Inera.

    • Ändrad färg på ramlinje i textfält och sökfält till #7C7C7C

    • Ändrad färg på “avdelare” (linje) till color-muted #A1958A

    • Uppdaterad design på modaler med vänsterjusterad rubrik och text, samt centrerade knappar.

    • Design på tillbakalänk i mobil.

  • Ny release 0.16.0

    • BREAKING: Expandables are now using the <details> element.

    • Padding changed back to 20px for consistency with values in default.scss.

    • Added csupport for logged in mobile menu.

    • Layout fix for Inera checkboxes.

    • Layout fixes for radio buttons (Inera theme). Changed labels for button examples to use Primary/Secondary wording.

  • Designförslag för hur Ineras varumärken kan samordnas framöver Designförslag

Maj

  • Justerat färg på H Underrubrik Versal Stor till muted-dark #5F5F5F för att uppfylla tillgänglighetskrav på godkända kontrastvärden (Sketch samt uppdaterat spec i Confluence)

  • Sketchbibliotek - Inera:

    • Uppdaterad design på checkboxar och radioknappar.

    • Disabled state för checkboxar och radioknappar tillagt.

    • Uppdaterad design (färger) på knappar. Success-button tillagt.

  • Sketchbibliotek - 1177:

    • Disabled state för checkboxar och radioknappar tillagt.

  • FAQ med vanliga frågor påbörjad, FAQ - vanliga frågor

...

Juli

  • Adderat sida med länkar till prototyper, testmiljöer med mera som kan vara till nytta för att se hur andra löst problem, /wiki/spaces/USI/pages/375291975

  • Små korrigeringar

Juni

  • UX-ramverk godkänt och testat

  • Certifiering version 1.0 klar och är därmed obligatorisk för alla UX-nära resurser Certifiering UX-strategi

Maj

...