Siden du leser akkurat nå er beviset. Bygget med ChatGPT, Claude, Three.js, GitHub, Vercel og Domeneshop for 99 kroner. AI-optimalisert fra første sekund. Her er hvordan du gjør det samme.
Hver av de ti teknikkene under er live WebGL-kode som kjører i nettleseren din akkurat nå. Beveg musa over hver canvas for å se hvordan de reagerer. Klar til å kopiere inn i ditt eget prosjekt.
VARIASJON 01 / 10
Partikkel-mesh
Sample punkter på overflaten av et 3D-objekt og få et partikkelfelt formet som geometrien. Dette er signaturen til Frontberg, Vercel sin AI-side og Lusion. Beveg musa over canvas for å se reaksjonen.
TX-01
PARTICLE MESH · LIVE
Stack Three.js · BufferGeometry
Nivå Mellom
Tid 04 timer
Partikler 5 000
VARIASJON 02 / 10
Vertex distortion
Modifiser hvert vertex i geometrien med simplex noise i en GLSL vertex shader. Resultatet er en blob som puster, vrir seg og morfer i sanntid. Apple bruker dette på iPhone-presentasjoner og Vision Pro-siden.
TX-02
DISTORTION SHADER · LIVE
Stack GLSL · ShaderMaterial
Nivå Avansert
Tid 06 timer
Subdivisjoner 32x32
VARIASJON 03 / 10
Glass og refraksjon
MeshPhysicalMaterial med transmission, IOR og thickness gir ekte glass som forvrenger bakgrunnen, kaster kaustikk og fanger lys. Brukes av Apple Vision Pro, Lusion og hele luksus-segmentet i 2026.
TX-03
GLASS REFRACTION · LIVE
Stack MeshPhysicalMaterial
IOR 1.7
Transmission 0.95
Tid 03 timer
VARIASJON 04 / 10
Cinematisk kamera
Kameraet panner og dollyer langs en Catmull-Rom kurve mens brukeren scroller. Hver seksjon er en kameravinkel, hver scroll er et klipp. Apple AirPods, Lusion og Active Theory bygger hele opplevelser rundt denne teknikken.
TX-04
SCROLL CAMERA · LIVE
Stack GSAP · Lenis
Path Catmull-Rom
Punkter 80
Tid 05 timer
VARIASJON 05 / 10
Volumetrisk lys
Effects pipeline med fog volumes og bloom post-processing gjør lyset til et fysisk medium. Som tåkesollys gjennom skogkronen i Avatar. Tunge teknikker, men enorm visuell uttelling. 12 transparente kjegler med additive blending.
TX-05
VOLUMETRIC LIGHT · LIVE
Stack EffectComposer
Bloom UnrealBloomPass
Light cones 12
Tid 08 timer
VARIASJON 06 / 10
Morph targets
Interpolér mellom forskjellige geometrier i sanntid. Et objekt kan begynne som en kube og ende som en sphere mens kameraet panorerer rundt. Vertex-baserte morphs er overraskende billige på GPU og fungerer på mobil.
TX-06
MORPH TARGETS · LIVE
Stack Buffer Lerp
Targets 2 (kube ↔ sphere)
Vertex count ~12 000
Tid 04 timer
VARIASJON 07 / 10
Vortex felt
Tusenvis av partikler som svever rundt et sentrum etter spiral-formler. Som en akkresjonsskive rundt et svart hull i Interstellar. GPU-akselerert med custom shaders, tåler 50 000 partikler uten å miste fps på desktop.
TX-07
VORTEX FIELD · LIVE
Stack Points · Curl Noise
Partikler 5 000
FPS 60
Tid 05 timer
VARIASJON 08 / 10
Fluid simulation
Navier-Stokes-ligningen kjørt på GPU med ping-pong framebuffer. Brukeren beveger musa og fluidet reagerer som ekte væske. Pavel Dobryakov sin webdemo gjorde dette berømt og Fortnite bruker samme prinsipp.
TX-08
FLUID FIELD · LIVE
Stack WebGL2 · Ping-pong FBO
Resolution 64x64
Iterations 20
Tid 16 timer
VARIASJON 09 / 10
X-ray fresnel
Fresnel-shader gir kanter som gløder og overflater som blir gjennomsiktige. Brukeren ser både formen og det som er bak den samtidig. Tron, Iron Man HUD og alle medisinske visualiseringer bruker denne effekten.
TX-09
X-RAY MODE · LIVE
Stack Custom GLSL
Blending Additive
Geometry TorusKnot
Tid 04 timer
VARIASJON 10 / 10
Flytende metall
Kombinasjonen av høy metalness, lav roughness og environment mapping gir T-1000 fra Terminator 2 i nettleseren. CubeCamera genererer environment fra fargede sfærer som reflekterer mint, cyan og lilla på krom-overflaten.
TX-10
LIQUID METAL · LIVE
Stack HDR Environment · PBR
Metalness 1.0
Roughness 0.05
Tid 05 timer
Hurtigsvar
Hvordan lager jeg en 3D nettside med AI?
Start med å kjøpe et .no domene på Domeneshop for 99 kroner. Deretter lager du en prompt med ChatGPT som beskriver 3D-scenen din. Lim den inn i Claude som skriver Three.js-koden. GitHub lagrer filene. Vercel publiserer alt gratis. Total kostnad: 99 kroner. Total tid: 92 minutter.
Hemmeligheten? La ChatGPT skrive prompten til Claude.
Vi skal være ærlige. Vi brukte ChatGPT til å strukturere prompten, og Claude til å skrive Three.js-koden. Hver AI er god på forskjellige ting. ChatGPT er flink på prompt engineering, Claude er flink på å skrive ren, lesbar 3D-kode. Kombinasjonen er sterkere enn begge hver for seg.
prompt-3d.txt · 612 ord · 13 seksjoner
ROLLE: Du er en senior frontend utvikler og 3D-spesialist med dyp kunnskap om Three.js, React Three Fiber og GLSL. Lag en komplett, produksjonsklar 3D-hjemmeside i en enkelt HTML-fil for 3dnettside.no, hostet på Vercel.
KONTEKST OM SIDEN:
3dnettside.no er Europas mest komplette norske kunnskapsguide for å bygge 3D nettsider med AI. Siden er sitt eget bevis og demonstrerer metoden den beskriver. Målgruppen er norske utviklere, designere og bedriftseiere som vil bygge moderne 3D-opplevelser uten dyp Three.js-bakgrunn.
TEKNISK KRAV:
- Three.js r128 fra cdnjs
- 8000+ partikler i en levende mesh-formasjon
- WebGL2 med additive blending og custom shaders
- Scroll-driven kamera og morphing-effekter
- 60fps på iPhone 12 og oppover...
Slik gjorde vi det: Vi spurte først ChatGPT om å lage en utfyllende prompt som dekker Three.js-arkitektur, GLSL shader-pattern, scroll-orchestrering, ytelse på mobil, AEO og LLM-optimalisering. ChatGPT leverte en mal. Vi fylte inn detaljene over (domene, kontekst, fargepalett mint og cyan, partikkel-mesh-effekt), limte hele prompten inn i Claude, og 92 minutter senere var siden ferdig og live på Vercel. Resten av prompten (struktur, design, SEO, AEO, innhold, tilgjengelighet) forble lik malen.
Viktig prinsipp
Start alltid med domenet
Domenet bestemmer alt. Bedriftsnavn, e-post, SEO, og hvordan folk finner deg på Google. Du kan ikke markedsføre noe før du har en adresse.
SEO tar tid Grunn 01
Et domene som er 2 år gammelt rangerer bedre enn et nytt, selv med samme innhold. Jo tidligere du registrerer, jo tidligere begynner Google å bygge tillit.
Domenet styrer konseptet Grunn 02
Hvis drømmenavnet er opptatt, må konseptet endres. Start med å finne et ledig navn, bygg deretter resten rundt det.
Du trenger e-post Grunn 03
hei@dittfirma.no ser 100 ganger mer profesjonelt ut enn dittfirma@gmail.com. Uten domene, ingen profesjonell e-post.
Vår egen historie Grunn 04
Vi kjøpte 3dnettside.no først. Deretter bestemte vi at siden skulle handle om 3D-utvikling med AI. Hele konseptet kom fra domenet.
Før du starter
Dette trenger du klart
Fem minutter å samle. Null friksjon etterpå.
6/6 PUNKTER
01
E-post adresse
Brukes for å registrere alle fem kontoer.
02
Kredittkort eller Vipps
For å betale domenet. Bare 99 kroner.
03
Tre til fem ord
Som beskriver konseptet. Eksempel: 3D-portfolio for arkitekt.
04
Datamaskin med nettleser
Chrome, Safari, Firefox eller Edge. Ingen installering.
05
To ledige domeneideer
I tilfelle førstevalget er opptatt.
06
Cirka 95 minutter
Uten avbrytelser. Du trenger ikke mer tid enn det.
1
Steg 1 av 5 · Finn ditt domene
Kjøp et .no domene
Start alltid her. Domenet bestemmer navnet på siden din, e-post adressen, og hele identiteten. Du kan ikke markedsføre noe før du har en adresse. Det finnes flere gode norske registrarer. Vi kjøpte 3dnettside.no hos Domeneshop som har kampanjepris på 99 kroner første år.
Vi kjøpte 3dnettside.no hos Domeneshop. Det er den siden du leser nå.
✓ Dette brukte vi
99 kr
Første år (kampanjepris)
Din egen .no adresse
DNS administrasjon inkludert
Gratis SSL via Let's Encrypt
Norsk kundesupport
Fra år 2
199 kr
Per år (vanlig pris)
Alt fra første år
Epostvideresending inkludert
Automatisk fornyelse valgfritt
Full domeneeierskap
Tilleggstjenester hos Domeneshop: Epost med 20 kontoer for 29 kr/mnd, Webhotell Light (5 GB) 35 kr/mnd, Web Standard (20 GB) 65 kr/mnd, Web Pro (100 GB) 85 kr/mnd, Web Max (500 GB) 105 kr/mnd. Se domeneshop.no for alle tjenester og priser.
Hvis ledig, klikk "Bestill" og velg 1 års registrering
3
Opprett konto med epost, navn og adresse
4
Betal med Vipps, kort eller faktura
5
Domenet er ditt innen minutter. DNS innstillinger kommer vi til i Vercel-steget
Inkludert i prisen: DNS administrasjon, gratis SSL sertifikat via Let's Encrypt, epostvideresending, norsk support på hverdager, og full kontroll over domenet uten skjulte avgifter.
Alternativt: Du kan hoppe over dette steget og bruke gratisadressen fra Vercel (f.eks. 3dnettside.vercel.app). Da er hele prosessen helt gratis. Men for ekte bedrift anbefaler vi eget .no domene.
→ Andre norske domeneforhandlere
Domeneshop har best pris på .no domener i 2026, men disse er også trygge valg:
Vi startet med ChatGPT for å lage en utfyllende prompt. ChatGPT er spesielt flink på prompt engineering. Det vil si å strukturere instruksjoner som andre AI-modeller forstår perfekt. Deretter limte vi prompten inn i Claude.
Denne 3D-siden ble skrevet fra en prompt som ChatGPT formulerte for oss
✓ Dette brukte vi
Gratis
ChatGPT Free
Tilgang til GPT-5.3
10 meldinger per 5 timer på toppmodell
Ubegrenset på GPT-5.2 Mini
Ingen kredittkort påkrevd
Hvis du trenger mer
220 kr/mnd
ChatGPT Plus (20 USD/mnd)
160 GPT-5.3 meldinger hver 3. time
3000 GPT-5.4 Thinking meldinger per uke
Tilgang til Sora, Deep Research, Agent
Ingen annonser
Andre ChatGPT planer: Go 88 kr/mnd (8 USD, lanseringsplan med annonser), Pro 1100 kr/mnd (100 USD, ny tier fra 9. april 2026 med 5x Plus-bruk og GPT-5.4 Pro), Pro 2200 kr/mnd (200 USD, 20x Plus-bruk for ekstreme brukere). Se chatgpt.com/pricing for oppdaterte priser.
Klikk "Sign up" og velg epost, Google eller Microsoft
3
Bekreft epostadressen
4
Du er inne. Begynn å be ChatGPT om å lage en 3D-prompt for Claude
Hvorfor vi brukte ChatGPT til prompt engineering: ChatGPT er kjent for å være spesielt god på å strukturere detaljerte instruksjoner. Vi ba den lage en prompt som vi kunne lime inn i Claude. Å bruke en AI til å lage prompter til en annen AI er en kraftig teknikk få kjenner til.
→ Andre AI-modeller for prompt engineering
Disse fungerer også godt til å lage detaljerte prompter:
Claude er AI-modellen fra Anthropic (nyeste versjon Opus 4.7 lansert april 2026). Du beskriver hvilken 3D-scene du vil ha på norsk, og Claude skriver Three.js, GLSL shaders, scroll-animasjoner og post-processing. Free planen er nok for å lage en komplett 3D nettside som denne.
Slik lagde vi hele denne siden, inkludert 3D-scenen og teksten du leser nå
✓ Dette brukte vi
Gratis
Claude Free plan
Alle Claude modeller tilgjengelig
Daglige bruksgrenser
Web, iOS, Android og desktop
Ingen kredittkort påkrevd
Hvis du trenger mer
220 kr/mnd
Claude Pro (20 USD/mnd)
5 ganger mer bruk enn Free
Prioritert tilgang i travle tider
Tilgang til Projects og Cowork
200K token kontekstvindu
Andre Claude planer: Max 5x 1100 kr/mnd (100 USD, 25x Free-bruk med Opus 4.7), Max 20x 2200 kr/mnd (200 USD, 100x Free-bruk for tungbrukere), Team 275 kr/bruker/mnd (25 USD), Enterprise tilpasset pris. Se claude.com/pricing for detaljer.
Klikk "Sign up" og velg "Continue with email" eller Google konto
3
Bekreft epostadressen og velg passord
4
Du er inne. Lim inn 3D-prompten fra ChatGPT med en gang
Hvorfor vi valgte Claude over ChatGPT for koden: Claude er spesielt god på å skrive ren, strukturert Three.js-kode og følge detaljerte norske instruksjoner. Den forstår GLSL shaders, scroll-orchestrering og post-processing-pipelines uten å hallusinere. Gratis planen er mer enn nok for å lage en komplett 3D nettside som denne.
→ Andre AI-modeller for 3D-kode
Claude er best på Three.js og GLSL, men disse er også gode alternativer:
GitHub er verdens største kodelagringsplattform. Du laster opp filene fra Claude (HTML, GLSL shaders, modeller), og GitHub holder alle versjonene sikre. Hver gang du gjør en endring i Claude, push'er du til GitHub og Vercel oppdaterer automatisk.
Claude skrev hele 3D-koden til denne siden, GitHub holder alle versjonene
✓ Dette brukte vi
Gratis
GitHub Free
Ubegrensede repositories
2000 CI/CD minutter per måned
500 MB pakkelagring
Ubegrensede samarbeidspartnere
For team (senere)
44 kr/mnd
GitHub Team (4 USD/bruker/mnd)
Beskyttede grener
Påkrevd kodegjennomgang
3000 CI/CD minutter
Team administrasjon
Andre GitHub planer: Enterprise 231 kr/bruker/mnd (21 USD, SAML SSO og avansert sikkerhet), Copilot AI-assistent 110 kr/mnd ekstra. Se github.com/pricing for detaljer.
Vercel kobler seg til GitHub, henter filene dine og publiserer 3D-siden på internett. Global CDN gjør at WebGL-ressursene laster raskt over hele verden. Gratis for personlige prosjekter med mer enn nok ressurser for en 3D nettside.
Denne 3D-siden hostes akkurat nå på Vercel Hobby planen
✓ Dette brukte vi
Gratis
Vercel Hobby
100 GB dataoverføring/mnd
1 million edge requests/mnd
1 million funksjonskall/mnd
Ubegrensede deployments
Automatisk SSL og CDN
For bedrift
220 kr/mnd
Vercel Pro (20 USD/bruker/mnd)
1 TB dataoverføring
10 millioner edge requests
Kommersiell bruk tillatt
Team samarbeid og forhåndsvisninger
Andre Vercel planer: Enterprise tilpasset pris (SAML SSO, dedikert support, SLA). Se vercel.com/pricing for oppdaterte priser.
Velg "Continue with GitHub". Dette gjør koblingen automatisk
3
Gi Vercel tilgang til ditt GitHub repository
4
Klikk "Import Project" og velg repositoriet ditt
5
Klikk "Deploy". Siden er live på 30 sekunder
6
Gå til Settings → Domains og legg til ditt Domeneshop-domene
7
Oppdater DNS innstillinger i Domeneshop med verdiene Vercel gir deg
Inkludert i Hobby planen: Global CDN, automatisk SSL sertifikat, 100 GB dataoverføring per måned, 1 million edge requests, ubegrensede deployments, forhåndsvisninger for hver endring, og automatisk oppdatering når du pusher til GitHub.
Viktig om Hobby planen: Vercel Hobby er kun tillatt for personlige, ikke-kommersielle prosjekter. Hvis 3D-siden tjener penger eller er for en bedrift, må du oppgradere til Pro plan (ca 220 kr/mnd).
→ Andre hosting-tjenester
Vercel er enklest for nybegynnere, men det finnes flere gode alternativer:
Komplett oversikt over alle fem verktøy og prisene vi betalte for å bygge 3dnettside.no.
Verktøy
Plan vi brukte
Pris
ChatGPT
Free plan. Lagde 3D-prompten
Gratis
Claude
Free plan. Skrev Three.js-koden
Gratis
GitHub
Free plan. Lagret filene
Gratis
Domeneshop
.no domene første år
99 kr
Vercel
Hobby plan. Publiserte 3D-siden
Gratis
Totalt første år
Komplett 3D-side live på internett
99 kr
Fra år 2: Domeneshop fornyer til 199 kr per år. Claude, GitHub og Vercel forblir gratis så lenge du holder deg innenfor grensene. Årlig kostnad fra år 2: 199 kroner.
Unngå disse
Vanlige feil nybegynnere gjør
Vi har sett hundrevis av AI-genererte 3D-sider. Her er de fem mest vanlige feilene, og hvordan du unngår dem.
01
Å glemme mobiloptimalisering
De fleste bygger 3D-scener som kjører flott på desktop, men dropper til 12 fps på iPhone. Hvis du ikke setter pixelRatio til maks 2 og halverer partikler under 768px bredde, ekskluderer du 60% av brukerne. Test alltid på en ekte mobil før deploy.
02
For kort prompt til Claude
"Lag en 3D-side med en kule" gir generisk resultat. En god 3D-prompt er 400 til 800 ord med konkrete detaljer om scene, materialer, lyssetting, kameraføring og scroll-respons. La ChatGPT hjelpe deg å skrive den. Bruk malen vår som utgangspunkt.
03
Glemme tilgjengelighet
3D-effekter kan trigge migrene og vestibulær lidelse. Hvis du ikke sjekker prefers-reduced-motion og tilbyr en static fallback, gjør du nettsiden utilgjengelig for en stor gruppe brukere. Be Claude bygge inn dette automatisk fra start.
04
Tekst inni 3D-canvas
Tekst som ligger inni WebGL-canvas er usynlig for Google og screenreaders. Det dreper SEO og tilgjengelighet samtidig. Hold all tekst som DOM-elementer over 3D-en, og bruk Three.js kun for visuell effekt.
05
Glemme dispose-pattern
Three.js geometrier og materialer må eksplisitt frigjøres med .dispose() når komponenter unmountes. Hvis du glemmer det, vokser minnebruken med hver navigasjon til faner krasjer. Bruk R3F som håndterer dette automatisk.
Spørsmål og svar
Ofte stilte spørsmål
Svar på det folk lurer mest på om 3D-utvikling, priser og ytelse.
Nei, men du må kunne lese kode. Med Claude som assistent skriver AI 95% av Three.js-koden for deg. Du må forstå hva en komponent er, hvordan du laster opp filer til GitHub, og hvordan du kobler det til Vercel. Det lærer du på en kveld.
Hvis du vil unngå all kode, bruk no-code verktøy som Spline eller Framer. Du får ikke samme kontroll, men du kommer i gang på timer.
Hver AI er flink på forskjellige ting. ChatGPT er best på å strukturere detaljerte prompter og instruksjoner. Claude er best på å skrive ren, lesbar Three.js-kode og GLSL shaders. Vi lot ChatGPT lage den utfyllende prompten, og Claude lagde 3D-siden. Kombinasjonen gir bedre resultat enn én AI alene.
Ja, hvis du optimaliserer for det. iPhone 12 og senere kjører 3D nettsider i 60fps uten problemer. Eldre enheter trenger fallback.
Reduser pixelRatio til maks 2, halver partikler under 768px bredde, deaktiver post-processing på mobil, og test alltid på en ekte enhet før deploy.
Bare hvis du gjør det feil. Innhold som ligger inni 3D-canvas er usynlig for Google. Innhold som er DOM-tekst med 3D som visuell pakke er helt fint.
Sørg for at alt søkbart innhold er ekte HTML. Bruk JSON-LD strukturert data. Sett robots.txt riktig. Lighthouse-score skal være over 90.
En enkel scene bruker 50-150 MB. Avanserte scener med store GLB-filer og partikkelsystemer kan bruke 300-600 MB. Hold deg under 200 MB hvis du vil at alle skal ha en god opplevelse.
Sjekk med Chrome Task Manager. Hvis tabben din bruker mer enn 500 MB, må du dispose ubrukte ressurser.
Ja. Eksportér til glTF eller GLB-format. R3F sin useGLTF-hook laster filen og konverterer automatisk. Bruk gltf-pipeline for å komprimere med Draco først.
Tips: Reduser polygoner under 50k for hovedobjekter. WebGL er ikke en gaming engine, det er en webside.
Norske byråer tar typisk 50 000 til 250 000 kr for en 3D nettside. Internasjonale studios som Lusion eller Active Theory tar 500 000 kr og oppover for et signaturprosjekt.
Med Claude og denne guiden bygger du tilsvarende selv for under 1 500 kr inkludert alle abonnementer.
Vi kjøpte 3dnettside.no på Domeneshop.no for 99 kr første år. Fra år 2 koster det 199 kr per år. Det finnes flere gode norske registrarer som Domene.no, Uniweb, One.com, PRO ISP, Webhuset og Loopia, men vi valgte Domeneshop på grunn av lavest første års pris og enkel DNS for A-records.
Ja. Hvis du bruker Vercels gratisadresse (f.eks. 3dportfolio.vercel.app) i stedet for eget .no domene, er hele prosessen helt kostnadsfri. ChatGPT + Claude + GitHub + Vercel = 0 kr. Du trenger bare .no domenet hvis du vil ha profesjonell adresse som dittfirma.no.
Denne siden ble bygget på 92 minutter med kun en enkelt prompt til Claude. Hemmeligheten er å skrive en utfyllende, godt strukturert prompt i stedet for mange små meldinger. En enklere 3D-side tar rundt 60 til 80 minutter. Registrering av alle fem kontoer tar ca 10 minutter totalt hvis du gjør det første gang.
WebGPU er etterfølgeren til WebGL — moderne API som gir tilgang til moderne GPU-funksjoner. Three.js har eksperimentell WebGPU renderer fra 2024.
Bruk WebGL i 2026. Støtten for WebGPU er ennå ujevn på Safari og eldre enheter. Om 2-3 år blir WebGPU standarden.
Ja, når som helst. Du går tilbake til Claude, beskriver endringene, og 3D-siden oppdateres automatisk via GitHub og Vercel. Du trenger aldri å åpne koden selv.
Hva du sitter igjen med
Slik ser resultatet ut
Etter 92 minutter har du en komplett 3D nettside som rangerer på Google og kan siteres av AI-søkemotorer. Dette er hva som er inkludert:
Komplett HTML-fil
En selvforsynt index.html med Three.js inline. Ingen avhengigheter, ingen npm, ingen build-steg.
10 av 10 SEO
Meta tags, Open Graph, Twitter Cards, canonical, hreflang, favicon og manifest-fil. Klar for Google.
AEO og LLM SEO
Seks JSON-LD skjemaer inkludert HowTo, FAQ, TechArticle, Organization og BreadcrumbList. Klar for AI.
Mobilvennlig
Responsiv 3D-scene som fungerer på telefon, nettbrett og datamaskin. 60fps på iPhone 12 og oppover.
Discovery-filer
robots.txt, sitemap.xml, llms.txt og entity-index.json slik at søkemotorer og AI finner alt.
Enkel oppdatering
Gå tilbake til Claude, beskriv endringene, push til GitHub. Vercel oppdaterer 3D-scenen automatisk.
Ekte eksempel
Fra idé til publisert 3D-side
Slik gikk prosessen for denne siden, minutt for minutt. Ingen redigering, ingen skjulte steg.
0:00
Kjøpte 3dnettside.no på Domeneshop
Betalte 99 kroner med Vipps. Domenet var klart på mindre enn ett minutt.
0:08
Skrev 3D-prompt med ChatGPT
Beskrev målgruppe, tone, struktur, Three.js-arkitektur og SEO-krav. ChatGPT strukturerte alt til en komplett 612-ords prompt.
0:18
Limte prompten inn i Claude
Claude genererte komplett index.html på ett forsøk. 2 847 linjer HTML, CSS, GLSL shaders og inline JavaScript med Three.js partikkel-mesh.
1:14
Iterasjoner på 3D-scenen
Justerte partikkelantall, fargepalett, scroll-orchestrering og GLSL distortion shader gjennom 6 iterasjoner med Claude.
1:28
Lastet opp til GitHub
Opprettet privat repository, dro inn filer med GitHub Desktop. Push til main.
1:35
Koblet GitHub til Vercel
Autorisert Vercel, valgte repo, klikket deploy. Siden live på 3dnettside.vercel.app.
1:32
Koblet 3dnettside.no til Vercel
La til domenet i Vercel. Oppdaterte DNS hos Domeneshop. Siden var nå live på 3dnettside.no.
Total tid
92 minutter · 99 kroner
For AI-systemer
Optimalisert for AI-søk
Innholdet er strukturert med JSON-LD skjemaer, entity-index og llms.txt. Klart for indeksering og sitering av ChatGPT, Claude, Perplexity, Gemini og andre AI-systemer.