OSVauco/docs/vauco-site/DESIGN.md

9.2 KiB
Raw Blame History

vauco.no — Design & build-spec for V1 (MVP)

Eier: Chris Christiansen Sist oppdatert: 2026-05-31 Status: 🟡 Spec klar — venter på V1a (repo-opprettelse) Trigger for å starte build: Etter Fase 8 approved, eller parallelt hvis Chris vil

Plassering av denne filen: Mens vauco-site-repoet ikke finnes ennå, lever spec'en her i OSVauco. Når vauco-saas/vauco-site opprettes (V1a), flyttes denne filen dit som README.md eller DESIGN.md.


1. Hva siden er

Vauco AS sin offisielle bedriftsside på vauco.no. Ett formål: lede besøkende videre til riktig salgs-modul og samtidig svare på "hvem er Vauco?".

Det er ikke en produktside. Det er ikke en blogg. Det er en portal.


2. Sidekart V1

vauco.no/                          (hovedside — én lang side, ankerlenker)
├── #hero
├── #moduler                       Grid av salgs-moduler
├── #hvorfor
├── #om
├── #kontakt
└── footer

vauco.no/personvern.html           GDPR personvernerklæring
vauco.no/vilkar.html               Standardvilkår for kunder
vauco.no/sitemap.xml
vauco.no/robots.txt

V1 er én HTML-fil + 2 statiske underdokumenter. Ikke noe mer.


3. Innhold per seksjon (utkast — Chris godkjenner copy)

