Jämförda versioner

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

Maj

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.

Release av 4.7.0.

  • 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

...

  • 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

  • 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

...

  • 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

...

  • 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

...