Skip to content

landing-update: one-sentence promise, app-window demo and AI section - #12

Merged
GopkoDev merged 31 commits into
mainfrom
feat/landing-update
Oct 17, 2026
Merged

landing-update: one-sentence promise, app-window demo and AI section#12
GopkoDev merged 31 commits into
mainfrom
feat/landing-update

Conversation

@GopkoDev

@GopkoDev GopkoDev commented Oct 17, 2026

Copy link
Copy Markdown
Owner

Summary

The landing page now leads with the one-sentence promise and shows it happen. The first screen says "Your next invoice is one sentence away". On desktop the promise sits on the left and a Landing demo on the right. The demo is drawn as an AI chat window: it types an example sentence, sends it, and shows a draft proposal card whose Create button is never pressed. A new AI section right after the first screen states what the AI does and never does, and names the AI tools that can connect today. The demo calls no model and reads no data. This is a temporary bridge until public-redesign.

Spec: docs/features/landing-update/spec.md. Changelog: _ship/changelog.md. Review: _review/review-2026-10-17.md (PASS, F1–F10 fixed).

Post-review redesign. After the review PASS, the owner asked for a better-looking demo. e2568b44 redraws it as an app window: a title bar with the Example badge, the sentence typed into the message box and sent as a bubble, an assistant row with thinking dots and a one-line reply, and card rows that rise in turn. It also puts the hero in two columns on desktop. The player logic, phases, timings, box-size rule, CSS-only fallbacks, Replay and sign-in links are unchanged. It adds four copy fields to landingContent, all covered by the claims guard. The clean-context reviewer did not re-review this commit. All landing unit, component and e2e checks pass on it, and the Linux baselines were re-taken (a930244f).

Acceptance criteria

  • AC-01: promise, supporting line and account button above the fold on 360×640 and 1280×800; no stats row ✓
  • AC-02: the demo plays once at 50 % visible, finishes in 4.6 s, does not restart on scroll-back, and Replay plays it again ✓
  • AC-03: fixed sample content only; the window and Create lead to sign-in in every phase; Replay only replays ✓
  • AC-04: the finished picture shows for reduced motion, without scripts, and after 3 s without a start; same box ✓
  • AC-05: no text says the AI issues, sends, edits or creates a Customer, and nothing promises unlimited AI use ✓
  • AC-06: the AI section after the first screen, with its limits, the privacy link and its own account button ✓
  • AC-07: names exactly Claude Desktop, Claude Code and Cursor; states the draft permission; the technical name appears at most once, in small print ✓
  • AC-08: the account buttons and the AI navigation link lead to sign-in ✓
  • AC-09: the h1 comes first, the demo has a text equivalent, keyboard focus is visible and never trapped, and there is no sideways scroll at 360 px ✓
  • AC-10: a signed-in Freelancer is redirected to the dashboard ✓
  • AC-11: automated checks plus refreshed Linux visual references (light and dark, phone and desktop) ✓
  • AC-12: the description, og and twitter text mention an invoice draft from one sentence with AI ✓

Design

  • Spec: docs/features/landing-update/spec.md
  • Architecture: docs/features/landing-update/sad.md
  • Decisions: docs/features/landing-update/adr/ (ADR-0001 demo card replica, ADR-0002 server-rendered start frame + CSS-only fallbacks)
  • Screens: docs/features/landing-update/screens.md
  • Data model / API: none. No datastore, route handler or server action (sad.md §2).

Tasks (SDD-Task trailers)

  • T01 1fd953e8: landing copy, demo sample, claims truth guard
  • T02 ea8bdd8e, f5c4ac94: first-load JS baseline; preview-deploy guard
  • T03 0dd14755: DemoDraftCard replica
  • T04 cb7be9d6: LandingDemo player
  • T05 3b645332, d2f85cf2: finished-still fallbacks and reveal timing
  • T06 7931556a: LandingHero around the promise and demo
  • T07 5b9529bd: AiSection and the #ai navigation link
  • T08 a6874ef6: landing metadata
  • T09 d8ddf059: landing e2e spec
  • T10 0d10570b, 76dd0220: axe, Linux visual references, JS budget
  • T11 634a59f2: design-system inventory
  • T12–T16 5818ea7f, 11a83dfa, 9f7e7450, 8f9e0032, 78df10a7, 2fe1ba15: review fixes F1–F10
  • Post-review: e2568b44 app-window demo and two-column hero; a930244f Linux baselines re-taken