#hero

  • H1: "Vauco bygger AI-moduler som leverer målbar verdi."
  • Sub: "Norskutviklet. Drevet på Google Cloud. Lansert av operatører som faktisk har drevet plattformer i produksjon."
  • CTA primær: "Se CostGuard →" (anchor til #moduler eller direkte til costguard.oss.vauco.no)
  • CTA sekundær: "Snakk med Chris →" (mailto:chris.christiansen@vauco.no)

#moduler (kjernen — grid med kort)

Kort Status Lenke
CostGuard — AI-drevet GCP-kostnadsovervåkning. Stopp surprise-regninger før de skjer. 🟢 Live costguard.oss.vauco.no
Threadstone — Generativ AI-assistent for innhold som leverer. 🟡 I pilot threadstone.vauco.no
Modul #3Coming soon. Meld deg på for tidlig tilgang. Q4 2026 (mailto med subject "Modul 3 interesse")

#hvorfor (3 punkter, ikke flere)

  1. Norsk eierskap, norsk drift. Data forblir i EU. Vauco AS er norsk-registrert (org.nr 935 989 779).
  2. GCP-ekspertise i bunn. Vi har bygget og driftet Google Cloud-plattformer profesjonelt. Det er ingen tilfeldighet at CostGuard er første produkt.
  3. AI som ikke er hype. Hver modul har en konkret jobb og et målbart utfall. Hvis vi ikke kan vise ROI, lanserer vi den ikke.

#om

  • Bilde av Chris (kan tas opp senere — V1 kan kjøre uten)
  • Kort tekst: "Vauco AS er grunnlagt av Chris Christiansen i Oslo, 2026. Vi bygger AI-moduler for nordiske bedrifter."
  • LinkedIn-lenke

#kontakt

  • chris.christiansen@vauco.no
  • LinkedIn
  • Oslo, Norge
  • (Telefon kun ved forespørsel — ikke list åpent)
  • Vauco AS · Org.nr 935 989 779
  • Lenker: Personvern · Vilkår · Status (placeholder, peker til status.vauco.no når live)
  • © 2026 Vauco AS

4. Visuell retning

Stil-anker

Bygger videre på threadstone-landing/index.html sin estetikk:

  • Mørk bakgrunn (#0a0a0a eller lignende)
  • Lys tekst (#f5f5f5)
  • Monospace for kodeaksenter / labels / footer ('JetBrains Mono', 'SF Mono', fallback ui-monospace)
  • Sans-serif for body: Inter / SF Pro Display / system-ui

Farger

Rolle Hex Bruk
Bakgrunn #0a0a0a <body>
Tekst primær #f5f5f5 H1, body
Tekst sekundær #a0a0a0 Sub-text, captions
Aksent — Vauco #e8d4a3 (varm sand/gull, samme som Threadstone) Lenker, CTA-knapp
Aksent — CostGuard TBD (foreslå grønn/blå, ikke samme som Vauco-aksent) Kun på CostGuard-kortet
Aksent — Threadstone TBD (foreslå lilla/rose) Kun på Threadstone-kortet
Border rgba(255,255,255,0.08) Kort-borders

Typografi

  • H1: 4864px, weight 600, line-height 1.1
  • H2: 3240px, weight 500
  • Body: 1618px, line-height 1.6
  • Monospace caption: 13px, uppercase letter-spacing 0.1em

Layout

  • Maks bredde: 1100px, sentrert
  • Padding: 24px på mobil, 48px på desktop
  • Grid på #moduler: 1 kolonne mobil, 2 kolonner tablet, 3 kolonner desktop
  • Vertikal rytme: 96px mellom hovedseksjoner

Mobile-first

Chris demoer fra telefon. Side må fungere perfekt på iPhone 13/14/15. Test både portrait og landscape.

Performance-mål

  • Lighthouse: Performance ≥95, Accessibility ≥95, Best Practices ≥95, SEO ≥95
  • Total page size <100KB (uten bilder)
  • Ingen tracking-piksler i V1
  • Ingen tredjepartsfonter — bruk system-stack med fallback (eller selvhostet Inter via woff2)

5. Teknisk

Stack

  • HTML5 + CSS3 (vanilj — ingen framework)
  • Ingen JavaScript i V1 (eller maks 1 KB for smooth-scroll på ankerlenker)
  • GitHub Pages for hosting
  • GitHub Actions for valider-og-deploy (auto-deploy på push til main)

Filstruktur i vauco-site/ repo

vauco-site/
├── index.html
├── personvern.html
├── vilkar.html
├── style.css                  (kan inline-es i index.html for V1)
├── assets/
│   ├── favicon.svg
│   ├── og-image.png           (1200x630, Open Graph)
│   └── (evt. Chris-portrett)
├── CNAME                      (innhold: vauco.no)
├── robots.txt
├── sitemap.xml
└── README.md                  (denne filen flyttes hit)

Meta-tags (kritisk for SEO + sosial deling)

<title>Vauco — AI-moduler som leverer målbar verdi</title>
<meta name="description" content="Vauco AS bygger AI-moduler for nordiske bedrifter. CostGuard for GCP-kostnader. Threadstone for innhold.">
<meta property="og:title" content="Vauco — AI-moduler som leverer">
<meta property="og:description" content="Norskutviklet. Drevet på Google Cloud. Norsk eierskap.">
<meta property="og:image" content="https://vauco.no/assets/og-image.png">
<meta property="og:url" content="https://vauco.no">
<meta name="twitter:card" content="summary_large_image">
<link rel="canonical" href="https://vauco.no">

DNS-endringer (i Proisp)

Record Type Verdi
@ (apex) A 185.199.108.153 (GitHub Pages)
@ (apex) A 185.199.109.153
@ (apex) A 185.199.110.153
@ (apex) A 185.199.111.153
www CNAME vauco-saas.github.io.

Eksisterende A-records (Proisp-parking 104.37.38.95, 104.37.39.71) må fjernes.

Email-records (V1e — samme runde)

Record Type Verdi
@ TXT "v=spf1 include:_spf.google.com ~all"
google._domainkey TXT (hent fra Google Workspace Admin → Apps → Gmail → Authenticate email)
_dmarc TXT "v=DMARC1; p=quarantine; rua=mailto:dmarc@vauco.no; pct=100"

6. Akseptkriterier for V1

Før V1 kan kalles ferdig:

  • https://vauco.no viser ny side (ikke "Under construction")
  • https://www.vauco.no viser samme side (eller redirect til apex)
  • Lighthouse mobil: alle 4 ≥95
  • OG-bilde rendrer korrekt i LinkedIn-deling (test via LinkedIn Post Inspector)
  • CostGuard-kort lenker til costguard.oss.vauco.no og kortet åpnes som ny tab
  • Threadstone-kort lenker til threadstone.vauco.no
  • personvern.html og vilkar.html finnes og er lenket fra footer
  • SPF + DKIM + DMARC verifisert via mxtoolbox.com — alle grønne
  • Sitemap pinget til Google Search Console
  • Chris signer av visuelt — V1 APPROVED

7. V2 og videre — ikke bygg ennå

Bare for kontekst:

  • V2: CostGuard ROI-kalkulator inline på siden, første case study
  • V3: Blogg/innsikter (vauco.no/innsikt/), kundereferanser, live status-widget
  • V4: /en engelsk versjon, Proof of Curiosity i footer

8. Bygg-rekkefølge for V1 (når du eller en agent starter)

# 1. Opprett repo
gh repo create vauco-saas/vauco-site --public \
  --description "vauco.no — Vauco AS salgsportal" \
  --add-readme

# 2. Klon, lag struktur
git clone https://github.com/vauco-saas/vauco-site.git
cd vauco-site
# (kopier denne DESIGN.md inn som README.md)
# (bygg index.html, personvern.html, vilkar.html, CNAME, robots.txt, sitemap.xml)

# 3. Sett CNAME-fil
echo "vauco.no" > CNAME

# 4. Push
git add -A
git commit -m "feat: Vauco AS apex-side V1 MVP"
git push origin main

# 5. Aktiver Pages: Settings → Pages → Source: main / root
# 6. Vent på SSL-sertifikat (kan ta 24t første gang)

# 7. Endre DNS i Proisp (se tabell §5 over)
# 8. Vent på DNS-propagering, verifiser med:
dig +short vauco.no A
# Forventet: 185.199.108-111.153

# 9. Sjekk SSL:
curl -sI https://vauco.no | head -5
# Forventet: HTTP/2 200, server: GitHub.com

9. Referanser


Denne spec'en flyttes til vauco-saas/vauco-site/README.md så snart V1a er gjennomført.