POLYMORPH MINDSET

Agentisk AI i team

5–6 mai 2026  •  Rebel, Oslo  •  Marina Santos Haugen  •  Kodemaker

DIN KURSLEDER

MARINA SANTOS HAUGEN

Kodemaker, Fullstack-utvikler

Marina Santos Haugen

Forretningsutvikler → Experiment Manager → Utvikler

7 år i DNB: innovasjon, A/B-testing, Open Banking, nettbank

Indøk & NTNUs Entreprenørskole (AI som fagretning)

3 agentiske prosjekter siste året — solo og i team

PRODUCT
DESIGN
CODE
AI
9 YEARS XP

PRAKTISK INFORMASJON

WIFI

Nettverk: [FYLLES INN]
Passord: [FYLLES INN]

PAUSER

Ca. hvert 75 min
Lunsj 12:30–13:15

KURSMATERIELL

Deles digitalt etter kurset

GITHUB REPO

Fork repoet
Hvert team får sin egen kopi

QR code

github.com/marinahaugen/
paramedic-learnings

[PLACEHOLDER SLIDE]

DELE OPP I TEAM?

AGENDA: TO DAGER

Hver sesjon: teori + demo + hands-on øvelse

DAG 1 — UTSTYR AGENTEN
1

CLAUDE.md — Kontekst & minne

2

Skills & Plugins — Ferdige verktøy

3

MCP — Koble til verden

4

Custom Skills — Teamets ekspertise

DAG 2 — SIKRE & BRUKE
5

Hooks & Sikkerhet — Guardrails

6

Workflow & Verifikasjon — Spec til kvalitet

7

Alt sammen — Teamøvelse

DAG 1 — DETALJERT AGENDA

09:00–09:30  Åpning – Velkommen, praktisk, polymorf mindset

09:30–11:00  Styre kontekst – CLAUDE.MD, minne, Plan Mode

11:15–12:30  Skills & Plugins – Plugin-økosystem, pre-built skills

12:30–13:15  Lunsj

13:15–14:30  MCP – Koble agenten til Figma, GitHub, docs

14:45–16:00  Custom Skills – Bygg teamets egne (med MCP)

QUEST LOG v1.0

FRA REGLER TIL RESONNEMENT

RPA

Tog på skinner

  • Forhåndsdefinert rute
  • Stopper ved signalfeil
  • Deterministisk
AGENTISK AI

Selvkjørende bil

  • Tolker situasjonen
  • Finner nye veier
  • Planlegger, utforsker, reagerer

AI LAR OSS SKIFTE FORM
ETTER HVA SITUASJONEN
KREVER

POLYMORF MINDSET

VELG DIN ROLLE...

Designer

Designer

Developer

Developer

Product Manager

Product Manager

“IT’S NOT ABOUT THE AGENT:
IT’S ABOUT THE WORKFLOW”

— McKinsey, “One Year of Agentic AI” (2025)

85%+

bruker AI som individuelt verktøy — uten organisasjonsverdi

BCG,
“AI Adoption Puzzle” (2025)

76%

av ledere ser agentisk AI som medarbeider, ikke verktøy

BCG / MIT Sloan,
“The Emerging Agentic Enterprise” (2025)

40%

av agentic-prosjekter feiler — pga. prosesser, ikke teknologi

Gartner via Deloitte Tech Trends
(2026)

Kursets mål: en felles, teambasert agentisk arbeidsflyt

HVORFOR POLYMORF?

Tre funn fra forskningen som formet kurset

FUNN 1

AI bryter ned siloer i team

776 profesjonelle hos P&G: AI-utstyrte tverrfaglige team produserte 3x flere gjennombrudd. R&D og kommersiell tenkte likt — AI fjernet funksjonsbarrierer.

Dell’Acqua et al., “The Cybernetic Teammate”, Harvard Business School (2025)

FUNN 2

Individuell AI ≠ teamverdi

93% av AI-budsjettet går til teknologi, 7% til trening. Uten bevisst arbeidsflytdesign kan individuell AI-bruk erodere teamkoordinering over tid.

Microsoft Research, “New Future of Work” (2025); arXiv longitudinell studie (2025)

FUNN 3

Transformasjon krever redesign

Organisasjoner som redesigner arbeidsflyter — ikke bare deployer verktøy — oppnår reell transformasjon. “The next frontier is collective productivity.”

McKinsey, “The Agentic Organization” (2025); Microsoft Research (2025)

KURSETS PREMISS

FRA INDIVIDUELT VERKTØY
TIL KOLLEKTIVT ARBEIDSSYSTEM

Individuell AI-bruk

Felles teamarbeidsflyt

Utføre oppgaver

Forme systemer

AI som støtteverktøy

AI som medarbeider

