F
Sett AI i arbeid
05

Bygg det du skisserte

Fra mockup til oversikt som åpnes i morgen

Mockupen fra claude.ai/design møter Cowork. Du skal bygge den daglige oversikten du designet — koble den til scheduled-oppgavene fra sjekkpunkt 2, og få den ferdig kjørende. Skillsene du lager er oppskrifter: blir Claude bedre neste måned, blir verktøyet bedre uten at du endrer noe.

Hvor du er nå → hvor du kan være om 75 min
Nå — en mockup på skjermen
Et bilde av hvordan oversikten din kan se ut. En idé som angår deg. Men ingen ferske data, ingen kobling til oppgavene som henter dem, ingen versjon du faktisk vil åpne i morgen.
Om 75 min — en oversikt som kjører
En HTML-side du bokmerker. Ferske data fra dine scheduled tasks, layout fra mockupen, og en kjøring som oppdaterer den hver morgen før du står opp. Mockupen ble noe du faktisk bruker.
Fire byggeklosser å hente fra
Mini-grafer

Trendlinjer og sparklines per datapunkt. Chart.js gir interaktive grafer rett i HTML — Claude skriver koden for deg.

Flere datakilder

Vev sammen output fra 3–5 scheduled tasks i samme side. Oversikten blir mer verdt jo flere biter den fanger.

Gjenbrukbar mal

Lag en HTML-mal med {{PLASSHOLDERE}} som Claude fyller ut hver morgen. Samme layout, nye data, hver dag.

Skill-kjeding

Koble skills: Hent data → Formater → Bygg HTML → Lagre. Én kjøring gjør alle steg. Som en oppskrift med under-oppskrifter.

01

Send mockupen over til Cowork

I claude.ai/design: Share → Handoff to Claude Code. Du får en tekst + lenke som beskriver designet ditt presist. Lag et nytt Cowork-prosjekt for oversikten med en mappe den kan skrive til, pek scheduled-oppgavene fra sjekkpunkt 2 dit, og lim inn Handoff-teksten som første melding. Be Claude lagre HTML-en i et filnavn du husker (f.eks. oversikt.html) — du skal bokmerke den fila i nettleseren snart.

02

Velg én byggekloss — ikke alle

Velg ÉN av de fire over som passer mockupen din best. Det er bedre å gjøre én ting ferdig enn tre halvferdige. Du kan alltid legge til mer senere — i dag har du 75 min.

Spør Claude: «Hva i mockupen min ville løftet oversikten mest hvis du bygde det først?» Du er for tett på til å se det selv — og det er raskere å svare på enn å prøve alle tre.
03

Bygg

Vis mockupen og data-filene til Claude. Iterer 2–3 runder. Be om en skisse i kode først — «tegn opp hvordan dette skal se ut før du koder ferdig» — så sparer du runder. Når du er fornøyd, be Claude vise deg full sti til HTML-fila på disken — du trenger den i neste steg.

Eksempler — beskriv oversikten
«Bygg HTML-siden slik mockupen viser. Hent siste tall fra data/marked.json, vis Brent + USD/NOK + OSEAX som kort øverst, og dagens nyhets-task som liste under.»
«Lag en HTML-mal med {{PLASSHOLDERE}} for hvert datapunkt i mockupen — slik at en skill kan fylle dem ut hver morgen med ferske data.»
«Lag en skill som leser de tre dagsfilene fra oppgavene mine, slår dem sammen, og produserer oversikten i denne malen.»
Skill-kjeding — slik tenker du
Tenk på det som en morgen-rutine delt opp i steg: hent ferske data → vask + slå sammen → fyll malen → lagre HTML. Hver «pil» er én skill. Når du kjeder dem, gjør Claude alt på rad — men hver skill er enkel å forstå og forbedre alene. Det er forskjellen mellom en god skill og en stor uoversiktlig en.
04

Åpne fila i nettleseren og bookmark

