Brieflaunch page for an AI note-taking startup
Direction
An AI note-taking launch laid out like a botanical specimen sheet
Twist house rule: every other section inverted
- Signature
- The hero section built like a botanical specimen sheet.
- Type
- A classic book serif for display at clamp(48px, 8vw, 120px), a plain sans for body at 18px.
- Color
- Warm amber glow on deep brown; text at 4.5 to 1 contrast or more.
- Layout
- Every other section flips to inverted color, on a 12 column grid with fluid type.
- Texture
- A soft paper grain on flat color.
- Motion
- Soft 250ms eases, like paper settling, and none with reduced motion on.
- Avoid
- A hero with no clear first action. Body text wider than 75 characters. Scroll jacking.
Other directions from the same bend
- An AI note-taking launch in soap bubble film
- An AI note-taking launch in Googie 1958
- An AI note-taking launch as a newsprint paper gig poster
Art direction 4
Herbarium Sheet Image, on pinterest.com (opens in a new tab)Steal One specimen centred on the sheet, label in the bottom corner.
herbarium sheet, on pinterest.com (opens in a new tab)Steal Lots of empty paper around a single small object.
Herbarium Specimens, on pinterest.com (opens in a new tab)Steal The colour checker strip as a quiet divider.
Kristin Ellen Martin Hockman on Instagram: “Antique Swedish..., on pinterest.com (opens in a new tab)Steal Faded inks and handwritten labels for captions.
UI references 8
Editorial Hero Section for Photography Studio Website (Antonio Galinec), on dribbble.com (opens in a new tab)Steal The serif headline that breaks into italics mid line.
Wootten: Cordwainer & Leather Craftsmen, on httpster.net (opens in a new tab)Steal Objects laid out like pinned specimens, with a tiny label in the middle.
ITB Worldwide, on siteinspire.com (opens in a new tab)Steal One calm sentence with the key words set in italic.
YCN Studio, on httpster.net (opens in a new tab)Steal A plain index list of past work as the whole left column.
Input Logic, on siteinspire.com (opens in a new tab)Steal The inverted section: light type on deep color for one screen.
Josephmark, on httpster.net (opens in a new tab)Steal Navigation as giant type, with one word struck through.
AI Website Builder Landing Page UI (Naasmind), on dribbble.com (opens in a new tab)Steal The feature grid, to calm down with a serif and a paper tone.
CASA NERO: Fashion Website Design (Editorial Landing Page) (Elux Space), on dribbble.com (opens in a new tab)Steal Black and white photos cropped hard into a magazine grid.
A dark nav over an editorial serif hero, specimens as cards, the index list as proof, the menu as a footer.
Parts and sources
- Nav Input Logic, siteinspire.com (opens in a new tab) Pill nav and one call to action on the right.
- Hero Editorial Hero Section for Photography Studio Website, dribbble.com (opens in a new tab) Serif and italic headline next to one photo.
- Cards Wootten: Cordwainer & Leather Craftsmen, httpster.net (opens in a new tab) Each feature pinned like a specimen.
- Content YCN Studio, httpster.net (opens in a new tab) The index list, as the proof column.
- Features AI Website Builder Landing Page UI, dribbble.com (opens in a new tab) Keep the grid, swap the icons for line drawings.
- Footer Josephmark, httpster.net (opens in a new tab) The menu set huge, as the last screen.

































