De neste to dagene: CLAUDE.md → Skills/plugins → MCP → Hooks → Team

McKinsey (2025) · BCG/MIT Sloan (2025) · Harvard/P&G (2025) · Microsoft Research (2025)

KURSETS CASE

PARAMEDIC LEARNINGS

Læringsdelingsplattform for ambulansepersonell

Next.js TypeScript React Tailwind CSS PostgreSQL Drizzle ORM
ØVELSE 1
15 MIN

OPPSETT OG VERIFISERING

1
Fork + klon repoet lokalt
2
Følg README
3
Sjekk at appen kjører: localhost:3000
4
Start Claude Code i prosjektmappen: claude
5
Kjør /init — commit start-CLAUDE.md, diskuter bra/forbedringer
GITHUB REPO

Fork repoet — et per team

QR code

github.com/marinahaugen/
paramedic-learnings

ア9カ3マン7タ0リ5サ2ネ8ヨ 1コ0セ4ム7ハ2ヲ9ツ3 ケ5ナ8ウ1エ6ワ3ラ0ト 7ニ2ヌ9ソ4テ1オ6 フ3イ8チ0ミ5シ2 ホ6モ1ユ4キ9レ0ヒ3ス7 0ヘ4メ2ノ8ル1タ5ク マ7カ3サ0ア9ト2ネ6 5ハ1ウ8コ4セ7ム0 ワ2ラ6ツ1ヲ5ケ9ナ3 エ8ニ0ヌ4ソ7テ1オ5フ イ6チ3ミ9シ2ホ0モ4 ユ1キ5レ8ヒ3ス7ク0 ヘ4メ9ノ2ル6タ1マ5 カ0サ7ア3ト8ネ2 ハ5ウ1コ6セ0ム4ワ9
S1

CLAUDE.MD —
KONTEKST & MINNE

S1: CLAUDE.MD

HVA ER CLAUDE.MD?

PROBLEMET

Uten kontekst → feil ORM, feil mappestruktur, generisk kode.

CLAUDE.MD ER LØSNINGEN
  • Markdown-filer som gir Claude persistente instruksjoner
  • Del av Claudes Memory-system — bærer kunnskap mellom sesjoner
  • Prosjektets onboarding-dokument for AI-agenten

“Tenk på det som en README — men for AI-en, ikke mennesker”

S1: CLAUDE.MD

HVOR LEVER CLAUDE.MD?

MANAGED POLICY

Settes av org-admin via API/Enterprise, deny trumfer alltid — Alltid conventional commits Aldri secrets i kode

PROSJEKT

./CLAUDE.md i repo-rot — committes, deles av teamet. Prosjekt-nivå har høyest prioritet.
CLAUDE.local.md — personlige overrides, gitignored.

BRUKER

~/.claude/CLAUDE.md — Personlige preferanser på tvers av alle prosjekter (lavere prioritet enn prosjekt)

Claude vandrer oppover i mappestrukturen og laster CLAUDE.md-filer som prosjektinstruksjoner. I større prosjekter: .claude/rules/ for tematiske filer, lastes on demand basert på paths.

S1: CLAUDE.MD

HVA BØR DEN INNEHOLDE?

INKLUDER
  • Bash-kommandoer Claude ikke kan gjette
    npm run codegen npm run snapshots
  • Kodestil som avviker fra standard
  • Testinstruksjoner og verifikasjonssteg
  • Arkitekturbeslutninger & gotchas
  • Eksplisitte «NOT»-mønstre
    NOT Spring NOT Chakra v3
UNNGÅ
  • Ting Claude kan se fra koden
  • Ting som endres ofte
  • Detaljert API-doc (lenk heller)
  • Selvfølgeligheter
    «skriv clean code»
MÅL

< 200 linjer · For store prosjekter → .claude/rules/

S1: CLAUDE.MD

VEDLIKEHOLD

/init

Genererer start-CLAUDE.md fra kodebasen. For interaktiv versjon: CLAUDE_CODE_NEW_INIT=1

/revise-claude-md
PLUGIN: CLAUDE-MD-MANAGEMENT

Analyserer CLAUDE.md og foreslår forbedringer. Fanger nye mønstre fra sesjonen.

@-imports

Referer til andre filer uten duplisering. Maks 5 nivåer nestede imports.
@docs/api.md

PRUNE

«Ville fjerning av denne regelen føre til at Claude gjør feil?» Hvis nei — kutt.

S1: CLAUDE.MD

NØKKELPRINSIPPER

Every line of AI-generated code is mine.

Du eier koden. AI-en er et verktøy, ikke en utvikler du delegerer til og glemmer.

Skriv for AI-agenten som for en ny kollega.

Klart, konkret, og fokusert på det som ikke er åpenbart fra koden.

Commit til versjonskontroll.