Dette er poenget med hele øvelsen: du skal åpne oversikten i morgen tidlig uten å gå via Cowork. Dobbeltklikk HTML-fila i Finder/Explorer — eller dra den inn i nettleseren. URL-en starter med file:///. Legg den som bokmerke øverst i bokmerke-raden, og gi den et navn du kjenner igjen («Min morgen», «Daglig oversikt»). Verifiser at den åpnes med ett klikk uten at Cowork er i bildet.

På Mac: dra fila inn i Chrome/Safari fra Finder. På Windows: høyreklikk → «Åpne med» nettleser. Bookmark-genveien er ⌘D (Mac) eller Ctrl+D (Windows).
05

Koble til en scheduled-oppgave

Cowork skal oppdatere samme HTML-fil hver morgen mens du sover. Koble byggingen til en av oppgavene fra sjekkpunkt 2, eller lag en egen som kjører byggesteget på et tidspunkt før du står opp. Da går det fra «verktøy jeg åpner» til «oversikt som er klar når jeg setter på kaffen» — samme bokmerke, ferske tall.

06

Gjør prøven på om den holder

Still deg selv det ene spørsmålet som avgjør alt: hva ser jeg på denne i dag som faktisk endrer en avgjørelse? Klarer du ikke svare, er oversikten for bred — kutt til det ene tallet du ville handlet på.

Mal-teknikken — for gjentakende rapporter
Hvis du lager samme type rapport mer enn 2 ganger → lag en mal. Be Claude: «Lag en HTML-mal av denne rapporten med {{PLASSHOLDERE}} for data som endrer seg.» Neste gang: «Fyll ut malen med ferske data fra [filnavn].» Samme layout, nye tall, ingen drift mellom uker.
Når noe ikke fungerer: første reaksjon er ofte å be Claude prøve igjen. Gjør heller motsatt — be om å se selve HTML-koden, eller åpne fila i Chrome (Cowork-forhåndsvisningen har ikke alle nettleserfunksjoner). Du finner feilen raskere ved å lese enn ved å gjette.
Stopp og tenk — før dere går videre
  • Hva ville verktøyet ditt vært verdt om det kjørte hver mandag i et halvår?
  • Hvilken kollega ville først hatt nytte av dette?
  • Hva ville måtte være sant for at du faktisk brukte det neste uke?
  • Hvis du fikk to dager til på dette — hva er det neste du ville bygget?
Du er ferdig når

du har en daglig oversikt som kjører — med ferske data fra minst én scheduled task, og minst én ting den viser som mockupen lovte.

★ Kun for de raskeIkke stress hvis du ikke rekker det

Polér når det kjører

Verktøyet kjører og du har et kvarter til overs? Da er det tid til å gjøre det skarpere — eller bygge inn en av byggeklossene du ikke valgte først.

Polér visuelt

Be Claude rydde typografi, farger og spacing. Én aksentfarge, tydelige overskrifter, luft mellom seksjoner. 5 minutters arbeid som avgjør om du gidder å åpne den i morgen.

Demo-modus

Legg inn eksempeldata fra task-outputs eller mock-tall i en demo-fil. Da kan du vise oversikten frem selv om dagens kjøring ikke gikk — nyttig når du skal vise den til en kollega.

Mobilvennlig

Be Claude gjøre HTML-en responsiv. Da kan du faktisk åpne den på telefonen din i pausen. En liten ting som plutselig gjør at verktøyet føles ekte.

Skriv en README

Be Claude lage en README.md som forklarer hva verktøyet gjør, hvordan det kjøres, og hva neste utvidelse kunne vært. Du vil takke deg selv om tre uker.

Kjedet med konverterings-skillen

Koble byggen til skillen du laget i sjekkpunkt 4: la verktøyet automatisk bruke de friske .md-ene. Da jobber dagens to skills sammen — uten manuelt arbeid mellom.

Be Claude kritisere verktøyet

«Hva er de tre svakeste tingene med dette verktøyet, og hvordan ville du forbedret hver av dem?» Du får ofte overraskende presise svar — og en liste over neste skritt.

En polert versjon blir åpnet oftere enn en mer avansert versjon som ikke er fiksa. Tid på finish er sjelden bortkastet.