Beta AI-guiden är under utveckling — se Status för senaste ändringar och plan
Bakom kulisserna

Statusrapport för AI-guiden.

Här loggar vi vad som händer på AI-guiden — nya sidor, designändringar, funktioner och innehållsuppdateringar — och vad som står på tur framåt. Sidan är inte länkad från menyn utan finns som en intern översikt för dig som vill följa utvecklingen löpande.

53 händelser dokumenterade · 7 av 24 planerade klara · Senaste uppdaterad

Senaste ändringar

53 händelser · senaste 2026-05-04

  1. Ny sida

    Ny sektion — Metodik och arbetssätt

    Ny sektion på /metodik/ som samlar kommunens arbetssätt och metodik vid framtagande och utveckling av AI-tillämpningar. Sidorna Innovationssprint och Prototypdriven utveckling har flyttats hit från /lar-dig/ där de tidigare låg som perspektiv 06 och 07 — nya URL:er är /metodik/innovationssprint/ och /metodik/prototypdriven-utveckling/. Brödsmulor, eyebrows och alla interna länkar (perspective-korten på /lar-dig/, plan-poster på status, exempelreferenser i grafisk profil) är uppdaterade. Metodik ligger nu också i huvudnavigationen mellan Lär dig AI och Regler.

  2. Innehåll

    Kontaktadress bytt till ai@sundsvall.se

    Alla hänvisningar till digitalisering@sundsvall.se är ändrade till ai@sundsvall.se — i mailto-länkar och prosa-omnämnanden på Prototypdriven utveckling, Eneo-utbildningen, Regler · kommunikation, grafisk profil och README. Ny officiell kontaktadress till AI-teamet.

  3. Förbättring

    Eneo-utbildningen är ersatt med V2-versionen

    Den länkade Eneo-utbildningen under Lär dig AI har bytts ut mot V2-versionen som tagits fram parallellt — bättre pedagogik, tydligare upplägg och fler videolektioner. URL:en /lar-dig/eneo-utbildning/ är oförändrad så befintliga länkar fortsätter fungera, men innehållet är helt nytt. V1 är raderad.

  4. Rebrand

    AI-labbet heter nu AI-forum

    Sektionen som tidigare hette AI-labbet är omdöpt till AI-forum. URL:en flyttas från /ai-labbet/ till /ai-forum/, och menyalternativet, hubb-kortet på startsidan, samt alla prosa-omnämnanden är uppdaterade. Det interna konceptet (sandlåda, piloter, idébank) är oförändrat — bara namnet.

  5. Design

    Ny brand-mark i headern — två snedstreck (//)

    Den lilla svarta cirkeln med texten "ai" bredvid logotypen är utbytt mot en inline SVG av två snedstreck (//). Renare, mer typografisk och samspelar bättre med ordmärket AI-guiden. SVG:n ärver färg via currentColor så den följer eventuella tema-justeringar i framtiden.

  6. Innehåll

    Menyalternativet "Prompts" är nu "Promptguide"

    Tydligare vad som ligger på sidan — det är inte bara en lista över prompts, utan en hel guide till hur man skriver bra prompts. URL:en /prompts/ är oförändrad.

  7. Ny sida

    Grafisk profil — designsystemet samlat och dokumenterat

    Ny dold sida på /grafiskprofil/ som dokumenterar AI-guidens visuella och redaktionella system: färgtokens med swatches, typografisk skala, layout-spec, komponentbibliotek, sidmönster, röst & ton och kodrecept för nya sidor. Tänkt som referens för t.ex. Claude Code så att nya sidor utgår från samma grund. Inte länkad från menyer eller indexerad.

  8. Innehåll

    Tillgänglighet (WCAG 2.1 AA) dokumenterat på grafisk profil

    En ny sektion på /grafiskprofil/#tillganglighet samlar allt om tillgänglighet: DOS-lagen och WCAG 2.1 AA som juridiskt minimum, POUR-principerna (Möjlig att uppfatta, Hanterbar, Begriplig, Robust), tio konkreta krav (kontrast, fokusmarkering, tangentbord, semantisk HTML m.m.) och fem testkriterier att köra innan publicering. Samtliga nya sidor och komponenter ska nu mätas mot den listan.

  9. Ny sida

    Prototypdriven utveckling — fördjupningssida under Lär dig AI

    Ny sida på /lar-dig/prototypdriven-utveckling/ som beskriver hur AI förändrar hur vi utvecklar digitala lösningar i kommunen. Tre nivåer i en stege — Nivå 01 Tankar & visualisering (Lovable, Claude.ai, v0 — för projektledare och verksamhetsutvecklare utan kodkompetens), Nivå 02 Körbar lösning (Claude Code, WSL, Docker — för team med tekniskt intresse) och Nivå 03 Produktionsklar utveckling (Claude Code i VS Code, GitHub Copilot, full CI/CD — för systemutvecklare). Hero, anchor-strip, intro-sektioner, tre nivåkort, vägledning för vad-passar-när och länkar vidare till innovation.sundsvall.dev. Lyfts som det sjätte perspektivet på Lär dig AI-sidan.

  10. Innehåll

    AI-registret är borttaget

    Sidan /register/ och dess fyra exempel-system är raderade i sin helhet. Alla länkar — primärnavigation, explore-grid, sidfot, hemsida-include — är borttagna. Konceptet AI-register som process-artefakt i högrisk-AI-utbildningen finns kvar; det som försvann är just denna prototyp-sida.

  11. Förbättring

    Hero-ingressen laddar utan fördröjning på undersidor

    Tidigare hade .hero-lede en global 0,7-sekunders reveal-animation som läckte till alla undersidor — så ingressen syntes alltid efter resten av sidan. Animationen är nu scopad till startsidans bodyClass .home, så /lar-dig/, /verktyg/ m.fl. laddar ingressen samtidigt som resten av sidan. Startsidans sekvens-reveal är opåverkad.

  12. Teknik

    CSS-buggfix: ikon-rader radbröts på varje ord

    På flera sidor med punktlistor i tone-/regel-kort kunde texten radbryta efter varje ord — utlöst av en grid med 1fr-kolumn nästlat under en flex-förälder, där 1fr får implicit min-content som minimum. Lösningen är dokumenterad på /grafiskprofil/ som regel 4: använd block-layout med absolut-positionerad ::before, alternativt minmax(0, 1fr). Tone-kort, rules-listan och ikon-rad-komponenten är omskrivna; preventivt minmax-fix på prototypdriven-utveckling, hög risk-AI och ai-pa-10-minuter.

  1. Ny funktion

    Promptguiden — interaktiv modal som förädlar dina prompts

    På sidan Prompts finns nu en lila modal som öppnas via flera "Öppna Promptguiden"-knappar. Du klistrar in ett promptutkast och Promptguiden — en dedikerad Eneo-assistent — förädlar det enligt de 15 reglerna och förklarar vad som ändrades. Samma tekniska upplägg som Eneo-chatten på startsidan: en nginx-proxy injicerar API-nyckeln server-side så ingen nyckel når webbläsaren. Varje svar har en "Kopiera prompt"-knapp som lägger texten i urklipp.

  2. Innehåll

    "Vad är en prompt?" ersätter den svarta intro-rutan

    Den svarta "Varför det spelar roll"-rutan i toppen av Prompts byttes mot en pedagogisk inledning som först förklarar vad en prompt faktiskt är. Två kort visar definitionen — "En prompt är en instruktion" — och det mentala skiftet "Tänk beställning, inte sökning" med konkret jämförelse mellan en sökstring och en beställning.

  3. Innehåll

    Praktiska exempel på varje regel

    Alla 15 regler i promptguiden har nu ett kort exempel längst ner i regelkortet — färgkodat efter kategori. Visar regeln tillämpad i en kommunalt-relevant prompt: t.ex. "Sammanfatta mötet i fem punkter, max en mening per punkt" för regel 1 och "ALDRIG inkludera personnummer i svaret" för regel 13.

  4. Design

    Eneo-kortet på Verktyg är grönt med direkta öppna-knappar

    Det tidigare svarta Eneo-kortet i verktygskatalogen är nu Sundsvalls-grönt och har två tydliga "Öppna Eneo"-knappar — en mot eneo.sundsvall.se och en mot eneo.ange.se — samt en länk till utbildningen. Texten betonar att Eneo är förstahandsvalet för all AI-användning, inte bara känsliga uppgifter. Du behöver inte ansöka om tillgång; alla medarbetare loggar in direkt. Frågor mejlas till ai@sundsvall.se.

  5. Innehåll

    Verktygskatalogen — HeyGen, ElevenLabs och omklassningar

    Två nya publika verktyg tillagda: HeyGen (videoproduktion med digitala avatarer på 175+ språk — används redan i Vuxenutbildningen för utbildningsvideor) och ElevenLabs (röstgenerering, har använts för att förenhetliga rösten över en utbildningsserie där olika personer spelat in). DeepL och Otter.ai flyttade från Säkra till Publika eftersom konsumentversionerna saknar tillräckliga avtalsgarantier — för transkribering av arbetsmaterial är Eneos egen transkribering förstahandsvalet.

  6. Design

    Gul varning ersätter rött kryss för "kolla avtalet"

    I Säkra verktyg-kortet hade raden om personuppgifter tidigare samma röda kryss som de absoluta förbuden i Publika-kortet. Nu är det en gul/orange varning med ! som signalerar bedömning — kolla avtalet i varje fall. Texten är också tydligare: "Personuppgifter — kolla avtalet".

  7. Design

    Hero-sektioner på alla undersidor harmoniserade

    Tidigare hade undersidor olika hero-höjd och brödsmulor på olika ställen. Nu följer alla samma mönster: brödsmulor överst (matchar mönstret från /lar-dig/) och hero-blocket reserverar samma vertikala yta som /regler/, oavsett om sidan är innehållsrik eller sparsam. Innehållet sitter mot underkanten med flex-layout för konsekvent visuell rytm mellan sidor.

  8. Design

    AI Act-citatkortet på "Lär dig AI" är ljusgrönt

    Hero-citatet om AI-kunnighet från EU:s AI-förordnings artikel 4 hade tidigare blå accenter och en blå vänsterkant. Nu är hela kortet ljusgrönt med mörkgrön highlightad text — passar bättre in i AI-guidens grundtema.

  9. Ny funktion

    Ny "Utbildningar"-sektion direkt på startsidan

    Direkt under hero-sektionen på startsidan finns nu en sektion som lyfter fram de tre utbildnings-perspektiven från /lar-dig/. Tre färgkodade modulkort (röd/blå/guld) med innehållssammanfattning och status — "Tillgänglig nu" eller "Kommer snart" — så besökare kan gå direkt från startsidan till utbildningarna utan att klicka sig vidare.

  10. Design

    Renare startsida — "Lärspår"-sektionen borttagen

    Den gamla "Lärspår — din resa, ditt tempo"-sektionen togs bort eftersom den i praktiken dubblerade den nya Utbildningar-sektionen. Startsidan flyter nu direkt från hero/Eneo-chat → Utbildningar → resten av portalen utan upprepning.

  1. Innehåll

    Tio-minuters-kursen finputsad

    Snabbkursen på /lar-dig/ai-pa-10-minuter/ fick en dags iterativ förfining: tätare typografi, balanserade blanksteg, justeringar i flera kärnkapitel och övergångarna mellan dem. Kursen ligger nu skarpt i en bärbar dators viewport från start till slut.

  1. Ny funktion

    Eneo-chatten nåbar från alla undersidor

    En "Fråga Eneo"-knapp ligger nu i den globala headern. Klicka och en mörk modal öppnas med samma streamade chat som finns på startsidan — du behöver inte gå tillbaka till startsidan för att ställa en fråga. Modalen stänger sig med ESC, klick utanför, eller ✕-knappen i hörnet.

  2. Design

    Header och typografi balanserade

    Den övre menyraden fick uppdaterade tokens, mer luft kring logotypen och justerad höjd så den känns mer balanserad mot hero. Flera undersidor (cases, register, regler, ai-labbet) fick samtidigt en finputs på sina egna intro-block.

  1. Förbättring

    Tydligare progressbar i botten av utbildningen

    Den dockade kapitelnavigationen har gjorts cirka 50 % högre och fått större typsnitt och pil i Nästa-knappen. Den drar mer uppmärksamhet och blir lättare att klicka — pratbubblan som tidigare pekade på Nästa togs bort eftersom dockan nu står på egna ben.

  2. Förbättring

    Välkomststeget i utbildningen omarbetat

    Tre separata block (kapitel-meta, så funkar det-rutan, knappen) slogs ihop till ett samlat info-kort med snabbfakta (~10 min, 10 kapitel, 0 förkunskaper) följt av en kort beskrivning och visuell flödesdemo. Mindre intryck, lugnare yta att möta utbildningen i.

  3. Förbättring

    Välkommen är inte längre ett numrerat kapitel

    Tidigare räknades Välkommen som "Steg 01 av 11" — vilket inte är ett kapitel utan en startsida. Nu är dockan uppmärkt med Start följt av kapitel 01–10. Stegmarkeringarna i alla kapitel uppdaterade till "Kapitel XX av 10".

  4. Ny funktion

    Pratbubbla pekar mot Nästa-knappen

    På välkomststeget visas nu en pulserande pratbubbla där det står "Här klickar du för nästa del" med en pil ner mot Nästa-knappen i dockan. Bubblan försvinner automatiskt när användaren klickat sig vidare till första kapitlet.

  5. Design

    Emojis i utbildningen ersatta med SVG-ikoner

    Alla emoji-ikoner i de fem omarbetade kapitlen byttes ut mot Lucide-stil-SVG-ikoner i samma uttryck som resten av sajten. Färgerna ärvs via currentColor så ikonerna matchar respektive kapitels accentfärg. Exempel: 💡 → glödlampa, 📈 → trending-up, ⚖️ → våg, ⛔ → ban, 🚛 → alert-octagon.

  6. Förbättring

    Tätare layout i utbildningens kapitel

    Padding, marginaler, h2-storlek och rubrikavstånd komprimerades genomgående i de innehållsrika kapitlen (steg 2, 3, 4, 6, 7). Minst en halv skärmhöjd vunnen — alla kapitel ryms nu inom en typisk bärbar dators viewport utan extra scroll.

  7. Innehåll

    Snabbkursens kärnkapitel pedagogiskt omarbetade

    Fem av elva kapitel i "AI på 10 minuter" — Vad är AI?, Vad kan AI göra?, Begränsningar, Säkerhet och Vad säger lagen? — fick helt nytt innehåll och visuellt upplägg. Varje kapitel har nu ett "Kort sagt"-block, kategoriserade listor, en 💡-tumregel och länkar till externa källor som DIGG, IMY, AI Sweden och EU-kommissionen.

  8. Design

    Nya delade komponenter i utbildningen

    För att binda ihop de fem omarbetade kapitlen byggdes en uppsättning återanvändbara komponenter: "Kort sagt"-block, 💡-tumregel-callout, källor-strip, AI-typer-grid, begränsnings-grid, säkerhetsgrupper, Förtroendemodellen-kort och en horisontell tidslinje. Alla styrs av --a10-accent-variabler så samma komponent matchar respektive kapitels grundton.

  9. Ny funktion

    Status-sidan — den här

    Ny dold sida på /status/ där vi löpande dokumenterar vad som händer på AI-guiden. Inte länkad från menyn — bara för dig som vill följa utvecklingen i detalj.

  10. Design

    Hög risk-AI bytt grundton till grönt

    Sidan om bedömning av hög risk-AI hade tidigare blå som grundton. Eftersom innehållet handlar om att skapa trygghet genom process, byttes grundtonen till grönt. Per-nivå-färgerna i processen (grön → guld → blå → lila → grön) behölls för att bära den visuella resan från start till beslut.

  11. Innehåll

    Avslutande beslutssteg i högrisk-processen

    Ett extra grönt accordion-steg lades till i slutet av processen: "Beslut: sätt igång". Markerat med ✓ istället för en siffra för att visuellt särskilja från startsteget. Avslutar pedagogiskt cykeln med kontrollfrågor inför skarp drift.

  12. Förbättring

    Sammanhängande linje genom process-nivåerna

    Den vertikala linjen mellan processnivåerna i högrisk-AI-sidan löper nu hela vägen från under cirkeln genom nivåns innehåll och vidare till nästa nivås cirkel. Tidigare syntes bara en kort sträcka i mellanrummet mellan nivåerna.

  13. Ny sida

    Riktlinjer för bedömning av hög risk-AI

    Ny operativ guide under Regler. Beskriver de fyra processnivåerna och fjorton delstegen för att bedöma AI-tillämpningar enligt EU:s AI-förordning. Varje delsteg är ett utfällbart kort med konkreta kontrollfrågor.

  14. Ny sida

    Snabbkursen "AI på 10 minuter"

    Ny utbildning under Lär dig AI. Elva korta kapitel som tillsammans tar runt tio minuter och lär ut grunderna i AI för medarbetare — vad det är, vad det inte kan, vad lagen säger, hur du ställer bra frågor och hur du börjar.

  15. Ny funktion

    Steg-för-steg-navigation i utbildningen

    Snabbkursen visar bara ett kapitel åt gången. En grön processbar i botten visar 12 sektioner (11 kapitel + Nästa-knappen som sista sektion) där användaren kan klicka tillbaka till tidigare kapitel. Aktuellt kapitel markeras med vit topplinje och guldig accent.

  16. Design

    Avskalad utbildningsmiljö

    När man startar utbildningen ersätts huvudmenyn med en smal toppbar med en "Tillbaka till AI-guiden"-länk. Sidfoten döljs också. Allt för att utbildningen ska kännas som en egen, fokuserad modul utan distraktioner.

  17. Design

    Pokal-illustration vid utbildningens slut

    Utbildningens sista kapitel "Du har klarat utbildningen" har bytt från svart till grön bakgrund och fått en handritad SVG-pokal med rise-animation. Grönt signalerar success bättre än svart.

  1. Ny funktion

    Riktig Eneo-AI på startsidan

    Demo-rutan på startsidan ersattes med en faktiskt fungerande chat mot kommunens egen Eneo-plattform. Frågor strömmas via en nginx-proxy som injicerar API-nyckeln server-side — så nyckeln aldrig lämnar servern. Användare kan ställa frågor om AI i kommunen och få svar med källhänvisningar till portalens egna sidor.

  2. Rebrand

    AI-portalen heter nu AI-guiden

    Sajten döptes om från AI-portalen till AI-guiden. Bytet gjordes på alla sidor — header, brödsmulor, sidtitlar, footer — och driver nu från en central site.title-variabel så framtida byten är ett ställe.

  3. Innehåll

    "För din verksamhet" pedagogiskt omgjord

    Översiktssidan ändrades från en enkel kortlista till en hubb som lyfter fram de fyra perspektiven (välfärd, samhällsbyggnad, effektivare verksamhet, invånare & företag) som komplementära ingångar. Inkluderar en visuell SVG som binder ihop de fyra och en "Var börjar jag?"-sektion med tre olika lässtarter.

  4. Ny sida

    AI i välfärden

    Undersida om hur AI används inom vård, omsorg och skola. Kärnbudskap: mindre administration, mer närvaro. Inkluderar konkreta initiativ som fallsensorer på Norra Kajen (78 % färre fall) och tal-till-text i socialtjänsten.

  5. Ny sida

    Förenkla för invånare och företagare

    Undersida om hur AI gör kommunens tjänster enklare för utomstående. Innehåller en mörk "resa"-sektion som visar de fyra digitaliseringsstegen (analogt → digitala formulär → automatiserad handläggning → proaktiv kommun) och initiativ med före-/efter-jämförelser.

  6. Ny sida

    Effektivare verksamhet

    Undersida om interna processer — administration, möten, fakturor, dokument — där AI tar det repetitiva. Lyfter fram initiativ som mötesprotokoll-AI (60–80 % tid sparad) och 70 % autokontering av fakturor.

  7. Ny sida

    AI i samhällsbyggnad

    Undersida om miljö, energi, vatten, el, byggnader och stadsplanering. Den första av de större "För din verksamhet"-sidorna, satte mönstret för de övriga tre.

  8. Förbättring

    "För din verksamhet" tillagd i huvudmenyn

    Sektionen var tidigare bara nåbar genom direkta länkar — nu syns den i den övre navigationen mellan Användningsfall och AI-labbet.

  9. Innehåll

    "Cases" döpt om till "Användningsfall"

    Menyalternativet bytte namn för bättre svenskt språk. URL:en (/cases/) är oförändrad så befintliga länkar fortsätter att fungera.

  10. Design

    Renare startsida

    Tre saker togs bort från startsidan eftersom de tog plats utan att tillföra värde: utgåve/version-raden ovanför hero, den rullande marqueen mellan hero och lärspår, och statistikraden om antal verktyg och utbildade medarbetare. Hero-rubriken fick också samma storlek som på undersidorna.

  1. Teknik

    Sajten initierad

    AI-guiden bygger på Eleventy 3 (statisk site-generator) med Sundsvalls grafiska profil. Innehåll skrivs som markdown och Nunjucks-templates, byggs till statisk HTML, serveras via nginx i en Docker-container deployad genom Dokploy med Traefik framför för TLS.

Sidan kuraterad manuellt — varje post är en pedagogisk översättning av faktiska kodändringar. För råa Git-commits, se projektets repo.