CLAUDE.md tilhører teamet. Review den i PR-er, behandle den som kode.

S1: CLAUDE.MD

KONTEKST-HÅNDTERING

/CLEAR

Tøm kontekstvinduet mellom urelaterte oppgaver

/COMPACT

Oppsummer lang kontekst. Kan gi fokus:
/compact Fokuser på API-endringene

/RENAME

Gi sesjonen navn. claude --continue / --resume

PLAN MODE

Utforsk og planlegg uten å redigere kode direkte.
Shift+Tab

STATUSLINJEN

Tokens, kostnad, modell. Sett opp med /statusline — beskriv hva du vil se, scriptet genereres automatisk.

/REWIND

Hopp tilbake til en tidligere melding og prøv på nytt derfra.
Esc Esc

GYLLEN REGEL

Etter 2 feilede korreksjoner → /rewind eller /clear og start med bedre prompt

S1: CLAUDE.MD

MEMORY — CLAUDE HUSKER

SLIK FUNGERER DET
  • MEMORY.md = konsist indeks, lastes i hver sesjon
  • Peker til topic-filer (debugging.md, api-conventions.md…)
  • Topic-filer leses on-demand når de er relevante
  • Lever i ~/.claude/projects/<prosjekt>/memory/
REVIEW & KONTROLL
  • /memory — browse, rediger, toggle av/på
  • Alt er plain markdown — åpne og rediger fritt
  • Si «husk at vi bruker Drizzle» — Claude lagrer det
  • Si «glem det om Chakra» — Claude fjerner det
TIPS

MEMORY.md + CLAUDE.md = komplett kontekst. Memory er personlig, CLAUDE.md deles med teamet.

S1: CLAUDE.MD

TILLATELSER & PERSONVERN

TILLATELSER
  • Permission-promptene dere har sett — Claude spør før den handler
  • /permissions — se og juster tillatelser
  • Rekkefølge: Deny → Ask → Allow. Deny vinner alltid
  • Aldri gi Bash(*) — scope til Bash(npm run *), Bash(git *)
PERSONVERN & DATA
  • Commercial tier (API / Enterprise / Claude Gov): Anthropic trener ikke på koden — kontraktsfestet
  • Verktøy-kall (Read, Edit, Bash) kjører lokalt — kode-kontekst sendes til API for inferens
  • Slå av all ikke-essensiell trafikk (telemetri, oppdateringssjekk):
    export CLAUDE_CODE_DISABLE_NONESSENTIAL_TRAFFIC=1
  • Se innstillinger: /config (alias /settings)
VIKTIG Å VITE

Ingenting brukes til modelltrening under commercial terms. Verktøy kjører lokalt — koden sendes kun til API for inferens.

ØVELSE 2
20 MIN

SETT OPP VERKTØYET

1
Utforsk innstillinger: /config
Aktiver «Output style»«Explanatory»
2
Legg til samme tillatelser som i eksempelet → sjekk med /permissions
3
Be Claude huske kallenavnet ditt → sjekk med /memory
4
Konfigurer /statusline med working dir og kontekst-warning
5
Prøv /compact og /clear

Slik ser Explanatory ut

I en innsiktsblokk forklarer Claude implementasjonsvalg og mønstre i kodebasen.

● Add npm permissions · paramedic-learnings ⌘T
Claude Code v2.1.119
Opus 4.7 (1M context) with xhigh effort · Claude Max
cwd: ~/paramedic-learnings
>
Opus 4.7 (1M) paramedic-learnings Context: 42.0% [WARNING: >40%]
⏵⏵auto mode on(shift+tab to cycle)
ケ5ナ8ウ1エ6ワ3ラ0ト 7ニ2ヌ9ソ4テ1オ6 フ3イ8チ0ミ5シ2ホ6モ ア9カ3マン7タ0リ5サ2 1コ0セ4ム7ハ2ヲ9ツ3 ワ2ラ6ツ1ヲ5ケ9ナ3 エ8ニ0ヌ4ソ7テ1オ5フ マ7カ3サ0ア9ト2ネ6 5ハ1ウ8コ4セ7ム0 ホ6モ1ユ4キ9レ0ヒ3ス7 イ6チ3ミ9シ2ホ0モ4 ユ1キ5レ8ヒ3ス7ク0 ヘ4メ9ノ2ル6タ1マ5 カ0サ7ア3ト8ネ2
S2

SKILLS & PLUGINS —
FERDIGE VERKTØY

S2: SKILLS & PLUGINS

PLUGINS VS SKILLS

Hva er forskjellen?

PLUGIN

Distribusjonspakke (npm-stil)

Samler skills, hooks, MCP-servere

Installeres via /plugin

Deles via markedsplass / settings

SKILL

Oppskrift / instruksjoner (SKILL.md)

