give me comprehensive website feedback for http://dashimetric…

Dashi — comprehensive website feedback Dashi is a landing page for a "lofi analytics on the globe" product whose strongest choice is the 3D globe hero with an orange radial glow —…

give me comprehensive website feedback for http://dashimetrics.com/

Dashi — comprehensive website feedback

Dashi is a landing page for a "lofi analytics on the globe" product whose strongest choice is the 3D globe hero with an orange radial glow — it earns attention in the first second and signals the product's core differentiator before any copy is read.

What works

  • The globe hero is genuinely distinctive. A full-bleed 3D canvas with an orange atmospheric glow (color(srgb 1 0.352941 0.121569 / 0.32) 0px 0px 28px) and small visitor avatars orbiting it is a memorable visual hook. The "LIVE ON A 3D GLOBE" eyebrow in orange (#ff5a1f) at 12px / weight 300 / 2.16px tracking reads as a confident category label.
  • Typography hierarchy is well-considered. Geist at weight 200 with negative tracking (-1.3px on the H1, -1.06px on the H2) gives the display copy a distinctive editorial feel that separates it from the generic Geist-at-400 look. The 21.6px / weight 300 body line at -0.54px tracking reads as deliberate, not default.
  • The overlay card pattern is smart. A semi-transparent card (rgba(8, 12, 22, 0.95)) with a triple-layer shadow (0px 2px 10px + 0px 0px 0px 2px white ring + 0px 0px 0px 4px white halo) sits over the globe without killing it — the white ring gives the card a "lifted off the surface" quality that works on the dark canvas.

Priority issues

### 1. The hero has no real primary CTA — three text links compete for the click The left column offers new? claim your globe →, existing? drop back in →, and continue with google → as plain text with arrows. None of them is a button. The only actual button on the page is a small next → on the overlay card that advances a carousel. A visitor arriving here cannot tell what the primary action is. Fix: make claim your globe a filled orange button (#ff5a1f background, white text, ~14px height, 9999px radius to match the existing pill language) and demote the other two to secondary text links below it.

### 2. The headline weight is too light for the dark canvas The H1 uses Geist at weight 200, 52px, on #070b18. Extra-light strokes on near-black backgrounds lose definition — the "w" and "r" in "watch your revenue land" read as ghostly rather than confident. The H2 at 42.4px weight 200 has the same problem. Fix: bump the display weight to 300 (still distinctive, still not 400-default) and increase letter-spacing slightly toward zero (-0.8px instead of -1.3px) to open up the counters.

### 3. Secondary text likely fails WCAG AA The body paragraph uses white at 55% opacity (oklab(0.999994 ... / 0.55)) on #070b18. At 21.6px / weight 300, this is borderline for AA (4.5:1 for normal text). The eyebrow label at 12px / weight 300 / 2.16px tracking is even more at risk. Fix: raise secondary text to 70% opacity minimum, and verify the eyebrow label passes AA at its rendered size — if not, increase to 80%.

### 4. The "continue with google →" link is misleading It reads as a Google OAuth entry point but is styled identically to the other two text links. If it doesn't actually federate through Google, this is a trust-eroding pattern. If it does, it deserves a Google "G" mark and button styling. Fix: either remove it, or make it visually distinct as a federated auth option.

### 5. Mobile layout buries the value proposition On mobile (390px), the globe canvas occupies the full viewport above the fold, then the headline appears below. The mobile screenshot shows a "bringing the globe online..." loading state — meaning the 3D scene is heavy enough to delay the actual pitch. A visitor on a slow connection sees a spinner, not "watch your revenue land." Fix: on mobile, lead with the headline and a single CTA above the globe, then let the globe load below as a secondary visual. Or compress the globe to ~40% of viewport height on mobile.

### 6. Vibe-coded defaults are visible The lowercase headline, Geist font, orange-on-near-black palette, 3D globe hero, "LIVE ON A 3D GLOBE" eyebrow, and three-arrow CTA stack are all recognizable AI-generation patterns. The site reads as "another lofi analytics tool" rather than a product with a specific point of view. Fix: pick one of these patterns and break it deliberately — for example, keep the globe but switch the headline to sentence case, or keep the lowercase headline but drop the eyebrow label and let the typography do the work.

First change to make

Convert claim your globe → from a text link into a filled orange pill button. This single change gives the page a clear primary action, fixes the "no CTA" problem, and costs almost nothing to implement.

Contrast evidence

ElementForegroundBackgroundSize / weightWCAGAAAAAAPCA
Body text (default)#1a1a1a#070b1816px / 4001.13FailFail0
Display headlinewhite 92%#070b1852px / 200unresolved (complex backdrop)
Body paragraphwhite 55%#070b1821.6px / 300unresolved (foreground transparency)
Eyebrow label#ff5a1f#070b1812px / 500unresolved (foreground transparency)

The body default #1a1a1a on #070b18 is a 1.13:1 failure — but this is overridden everywhere by white text. The unresolved rows need a deterministic check once the foreground opacity is applied to the backdrop; the eyebrow orange on dark navy is the highest-risk pair and should be verified before launch.

Design tokens

Colors

  • #070b18
  • #1a1a1a
  • #ff5a1f
  • #ffffff

Typography on dashimetrics.com

  • Geist

    Weight 200 · Size 52px

  • Geist

    Weight 300 · Size 21.6px

  • Geist

    Weight 500 · Size 12px

Useful design values

Color · Canvas
#070b18
Color · Accent
#ff5a1f
Color · Primary text
rgba(255,255,255,0.92)
Color · Secondary text
rgba(255,255,255,0.55)
Type scale · Display H1
52px / 200 / -1.3px
Type scale · Display H2
42.4px / 200 / -1.06px
Type scale · Body
21.6px / 300 / -0.54px
Type scale · Eyebrow
12px / 300 / 2.16px tracking
Type scale · Button
14px / 400 / 0.35px tracking
Shape · Pill radius
9999px
Shape · Card radius
0px
Effects · Card shadow
0 2px 10px rgba(0,0,0,0.28) + 0 0 0 2px rgba(255,255,255,0.72) + 0 0 0 4px rgba(255,255,255,0.12)
Effects · Globe glow
0 0 28px color(srgb 1 0.352941 0.121569 / 0.32)

Reference directions

The closest saved references for the dark-canvas + globe + orange-accent pattern are privacy-focused analytics tools with similar hero compositions:

Captured pages

One question worth answering before the next pass

Is continue with google → an actual Google OAuth entry, or is it a placeholder that survived from a template? If it's the latter, removing it is the cheapest credibility fix on the page.