Voicenotes

Item: Voicenotes
Rating: 7.2

AI notetaker that records meetings and turns them into notes and answers.

voicenotes.com Save page

7.2/10MABTU rating

DESKTOP · 1440 × 7,233/ ↗

MOBILE · 390

Section outline · Home

01heroSerif headline, two CTAs, product window over painted sky812
02logo cloudSingle row of grey logos113
03processThree numbered step cards with UI crops544
04featuresTwo-by-two product windows over photo backgrounds1,413
05featuresFaded note grid behind an ask input623
06featuresFour small icon tiles
07testimonialsThree-column masonry of user quotes
08ctaAward laurels, integration icons, centred CTA436
09footerFour link columns and social icons

Rating · Home

Visual design7.8

UX & clarity7.5

Originality7.2

Craft & consistency7.5

Motion5.5

Performance & a11y5.7

This page scores 7.2; the site score weights the home page double.

Main colours

Light·off white background·mono

Typography

Instrument Serifheading · serif · google Interbody · sans · self-hosted

Stack & style

Vue Nuxt Tailwind CSS

Minimal Editorial Product-UI-led Logo cloud Marquee Process steps Sticky header

Also: PostHog, Meta Pixel, Cloudflare, Google Analytics, Google Tag Manager

Design DNA

Off-white canvas, a condensed light serif display face for every headline with one italic parenthetical word, and small grotesque body text. The hero splits headline and black pill CTAs left with a rounded product window floating over a vivid painted sky right. Three numbered step cards show recording UI, then feature pairs set product windows over flower and marble photography. A faded grid of note cards sits behind an ask bar, then four small security tiles, a dense testimonial masonry, award laurels and a centred closing CTA.

Worth borrowing

Set a single italic word in parentheses inside a condensed serif headline to add voice.
Float plain product windows over saturated painted-sky or botanical photos instead of gradients.
Explain the flow with three numbered small cards, each a cropped UI state.