# https://www.wonderful.ai/

[Open the live Fudge conversation](https://design.withfudge.com/share/1hara6n94o/https_www_wonderful_ai/)

Last updated: 2026-08-15

```fudge_website_review
{"schemaVersion":1,"reviewKind":"initial","state":"complete","target":{"submittedUrl":"https://www.wonderful.ai/","finalUrl":"https://www.wonderful.ai/","canonicalOrigin":"https://www.wonderful.ai/"},"score":5,"scoreTitle":"Soft hierarchy","explanation":"Wonderful has a confident editorial shell, strong type pairing, and credible enterprise proof. But major retained contrast failures affect the hero and platform sections, while the long page delays a concrete product path and primary action. Mobile preserves the story but makes it scroll-heavy.","categories":[{"id":"purpose_clarity","score":5,"summary":"Enterprise positioning is clear, but the first screen delays the product mechanism and next step.","findingIds":["f1","f3"]},{"id":"visual_hierarchy","score":6,"summary":"Oversized type and dark/light section changes create rhythm, but proof and platform content compete.","findingIds":["f2","f3"]},{"id":"readability_accessibility","score":3,"summary":"Hero, platform, and muted-label contrast failures plus aggressive tracking weaken reading.","findingIds":["f1","f2"]},{"id":"consistency_polish","score":6,"summary":"ABC Favorit Light and Inter create coherence, but repeated cards blunt the finish.","findingIds":["f3","f4"]},{"id":"mobile_experience","score":5,"summary":"Mobile retains the core story, but the long stacked narrative dilutes CTA priority.","findingIds":["f3","f5"]}],"strongest":{"title":"Distinctive editorial type system","summary":"ABC Favorit Light paired with Inter gives the site a credible, art-directed enterprise feel. Dark case-study and platform sections create useful pacing when their text layers are correctly placed.","evidenceIds":["ev-fonts","ev-type","ev-target-desktop"]},"findings":[{"id":"f1","number":1,"priority":"high","title":"Repair the hero and dark-section text layers","preview":"Retained text/backdrop pairs resolve to approximately 1.0–1.05:1, including near-white text against white and black text against #080808.","detailAccess":"included","evidenceMappingIds":["map-387676f62660f8e7bf4c8be740470ca5"],"referencePinIds":[]},{"id":"f2","number":2,"priority":"high","title":"Stop squeezing the display type","preview":"The H1 uses 82px / 86.1px with -4.92px tracking; multiple headings are flagged for overly tight tracking and leading.","detailAccess":"included","evidenceMappingIds":[],"referencePinIds":[]},{"id":"f3","number":3,"priority":"high","title":"Make the product path concrete earlier","preview":"The homepage moves through industries, cases, platform, deployment, and transformation before prioritizing one buyer action.","detailAccess":"included","evidenceMappingIds":[],"referencePinIds":["1418","1690","8739"]},{"id":"f4","number":4,"priority":"medium","title":"Reduce template-like card repetition","preview":"Industry and case-study groups repeat similar image/title/body/link units, making distinct proof feel like a catalog.","detailAccess":"included","evidenceMappingIds":[],"referencePinIds":["1418","8839"]},{"id":"f5","number":5,"priority":"medium","title":"Tighten the mobile narrative","preview":"Mobile keeps the full sequence but turns the homepage into a long scroll with repeated section CTAs.","detailAccess":"included","evidenceMappingIds":[],"referencePinIds":["1690","8739"]}],"foundation":{"decision":"page_changes_first","title":"Fix the homepage proof path first","explanation":"The largest problems are bounded to the homepage hero, dark-section text layers, and sequencing. Establish one readable, proof-led path before changing the broader system.","findingIds":["f1","f3","f5"],"affectedAreas":["accessibility_interaction","typography","color","spacing_layout","responsive_behavior"]}}
```

```fudge_review_map
{"schemaVersion":1,"frames":[{"frameId":"frame-desktop-home","inspectionId":"f51a3e5a-e4e7-4b09-813c-52fb6fbb14c3","pageUrl":"https://www.wonderful.ai/","pageTitle":"www.wonderful.ai","viewport":"desktop","screenshotUrl":"https://api.withfudge.com/v1/shares/95c140da-ada4-4f89-a04a-27b83301f698/attachments/ad46f151f5b2c1875eb2c8ec/1.jpg","screenshotWidth":1440,"screenshotHeight":6000,"completeness":"truncated","markers":[{"findingId":"f1","findingNumber":1,"findingTitle":"Repair the hero and dark-section text layers","mappingId":"map-387676f62660f8e7bf4c8be740470ca5","region":{"x":416,"y":1246,"width":1703,"height":144,"scale":10000}}]},{"frameId":"frame-mobile-home","inspectionId":"3523cd20-5395-4761-9cf6-a66fe00f09da","pageUrl":"https://www.wonderful.ai/","pageTitle":"www.wonderful.ai","viewport":"mobile","screenshotUrl":"https://api.withfudge.com/v1/shares/95c140da-ada4-4f89-a04a-27b83301f698/attachments/ad46f151f5b2c1875eb2c8ec/2.jpg","screenshotWidth":390,"screenshotHeight":6000,"completeness":"truncated","markers":[]},{"frameId":"frame-desktop-platform","inspectionId":"4d9a676b-3673-4073-b202-e6aa1c145a0a","pageUrl":"https://www.wonderful.ai/platform","pageTitle":"www.wonderful.ai","viewport":"desktop","screenshotUrl":"https://api.withfudge.com/v1/shares/95c140da-ada4-4f89-a04a-27b83301f698/attachments/ad46f151f5b2c1875eb2c8ec/3.jpg","screenshotWidth":1440,"screenshotHeight":6000,"completeness":"truncated","markers":[]}]}
```

```fudge_finding_evidence
{"schemaVersion":1,"findingId":"f1","findingNumber":1,"crops":[{"mappingId":"map-387676f62660f8e7bf4c8be740470ca5","screenshotUrl":"https://api.withfudge.com/v1/shares/95c140da-ada4-4f89-a04a-27b83301f698/attachments/ad46f151f5b2c1875eb2c8ec/1.jpg","sourceWidth":1440,"sourceHeight":6000,"crop":{"x":83,"y":1166,"width":2369,"height":304,"scale":10000},"alt":"Wonderful homepage hero text and backdrop","caption":"Hero text/backdrop region supporting the contrast-layer fix."}]}
```

Score context: 5/10. Desktop and mobile full-page captures completed; both retained captures stop at 6000px while the page extends beyond that, so lower-page judgments are limited.

What works:
- ABC Favorit Light + Inter gives the page a distinctive editorial voice.
- Dark hero, industry proof, case studies, and platform sections create a strong intended rhythm.
- Enterprise proof is specific in places.

What to fix, in order:
1. Repair hero contrast: key retained pairs include near-white text on white and black text on #080808.
2. Make the first product path concrete: lead with one workflow/platform proof point and one primary CTA.
3. Loosen display typography: 82px headings with -4.92px tracking feel compressed.
4. Reduce repeated cards: give one case study a dominant feature treatment.
5. Shorten the mobile sales path: surface qualification and CTA earlier.

Contrast attempts:
| Element | Foreground | Background | Size / weight | WCAG | AA | AAA | APCA |
|---|---|---|---|---|---|---|---|
| Body text / body background | #000000 | #ffffff | body default | not resolved | not resolved | not resolved | not resolved |
| Hero/platform retained pairs | #fafafa / #000000 | #ffffff / #080808 | heading and support text | detector reports 1.0–1.05:1 | fail | fail | unresolved |
| Industry muted labels | #777777 | #ffffff | 14px / 400 | 4.48:1 | fail by 0.02 | fail | unresolved |

Vibe-coded appearance check
Craft: mixed.
Originality: mixed.

| What you see | Kit or distinctive | Why it hurts |
|---|---|---|
| ABC Favorit Light display headlines | Distinctive | Strongest product-level visual choice. |
| Inter across utility, industry, case-study, and footer copy | Generic/default | Makes proof modules feel interchangeable. |
| Repeated industry and case-study image/title/body/link units | Generic/default | Weakens distinction between primary proof and support content. |
| Oversized display type with very tight negative tracking | Generic/default treatment | Poster-like impact hurts scanning. |
| Dark/light section transitions and image-led case studies | Earned | Supports the editorial enterprise positioning when text layers are correctly mapped. |

References used: Vellum AI for product-proof sequencing; Pylon for sharper first-screen hierarchy; Obsidian for featured-versus-secondary proof variation; Harvey for industry-specific enterprise positioning.

## First change

Fix the homepage hero and first platform transition: make every hero text layer sit on its actual dark backdrop, remove the conflicting white-on-white and black-on-dark states, and reduce the hero to one primary CTA plus one concrete product proof point.

## Implementation prompt

```text
Update the Wonderful homepage only. Goal: make the first 2–3 sections immediately legible and product-specific for enterprise buyers.

1. Restore explicit background/text layering in the hero and platform transition; do not rely on inherited color or transparent layers.
2. Keep ABC Favorit Light + Inter, but loosen hero tracking and preserve deliberate line breaks.
3. Rewrite the hero support line around one concrete enterprise workflow or platform outcome.
4. Keep one primary CTA and one secondary CTA; move exploratory links below the first proof block.
5. Preserve the dark editorial visual language, existing imagery, logo treatment, and section pacing.
6. Check 1440px desktop and 390px mobile: no unintended text/surface pairing, deliberate H1 wrapping, visible CTAs, and no horizontal overflow.
7. Re-run contrast checks for body text, hero copy, CTA labels, and muted industry labels.
```