Prompt + full verktøytilgang

Invokeres via /skill-name

Deles via versjonskontroll

Plugin = ferdigpakke fra butikken. Skill = oppskrift — kan leve i pakken eller alene i prosjektet.

S2: SKILLS & PLUGINS

HVORDAN INVOKER MAN EN SKILL?

EKSPLISITT

Skriv /skill-name i chatten

AUTOMATISK

Claude matcher beskrivelsen mot samtalen

Kontroll: disable-model-invocation: true

MED ARGUMENTER

/fix-issue 123$ARGUMENTS = "123"

Posisjonelle: $0, $1, $2

claude

INGEN ARGUMENTER

> /debug

$ARGUMENTS

> /simplify refactor auth module

> /review-pr 42

POSISJONELLE $0 $1 $2

> /migrate-component SearchBar React Vue

Skriv / i chatten for å se alle tilgjengelige skills

S2: SKILLS & PLUGINS

SKILL-HIERARKI OG DELING

PRESEDENS

Høyere nivå overstyrer lavere

ENTERPRISE

Managed policy — org-brede skills

Administratorer deployer

PERSONAL

Dine egne skills

~/.claude/skills/

PROJECT

Prosjektspesifikke — committes til repo

.claude/skills/my-skill/SKILL.md

NAVNEROM

Utenfor hierarkiet — kolliderer aldri

PLUGIN

Leveres av en plugin-pakke

plugin-name:skill-name

MONOREPO

Claude oppdager skills i undermapper automatisk — ingen ekstra konfigurasjon nødvendig

S2: SKILLS & PLUGINS

SKILL-ØKOSYSTEMET

BUNDLED

Innebygd — alltid tilgjengelig

/batch — parallelle endringer

/debug — feilsøking

/simplify — kodeforenkling

/loop — gjentakende prompt

/claude-api — bygg med API

MARKETPLACE

Installer via /plugin

claude-plugins-official (auto)

anthropic-agent-skills (manuell)

→ github.com/anthropics/skills

/superpowers TDD, plan, review
/feature-dev plan → kode → QA
/frontend-design UI-komponenter
/document-skills PDF, Word, Excel++
/commit-commands commit, push, PR
/pr-review-toolkit review med agenter
/code-review PR-review
/claude-md-management forbedre CLAUDE.md
/skill-creator bygg egne skills → S4
/semgrep sikkerhetsanalyse → S5
/chrome-devtools-mcp browser-verifikasjon → S6
og mange flere
CUSTOM

Teamets egne skills

SKILL.md i .claude/skills/

Markdown-basert

Committes til versjonskontroll

Deles automatisk i teamet

Vi bygger disse i S4!

S2: SKILLS & PLUGINS

TO REVIEW-VERKTØY, ULIKE BRUK

Begge gjør «code review» — men de er bygget for ulike øyeblikk i flyten.

/code-review:code-review
/pr-review-toolkit:review-pr
HVOR PR-EN BOR
Allerede på GitHub
Lokalt arbeidstre
OUTPUT
Posterer kommentar på PR-en
Skriver oppsummering i terminalen
SIDEEFFEKT
Ja — offentlig kommentar
Ingen — men simplify redigerer filer
TILPASNING
Ingen — fast 8-stegs pipeline
comments tests errors types code simplify
default: all
FILTRERING
Kun funn med score ≥ 80/100
Ingen filter — alt rapporteres
AGENTER
Haiku-triage + 5 parallelle Sonnets
6 spesialiserte opus-subagenter

/code-review når PR-en er på GitHub og du vil ha én streng dom. /pr-review-toolkit når du vil ha bred terminalfeedback før commit.

S2: SKILLS & PLUGINS

/FRONTEND-DESIGN: BOLD UI, INGEN AI-SLOP

Hva gjør den?

Tenker designspråk før kode — tone, typografi, farger, komposisjon. Velger én bold estetisk retning og leverer produksjonsklar kode i den.

  • Forstår konteksten — formål, brukere, tekniske constraints
  • Velger estetikk — minimal, maximalistisk, retro-futur, brutalistisk …
  • Implementerer med presisjon — distinkte fonts, motion, layout
  • Unngår AI-slop — ingen Inter/Roboto, lilla gradienter, pill-knapper
S2: SKILLS & PLUGINS

SAMME OPPGAVE, TO PROSESSER

User Story #1: opprett topic. Ulik input — radikalt ulikt resultat.

UTEN PROSESS
Claude Code v2.1.119
Opus 4.7 (1M context) · Claude Max
cwd: ~/paramedic-learnings
>
Opus 4.7 (1M) paramedic-learnings
⏵⏵auto mode on(shift+tab to cycle)
MED SKILLS(artefakt: docs/design-theme.md)
Claude Code v2.1.119
Opus 4.7 (1M context) · Claude Max
cwd: ~/paramedic-learnings
>
Opus 4.7 (1M) paramedic-learnings Context: 5%
⏵⏵auto mode on(shift+tab to cycle)
S2: SKILLS & PLUGINS