Verification

  • Unit: pnpm test 3574/3574 ✓
  • Integration: pnpm test:integration 1632 passed, 61 skipped ✓
  • Lint + typecheck: pnpm lint 0 errors (6 old warnings); tsc --noEmit clean ✓
  • e2e: full local CI=1 pnpm test:e2e 192 passed, 12 skipped, 0 failed (9.0 min) ✓. Landing spec on the host: 33 passed, 5 skipped (Linux-only baselines). The 4 Linux baselines matched in mcr.microsoft.com/playwright:v1.63.0-noble twice without --update-snapshots.
  • JS budget: the demo adds 3.9 KB of the allowed 30 KB of compressed first-load JS.
  • Ran the feature: signed out on the dev server with a browser script:
    • AC-01: at 360×640 the h1 is the promise and the account button is inside the viewport. There is no stats row and no sideways scroll (scrollWidth 360).
    • AC-02: the demo went from typing to the finished card in 4.8 s, and Replay showed up.
    • AC-03: play plus Replay sent no non-GET request and no /api request. Replay kept the URL at /. Pressing Create while the sentence was still typing went to /login.
    • AC-04: with reduced motion the demo opened in still with the bubble at full opacity and no Replay.

Operational notes

  • Migration: none.
  • Feature flag / config: none.
  • Rollback: revert the merge and redeploy; no stored state.

🤖 Generated with Claude Code

GopkoDev and others added 30 commits October 16, 2026 21:52
@GopkoDev @claude
spec: landing-update
6c782ce 
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
clarify: landing-update — 10 resolved, 0 deferred
7de6135 
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
design: landing-update sad §1–§12 + ADR-0001, ADR-0002 (quick)
7056412 
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
design: landing-update finalization (critic pass)
b53c504 
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
sequences: landing-update runtime flows
114ac03 
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
screens: landing-update manifest
e123616 
Also commits ux-flows.md (aligned US-06 tab order with the DOM order).

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
tasks: landing-update (breakdown + tasks.json)
4221304 
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
test(landing-update): record landing first-load JS baseline
ea8bdd8 
Measurer sums transferred compressed script bytes on / from a production
build; baseline 400320 B at 4221304 for the 30 KB budget check (T10).

SDD-Task: T02

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
feat(landing-update): add landing copy, demo sample and claims truth …
1fd953e 
…guard

New hero/demo/aiSection/metadata copy in landingContent; unit test pins
the AI claim rules and the fixed demo sample.

SDD-Task: T01
SDD-AC: AC-05
SDD-AC: AC-06
SDD-AC: AC-07

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
feat(landing-update): add DemoDraftCard presentational replica
0dd1475 
Static copy of the chat draft proposal card: fixed sample, Example badge,
unpressed Create visual, nothing focusable, no components/ai import.

SDD-Task: T03
SDD-AC: AC-02
SDD-AC: AC-03
SDD-AC: AC-05

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
feat(landing-update): add LandingDemo player
cb7be9d 
Plays once at >= 50% visibility, finishes in 4.6 s, Replay at done,
two sign-in links over the card, sr-only text equivalent, no fetch.

SDD-Task: T04
SDD-AC: AC-02
SDD-AC: AC-03
SDD-AC: AC-09

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
feat(landing-update): add demo finished-still fallbacks and reveal ti…
3b64533 
…ming

noscript, reduced-motion and 3 s load/visibility CSS reveals show the
finished still in the same box; armed/visible attributes, late-hydration
branches and a test-only hold hook in the player.

SDD-Task: T05
SDD-AC: AC-04

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
feat(landing-update): rewrite LandingHero around the promise and demo
7931556 
One h1 with the one-sentence promise, supporting line, sign-in account
link and the LandingDemo; stats row and old headline copy removed.

SDD-Task: T06
SDD-AC: AC-01
SDD-AC: AC-09

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
feat(landing-update): override landing metadata with the one-sentence…
a6874ef 
… promise

Landing description, openGraph and twitter come from landingContent.metadata;
root-layout openGraph/twitter fields restated against the shallow merge.

SDD-Task: T08
SDD-AC: AC-12

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
feat(landing-update): add AiSection after the hero and #ai nav link
5b9529b 
Three blocks (does / never / own tools), MCP only in small print,
privacy and sign-in links only; nav gains an AI link to #ai.

SDD-Task: T07
SDD-AC: AC-06
SDD-AC: AC-07
SDD-AC: AC-08

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
docs(landing-update): register LandingDemo, DemoDraftCard and AiSection
634a59f 
Design-system component inventory rows; screens.md marks them registered.

SDD-Task: T11
SDD-AC: AC-02
SDD-AC: AC-06

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
fix(landing-update): keep noscript out of the demo flex flow
d2f85cf 
With scripts off the empty noscript added a 12 px flex gap, so the
finished still was taller than the played box (found by T09 e2e).

SDD-Task: T05
SDD-AC: AC-04

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
test(landing-update): add landing e2e spec
d8ddf05 
First screen, demo timing and four still fallbacks, no data requests,
sign-in links, keyboard, signed-in redirect and metadata on a
production build (27 chromium tests).

