...
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
Juni
Nya regler gällande användningstester och ersättning. INGEN ERSÄTTNING utgår till användare vid användningstester med omedelbar verkan. Deltagare
Vi undersöker om det kommer finnas andra sätt att ge ersättning och återkommer då.
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.
...
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
...
...
Juni
Uppdateringar i IDS (kod):
...
Kodkomponenter
I september uppdaterades ids-paketen från version 1.7.1 till 1.10.0
Dessa uppdateringar inkluderar en ny Grid. Card, Dialog och Agent samt många förbättringar och refaktoreringar.
Mer info finns i changelog (1.8.0 ->1.10.0).CSS (se ny uppdatering i rätt miljö ovan)
Nu finns den nya CSS-koden i vår testmiljö (vi avvaktar behörighetsändring för push till rätt miljö men för att ni skall kunna se så länge lägger jag upp länkar här)
Nedan några exempel:
https://css-dev.netlify.app/?path=/story/components-page-footer-1177--footer 1177 footer
https://css-dev.netlify.app/?path=/story/components-page-footer-1177-profession--footer&globals=theme:1177-profession 1177 profession footer
https://css-dev.netlify.app/?path=/story/components-page-header-1177--default 1177 Header
https://css-dev.netlify.app/?path=/story/components-page-header-1177--with-menu-under 1177 Header med meny
https://css-dev.netlify.app/?path=/story/components-page-header-1177-profession-desktop--default 1177 Profession Header
https://css-dev.netlify.app/?path=/story/components-page-header-1177-profession-mobile--logged-out 1177 Profession mobile header
När vi lagt upp i rätt miljö kommer ny länk här.Nu finns uppdaterade instruktioner för att föreslå nya komponenter i Figma, se Föreslå egna komponenter i Figma . För att förenkla processen finns en ny separat leveransfil i Figma att använda och vi har tagit bort instruktionerna om branches. Leveransfilen “1177 & Inera - Leveransfil nya komponenter” ligger i Figma under UX ramverk / Designsystem.
Följande komponenter är klara (kod och Figma):
https://inera.atlassian.net/l/cp/kesNauMc - brödsmula för desktop och mobil (truncated)
https://inera.atlassian.net/l/cp/rcMbhoK7 - uppdaterad struktur och nytt sätt att bygga på med table header och table cell
H1 small - mindre storlek av H1, se specifikation på https://inera.atlassian.net/l/cp/4cpPDuCP
Error state för radioknapp/checkbox
Nya ikoner klara: “Id-card locked” och “Copy file” Icons
Card-komponenten har gått igenom acceptanstest. Cards
Nytt dokument om “toastmeddelanden” med riktlinjer kring tillgänglighet finns på Confluence under avsnittet “Vägledning och tips för tillgänglighet”: Toastmeddelanden
...
Vi har länkat in våra pågående ärenden till sidan: Pågående arbete
Uppdateringar i struktur, hittar du inte? Använd gärna sökfunktionen här: https://inera.atlassian.net/wiki/spaces/USI
Figma uppdateringar:
Typografi (1177/Inera) - Nya textstyles för H1 small både desktop och mobile
Juni
Kodkomponenter:
TabsFigma 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)
...
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
Nu finns Snabbguiden från SoB med som designhistorik: Designhistorik - Stöd och behandling
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
...
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
...