TO PROSESSER, TO PRODUKTER

Venstre fungerer. Høyre overbeviser — typografi, framing, farger og validering er bedre.

UTEN PROSESS
MED SKILLS(artefakt: docs/design-theme.md)
ØVELSE 3
30 MIN

FRONTEND-DESIGN OG CLAUDE.MD-LØKKEN

User Story #1: opprett topic — bygg fra bunn, og la koden forme CLAUDE.md

1
/plugin marketplace add anthropics/skills — legg til markedsplassen
2
/plugin — installer: commit-commands, frontend-design, superpowers
3
/superpowers:brainstorming — la skillen lagre docs/design-theme.md
4
/frontend-design — leser design-theme.md, bygger topic-form og topic-kort
5
/simplify + npm run build — verifiser kvalitet
6
/commit-commands:commit-push-pr — commit og lag PR
7
/claude-md-improver — la koden forme CLAUDE.md, reflekter sammen
S2: SKILLS & PLUGINS

/DOCUMENT-SKILLS: 16 SKILLS, ÉN PLUGIN

Verktøykasse for innholds-produksjon — tilgjengelig i Claude.ai (web/desktop) og Claude Code.

DOKUMENTER

Office — source-available

pdf

Lese, skrive, OCR

docx

Word + kommentarer

pptx

Slides + talenotater

xlsx

Formler + diagrammer

DESIGN

Visuell polish & identitet

brand-guidelines

Anthropic-mal

theme-factory

10 ferdige tema

canvas-design

Posters & PDF-art

frontend-design

Distinktive UI-er

KOMMUNIKASJON

Tekst & team-deling

internal-comms

Rapporter & FAQ

doc-coauthoring

Specs & proposals

slack-gif-creator

GIF-er for Slack

UTVIKLER

Bygg AI-verktøy

mcp-builder

MCP-servere

skill-creator

Egne skills (S4)

web-artifacts

claude.ai-artifacts

webapp-testing

Playwright-tester

algorithmic-art

p5.js generative

INSTALL /plugin install document-skills@anthropic-agent-skills
S2: SKILLS & PLUGINS

SUPERPOWERS: HELE FLYTEN MED 13 SKILLS

PLANLEGGING

/brainstorming

Utforsk problemrommet med åpne spørsmål

/writing-plans

Bryt oppgaven ned i testbare steg

/executing-plans

Følg planen disiplinert, steg for steg

IMPLEMENTASJON

/test-driven-dev

Rød, grønn, refaktorer — test først

/systematic-debugging

Finn rotårsaken, ikke bare symptomene

/writing-skills

Lag gjenbrukbare skills for teamet

SKALERING

/parallel-agents

Dispatch uavhengige oppgaver i parallell

/subagent-driven-dev

Deleger uten å fylle kontekstvinduet

/using-git-worktrees

Flere agenter, samme repo, null konflikt

KVALITET

/requesting-review

Få strukturert review fra agent-kollega

/receiving-review

Håndter kommentarer systematisk

/verification

Bekreft at arbeidet er ferdig før levering

/finishing-branch

Commit, push, og åpne pull request

INSTALL /plugin install superpowers
S2: SKILLS & PLUGINS

/BRAINSTORMING I PRAKSIS

Skillen stiller spørsmål og rendrer valgene som artefakter du kan reagere på.

FORSLAG: DETALJSIDE-STRUKTUR
Brainstorming forslag: detaljside som journal-artikkel, én kolonne, med kilder nederst
A/B: SEPARAT ELLER KOMBINERT FILTRERING
Brainstorming A/B: kombinert toolbar vs separate chips for kategori
S2: SKILLS & PLUGINS

/FEATURE-DEV: 7 FASER, ÉN PIPELINE

Én skill, seks subagenter, tre harde stopp.

# FASE HVA SKJER HVEM
1 OPPDAGELSE Fang opp ønsket, sett opp TodoWrite-liste Claude + bruker
2 UTFORSKING 2–3 code-explorer i parallell — ulike vinkler på codebasen Subagenter → Claude
3 AVKLARING Samler alle åpne spørsmål til én liste — venter på svar
Claude → bruker HARD STOPP
4 ARKITEKTUR 2–3 code-architect i parallell: minimal vs. ren vs. balansert
Subagenter → bruker HARD STOPP
5 IMPLEMENTASJON Kun etter eksplisitt godkjenning — bygger med valgt design Claude
6 REVIEW 3 code-reviewer i parallell: enkelhet, korrekthet, konvensjoner Subagenter → bruker
7 OPPSUMMERING Lukker todos, lister endrede filer, foreslår neste steg Claude