SDD-Task: T09
SDD-AC: AC-01
SDD-AC: AC-02
SDD-AC: AC-03
SDD-AC: AC-04
SDD-AC: AC-08
SDD-AC: AC-09
SDD-AC: AC-10
SDD-AC: AC-11
SDD-AC: AC-12

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
fix(landing-update): footer contrast, centred demo, aligned Customer row
0d10570 
axe flagged the opacity-70 footer disclaimer (serious contrast); the demo
sat at the hero's left edge on desktop and the Customer row was indented
and wrapped on phones (found by T10 e2e). Phone CTA margin keeps the demo
below 50 % visible on load.

SDD-Task: T10
SDD-AC: AC-09
SDD-AC: AC-11

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
test(landing-update): axe, Linux visual references and JS budget for …
76dd022 
…the landing

axe 0 serious/critical at phone/desktop light/dark; 4 Linux baselines of
the finished demo; first-load JS delta 2.4 KB vs the T02 baseline (<= 30 KB).

SDD-Task: T10
SDD-AC: AC-09
SDD-AC: AC-11

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
fix(landing-update): move the preview-deploy guard into the baseline …
f5c4ac9 
…spec; product name in brief

The recorder's BASE_URL read in scripts/ tripped the env.example scan;
the e2e side now refuses via BASE_URL_OVERRIDE. idea-brief used the old
working name.

SDD-Task: T02

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
fix(landing-update): judge late hydration from the CSS reveal, keep t…
5818ea7 
…he still, fall back without IntersectionObserver

Review F1/F2: lateness now comes from the bubble's computed opacity instead of
performance.now(); a late player sets data-late with armed so the still never
drops to opacity 0 or re-fades; no IntersectionObserver ends in the still.
Adds review record and fix tasks T12–T15.

SDD-Task: T12
SDD-AC: AC-02
SDD-AC: AC-04

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
fix(landing-update): Example label on the demo box in every phase; ca…
11a83df 
…rd labels from landingContent

Review F3/F6: a box-level Example badge sits above the bubble so the demo is
marked as an example from the start frame; DemoDraftCard's title, Customer
and Total labels move into LandingDemoSample and the truth guard.

SDD-Task: T13
SDD-AC: AC-02
SDD-AC: AC-05

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
fix(landing-update): render AiSection's privacy link from content; co…
78df10a 
…rrect its inventory entry

Review F7/F8: AiSection takes privacyLink.href instead of hard-coding
legalRoutes.privacy, so the claims test guards the rendered value; the
design-system row no longer calls it a server component.

SDD-Task: T15
SDD-AC: AC-06

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
fix(landing-update): keep Replay mounted without stealing focus; purp…
8f9e003 
…ose-bearing card link name

Review F4/F5: Replay stays in the DOM (aria-disabled) during a replay so focus
is never dropped or pulled back; the card overlay link reads
"Example draft for Acme Corp: get started" from landingContent.

SDD-Task: T14
SDD-AC: AC-09

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
test(landing-update): re-take the Linux landing baselines after the b…
9f7e745 
…ox-level Example label

The demo box gained a header row (review F3), so the 4 finished-demo
baselines are redrawn in mcr.microsoft.com/playwright:v1.63.0-noble and
matched in two further runs without --update-snapshots.

SDD-Task: T13
SDD-AC: AC-11

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
fix(landing-update): replay from a late still starts from the start f…
2fe1ba1 
…rame; aria-disabled Replay looks disabled

Re-review F9/F10: replay() clears data-late so the finished frame no longer
lingers and fades under the typing; Replay dims while aria-disabled and stays
focusable.

SDD-Task: T16
SDD-AC: AC-02
SDD-AC: AC-09

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
review(landing-update): fix pass + re-review, PASS
795f7bd 
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
feat(landing-update): redraw the demo as an app window and put the he…
e2568b4 
…ro in two columns

The demo now looks like the in-app chat: a window with a title bar and the
Example badge, the sentence typed into the composer and sent as a bubble, an
assistant row with thinking dots and a short reply, and the draft card whose
rows rise in turn. The start frame shows an empty-chat prompt. On desktop the
hero puts the promise left and the window right. Box size, the CSS-only
finished-still fallbacks, Replay and the sign-in links are unchanged.

SDD-AC: AC-02
SDD-AC: AC-04
SDD-AC: AC-09

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
test(landing-update): re-take the Linux landing baselines after the a…
a930244 
…pp-window demo

The 4 finished-demo baselines are redrawn in
mcr.microsoft.com/playwright:v1.63.0-noble and matched in two further runs
without --update-snapshots.

SDD-AC: AC-11

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@GopkoDev @claude
ship(landing-update): changelog, PR body, project changelog entry
a278865 
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@vercel

vercel Bot commented Oct 17, 2026 •
edited
Loading

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment
Project Deployment Actions Updated
invoice-forge Ignored Ignored Oct 17, 2026 12:26am UTC

@GopkoDev
GopkoDev merged commit 1664960 into main Oct 17, 2026
4 checks passed
@GopkoDev
GopkoDev deleted the feat/landing-update branch October 20, 2026 13:34
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

1 participant

@GopkoDev