Plan mode = lås. Superpowers = verktøykasse. /feature-dev = ferdig pipeline.

ØVELSE 4 — DEMO

DEMO — USER STORIES #2–6

Eksempel på løsning — en konkret Topic Discovery-slice fra paramedic-learnings.

PARAMEDIC-LEARNINGS
USER STORIES #2–6
  • Liste av topics
  • Søk på nøkkelord
  • Filter på område
  • Detaljside
  • Rasjonale + kilder
ØVELSE 4
40 MIN

BLI KJENT MED /SUPERPOWERS

User Stories #2–6 — Topic Discovery: list, søk, filter, detalj, rasjonale.

1
Planlegging/brainstorming/writing-plans
Felles datamodell? Routing for detaljside? Søk vs filter — separate eller kombinert? Tomme tilstander?
2
Implementasjon/executing-plans + /test-driven-dev
Rød test for hver story-kontrakt først (query, handler, komponent). Så implementer bit for bit.
3
Skalering/parallel-agents + /subagent-driven-dev
Uavhengige tråder i parallell. Subagenter for delegert testskriving.
4
Kvalitet/verification/requesting-review/finishing-branch
Test + build + browser. Agent-review. Åpne PR — tag en makker.
5
Feedback — review fra makker → /receiving-review
Les alt, verifiser påstander, push tilbake på svake forslag. Implementer bit for bit.
6
Læring/revise-claude-md
Skillen leser sesjonen og foreslår tillegg til CLAUDE.md. Aksepter det som faktisk gjelder.
7
Refleksjon — Hvilke skills ga mest verdi? Hvilke føltes tvungne?
Del i par.
BONUS
/systematic-debugging /writing-skills /using-git-worktrees

Aktiver bevisst når dere støter på bug, gjentakelse eller parallelle agenter.

LUNSJ

12:30 – 13:15

ETTER LUNSJ: QUIZ OM S1 + S2

ケ5ナ8ウ1エ6ワ3ラ0ト 7ニ2ヌ9ソ4テ1オ6 フ3イ8チ0ミ5シ2ホ6モ ア9カ3マン7タ0リ5サ2 1コ0セ4ム7ハ2ヲ9ツ3 ワ2ラ6ツ1ヲ5ケ9ナ3 エ8ニ0ヌ4ソ7テ1オ5フ マ7カ3サ0ア9ト2ネ6 5ハ1ウ8コ4セ7ム0 ホ6モ1ユ4キ9レ0ヒ3ス7 イ6チ3ミ9シ2ホ0モ4 ユ1キ5レ8ヒ3ス7ク0 ヘ4メ9ノ2ル6タ1マ5 カ0サ7ア3ト8ネ2
S3

MCP —
KOBLE TIL VERDEN

S3: MCP

AGENTEN LEVER I EN BOBLE

Kan ikke hente design fra Figma

Kan ikke lese issues i GitHub

Vet ikke hva nyeste docs sier

Kan ikke poste i Slack

FØR

Isolert

«USB-C for AI-applikasjoner»

MODEL CONTEXT PROTOCOL
GITHUB FIGMA DOCS SLACK

Koblet på

MCP fjerner denne begrensningen — én åpen standard, mange tilkoblinger. Fungerer i Claude, ChatGPT, VS Code, Cursor og mange andre.

S3: MCP

HVORDAN MCP FUNGERER

Arkitekturen er enkel — hver MCP-server snakker med én ekstern tjeneste, óg app-en snakker med alle via samme protokoll.

AI-APP

Claude Code
(vert)

MCP-KLIENT

Innbakt i app-en
(klient-bibliotek)

MCP-SERVER

Adapter
(lokal/remote)

TJENESTE

Figma, GitHub, docs…
(API)

STDIO Lokal prosess — raskest
HTTP Remote server — OAuth-støtte
SSE Deprecated — bruk HTTP
S3: MCP

TRE KONFIGURASJONSNIVÅER

OPPSETT

LOKAL

--scope local

Standard — privat for dette prosjektet.

~/.claude.json, under prosjekt-pathen.

PROSJEKT

--scope project

Delt med teamet via versjonskontroll.

Lagres i .mcp.json i repoet.

USER

--scope user

Tilgjengelig på tvers av alle dine prosjekter.

~/.claude.json, på toppnivå.

TOKEN-TIPS

Bruk ${API_TOKEN}-template-syntaks — aldri hardkod tokens i konfigfilene.

S3: MCP

MCP-SERVERE KREVER TILLIT

Hver server er kode fra fremmede — vurder dem som du ville vurdert et tredjepartsbibliotek.

01

Anthropic auditer ikke tredjeparts MCP-servere — du er selv ansvarlig for å vurdere trygghet.

02

Bare installer MCP-servere fra offisielle kilder. Fremmede sine MCP-er kan brukes som inspirasjon — lag heller dine egne.

03

Installer kun det dere faktisk bruker — hver server legger til verktøyene sine i konteksten ved hver kjøring.

S3: MCP

EKSEMPLER PÅ NYTTIGE MCP-SERVERE

DESIGN

FIGMA

Design tokens, frames

MIRO

Whiteboards

21ST.DEV

UI-komponenter

ISSUE TRACKING

JIRA

Tickets, sprinter

LINEAR

Issues, projekter

GITHUB

Issues, PRs, kode

DOKUMENTASJON

CONTEXT7

Live bibliotek-docs

NOTION

Team-docs, baser

TESTING & SIKKERHET

PLAYWRIGHT

Browser-tester

SEMGREP

Sikkerhetsanalyse

Velg de som matcher teamets arbeidsflyt. /mcp for å se hva du har installert.

S3: MCP

CONTEXT7 — FERSK DOKUMENTASJON

MCP-server som henter oppdatert dokumentasjon og kodeeksempler for biblioteker i sanntid — AI-modellens kunnskap har en cutoff-dato. Context7 har ikke det.

CONTEXT7.COM
Context7-hjemmesiden — Up-to-date Docs for LLMs and AI code editors, med liste over biblioteker
I CLAUDE CODE
Claude Code v2.1.119
Opus 4.7 · cwd: ~/team-app
>
Opus 4.7 (1M) team-app
⏵⏵auto mode on(shift+tab to cycle)
S3: MCP

MIRO + NOTION — FRA KAOS TIL STRUKTUR

MIRO
Miro-tavle: kompleks flytdiagram for offentlig anskaffelse, med happy path og forgreininger
NOTION
Notion-side: 'MVP Flow — Happy Path: Opprette anskaffelse', strukturert oppsummering

Claude kan lese ut all tekst fra flyt i Miro og oversette det til et forståelig notat i Notion. Det hjelper meg å sette meg inn i nytt domene raskt.

S3: MCP

GITHUB — ISSUE TIL PR

Lese issues, scope opp i sub-issues, og verifisere at akseptansekriteriene er møtt — automatisk.

ØVELSE 5
30 MIN

MCP: SETT OPP OG BRUK

1
Bla i katalogen i Claude Code Docs
2
Velg 1–2 servere som passer din hverdag
3
Installer: claude mcp add ...
4
Prøv å bruke MCP-serverne til passende oppgaver
QR code til MCP-docs
SCAN ME
https://code.claude.com/docs/en/mcp
Claude Code Docs — Popular MCP servers
ケ5ナ8ウ1エ6ワ3ラ0ト 7ニ2ヌ9ソ4テ1オ6 フ3イ8チ0ミ5シ2ホ6モ ア9カ3マン7タ0リ5サ2 1コ0セ4ム7ハ2ヲ9ツ3 ワ2ラ6ツ1ヲ5ケ9ナ3 エ8ニ0ヌ4ソ7テ1オ5フ マ7カ3サ0ア9ト2ネ6 5ハ1ウ8コ4セ7ム0 ホ6モ1ユ4キ9レ0ヒ3ス7 イ6チ3ミ9シ2ホ0モ4 ユ1キ5レ8ヒ3ス7ク0 ヘ4メ9ノ2ル6タ1マ5 カ0サ7ア3ト8ネ2
S4

CUSTOM SKILLS —
TEAMETS EKSPERTISE

+ + + + + +
S4: CUSTOM SKILLS

EGNE SKILLS FOR EGNE BEHOV

Ferdige skills er kraftige — men dekker ikke deres domæne eller arbeidsflyt. Egne skills pakker teamets ekspertise i gjenbrukbare instruksjoner. Under ser dere skills jeg har laget.

/test-implementation

Sjekker implementasjon mot akseptansekriterier fra issues

/demo-recorder

Tar opp animerte GIF-demoer av features automatisk

/pedagogical-pr-review

Fil-for-fil PR-review for læring, ikke bare godkjenning. Fanger opp forbedringer i en todo-liste underveis.

/ui-inspo

UI-inspirasjon parallelt fra 21st.dev + frontend-design, med sikkerhetssjekk

/design-first-collaboration

Strukturert design-samtale før man koder. Speiler whiteboarding og gir felles mental modell med AI’en.

/pixel-theme

Genererer pixel-art slides og sprites i min stil

/pentest

Kjører en penetrasjonstest, en kontrollert simulert hackerangrep, mot en webapp for å avdekke sårbarheter.

/review-dep-update

Vurderer dependency-PR: breaking changes + security-audit

S4: CUSTOM SKILLS

ANATOMIEN TIL EN SKILL

.claude/skills/
    └── my-skill/
        ├── SKILL.md      Påkrevd
        ├── reference.md   Valgfri
        └── scripts/
            └── helper.py    Valgfri
SKILL.md

YAML-frontmatter (når) + markdown (hva)

Referansefiler

Domenekunnskap — maler, sjekklister, eksempler

Scripts

Hjelpescripts for automatisering

ANBEFALT FORMAT

Skills er nå anbefalt for egne kommandoer — SKILL.md gir både /skill-name og auto-trigger via description. .claude/commands/ er et eldre lettvekts-alternativ. Det er bare en markdown-fil (fortsatt støttet).

S4: CUSTOM SKILLS

SKILL.MD-FELTER

name

Identifikator — lowercase, kebab-case

description

Trigger-tekst i tredjeperson — "This skill should be used when…"

version

Semver — 0.1.0 når skillen endrer seg

disable-model-invocation

Bare eksplisitt /skill-name aktiverer

allowed-tools

Begrens verktøy — f.eks. bare Read og Grep

user-invocable

Skjul fra /-menyen — Claude bruker den fortsatt

S4: CUSTOM SKILLS

HVA GJØR EN SKILL GOD?

SPESIFIKK

Konsistent output — ikke "skriv en god test"

STEG-FOR-STEG

Nummererte steg, ikke løs prosa

REFERANSEFILER

Maler, sjekklister, eksempler for domenekunnskap

TESTBAR

Fungerer uten forklaring — gi den til noen andre

PROGRESSIV DISCLOSURE

SKILL.md slank (<500 linjer) — detaljer i referanse-filer

DYNAMISK KONTEKST

!`git log -5` for live data — skillen ser nåværende state

S4: CUSTOM SKILLS

HJELP TIL Å BYGGE SKILLS

To innebygde skills som gjør øvelsen lettere

START

/skill-creator

Guider deg gjennom å lage en skill fra bunnen — genererer mappestruktur, SKILL.md-mal og foreslår trigger-beskrivelse.

> Jeg vil bygge en skill som …

SJEKK

/writing-skills

Kvalitetssjekker skillen din: trigger-beskrivelse, progressiv disclosure, struktur, testbarhet — før du deler med andre.

> Kan du sjekke denne skillen?
S4: CUSTOM SKILLS

/UI-INSPO

Bruker flere kilder og følger designsystemet.

  1. 1

    Les DESIGN_SYSTEM.md

  2. 2

    Query 21st.dev + frontend-design i parallell

  3. 3

    Sikkerhetssjekk — verifiser at forslagene er safe

  4. 4

    Syntetiser — kombiner inspirasjon og forslag

  5. 5

    Research-dokument med anbefalinger og kode-snippets

21ST.DEV
ENERGY
◆ READY TO GENERATE?
PRESS

the seduction

“Look how much progress I made”

Impact Hierarchy for Coding Agents

THE IMPLEMENTATION TRAP

REFACTOR
+ + + PATTERN

DESIGN−FIRST
COLLABORATION

Structured conversation pattern
that mirrors whiteboarding

Based on Rahul Garg's pattern from martinfowler.com

1
CAPABILITIES
What does it do?

2
COMPONENTS
What pieces do we need?

3
INTERACTIONS
How do they communicate?

4
CONTRACTS
What are the interfaces?
PLANNING THE IMPLEMENTATION WITH /DESIGN-FIRST-COLLABORATION
TESTING ACCEPTANCE CRITERIA WITH /TEST-IMPLEMENTATION
ØVELSE 6
45 MIN

BYGG EN CUSTOM SKILL

Velg én skill — bygg & test — del med partner

A /test-implementation

Automatiser TDD-syklus — les spec, skriv test, implementer, verifiser.

B /design-first-collaboration

Tving agenten til å lage design-skisse før kode — få feedback tidlig.

C /pedagogical-pr-review

PR-review fil-for-fil med læring i fokus — ikke bare finn feil.

STEG
1

Lag .claude/skills/din-skill/

2

Skriv SKILL.md (frontmatter + steg)

3

Referansefiler — mal, sjekkliste

4

Test: claude --debug + trigger-frase

5

Del med partner — fungerer uten forklaring?

DAG 1 OPPSUMMERT

DET DERE HAR LÆRT

S1

CLAUDE.md

Kontekst og forståelse

S2

Skills & Plugins

Ferdige verktøy

S3

MCP

Koblet til verden

S4

Custom Skills

Teamets ekspertise

REFLEKSJON

Hva var din viktigste
aha-opplevelse i dag?

I MORGEN KL 09:00

Hooks for sikkerhet · den komplette arbeidsflyten · teamøvelse