The trinity at work

How we built Treeline.

A four-stage trail from the same RampStack engines we sell. Basano critiqued the field, Krine positioned the build, Tholo planned the pages and selected the skills, an executor cut the code, and Basano verified the result.

Creative direction was selected via the creative-brief-selector skill.

Treeline is the second batch-two build to use the creative-brief-selector skill end-to-end. The skill picked the archetype (Rugged Utilitarian with Documentary Honest as composition secondary), ran the divergence check against the eight shipped demos, and produced the brief that this build executes against. The brief is the canonical creative artifact; this microsite is what the engine renders from it.

The brief lives at progress/inventory-listing-treeline-motors-brief.md in this repository. The shipped-demos signatures file the divergence check reads is at progress/shipped-demos-signatures.yml. The reference-bank entry for this archetype-and-vertical lives at claude-skills/skills/creative-brief-selector/references/reference-bank/rugged-utilitarian-documentary-honest-regional-used-vehicle-marketplace.md.

Stage 1 - Basano: the field's misses

Generalized pattern-level findings. No named competitors.

  • Used-vehicle marketplace homepages cluster in two tiers and leave the regional working-vehicle specialist tier wide open. The mass-market national tier runs price-anxiety scoring as the hero move, financing-first conversion architecture, and a passenger-car-dominant inventory mix. The DTC mass-market tier runs vending-machine theatrics over national fulfilment with financing-first conversion. Neither tier serves a buyer in the Mountain West shopping for a vehicle they will actually use for terrain.
  • Listing-detail transparency is solved in the auction-collectible tier and unsolved in the fixed-price marketplace tier. The canonical auction marketplaces surface full ownership history, mileage timelines, dense photograph counts, and provenance threads as load-bearing elements of the listing-detail page. The fixed-price marketplace field treats the same data as ancillary, behind a click, or absent. The transparency anatomy transfers cleanly to a fixed-price marketplace without the auction mechanics.
  • Working-vehicle photography is rare across the field. The mass-market field leans on dealer-lot studio shots: vehicle in front of a building, three-quarter front, brand-neutral background. A regional specialist photographed in the working context (truck on a gravel forest road, four-wheel-drive SUV on a snowed-in switchback, utility vehicle at a job site) signals what the marketplace is for without copy lifting any weight.
  • Voice and palette consistency is uniform across the mass-market field: flat blue-and-white palettes, neutral national voice. A regional specialist with a Mountain West palette (cool granite ground with restrained evergreen and oxblood accents) and a plain-direct voice that speaks with familiarity of terrain reads as the kind of marketplace its audience actually wants without leaning on regional cliches.
  • Trust signals are inconsistently surfaced across the field. Data-source attribution, regional inspection-partner referrals, pre-purchase inspection guarantees, and contracts policy are surfaced inconsistently and usually as footer-tier content. Surfacing them as a discrete trust strip near the inventory teaser is the structural standout the audited field leaves available.

Stage 2 - Krine: the positioning

The gap to exploit, the archetype, the voice. Archetype selection was made via the creative-brief-selector skill rather than the engine's older taxonomy.

Position
Rugged-utilitarian, documentary-honest regional Mountain West marketplace for used working vehicles. Transparency-first on every listing (price, ownership, accident, mechanical history surfaced with source attribution). Filter-rail inventory grid with the four-data transparency band per card; listing-detail page anatomy stacks the four history tables; comparison rail supports three vehicles side by side; saved search persists in browser storage. Rugged Utilitarian leads with Documentary Honest as composition secondary; selected via the creative-brief-selector skill; full brief at progress/inventory-listing-treeline-motors-brief.md.
Archetype (engine taxonomy)
rugged-utility-marketplace
Brand-archetype-system canonical: Rugged Utilitarian with Documentary Honest as composition secondary.
Voice
Plain-direct and specifics-first. Named vehicle categories, named regions, named third-party providers (with the Demo or Fictitious prefix), named partner shops. No marketing inflation. No best, leading, or premier. The marketplace speaks the way a competent independent shop would speak.

Stage 3 - Tholo: the plan

Pages and skills selected per page.

Pages: home, inventory (search results), listing detail (dynamic), workup

home
creative-brief-selector + competitor-experience-audit + vertical-site-conventions + landing-page-copy + information-architecture + frontend-component-build + seo-onpage
inventory (search results)
frontend-component-build + information-architecture + landing-page-copy
listing detail (dynamic)
creative-brief-selector + frontend-component-build + landing-page-copy + seo-onpage
workup
landing-page-copy + frontend-component-build

Stage 5 - Basano: verification of the built result

Unsparing. Fails are present and named.

Holds

  • Heading hierarchy holds across all four pages: exactly one H1 per page, H2 / H3 sequence with no skipped levels.
  • Language declaration, semantic landmark structure (header, main with id=main-content, footer, nav with aria-label), and the skip-navigation link via ShowcaseMetaLayer are all present and correctly wired across the microsite.
  • JSON-LD Organization on the layout (with Brand subOrganization for Treeline Motors); BreadcrumbList on every non-home page; ItemList on the inventory index; Vehicle schema with mileageFromOdometer, vehicleTransmission, driveWheelConfiguration, plus an Offer with priceSpecification on every listing detail page.
  • Hero zone carries the load-bearing inventory-listing conventions: a wide working-context hero photograph at the top of the page (full-width within the content container, aspect 21:9 on desktop), H1 plus lede stacked beneath the photograph, and a full-width search rail below the lede carrying vehicle-type chips, drive chips, transmission chips, year range, price range, and a Mountain West region selector. The primary CTA Browse the inventory and the secondary Save a search anchor under the search rail.
  • Inventory grid card carries the four-icon transparency band below the photograph; the band signals at a glance whether the listing has full price history, full ownership history, no accidents, and full mechanical records.
  • Listing detail page renders the four history tables stacked in named order (price, ownership, accident, mechanical), each followed by a one-line source attribution naming the demo-only third-party provider.
  • Empty mechanical-history tables surface as No records submitted in context rather than being hidden; the empty state is part of the design.
  • Working client-side comparison rail (max 3 vehicles, persists in localStorage) and saved search (filter combination persists in localStorage with a demo-only labelled opt-in). No payment, no real backend.
  • Rugged-utilitarian register held: cool granite ground (#f4f5f7 page, #2a2d31 dark sections) with evergreen #1f4d3a as the positive-signal accent, oxblood #7a1f2b as the primary CTA, aspen gold #c4a456 as a layered warm accent. Source Serif 4 400 / 600 for display, IBM Plex Sans 400 / 500 for body, IBM Plex Mono 400 for every numeric in the four history tables. Brand wordmark in serif UPPERCASE at tracking-[0.04em]; micro-labels in sans UPPERCASE at tracking-[0.08em]. Distinct from Pinto Mesa Boots' sans uppercase at the same wordmark tracking (the differentiator is the family) and from Northbound's serif small-caps at tracking-[0.06em] (the differentiator is the casing model).
  • Demo-only labelling on the inquiry form, the saved-search opt-in, and the comparison-rail persistence note is consistent and visible in the brand's oxblood CTA colour.
  • Documentary editorial photography shipped across all four pages, anchored to each listing's named year, make, model, trim, and body color: a wide working-context home hero, three generic-per-category strip photographs (pickup, four-wheel-drive SUV, utility), 15 inventory-card photographs that each match the corresponding listing's vehicle data (a 2019 Ford F-250 Super Duty Lariat listing is photographed as a 2019 Ford F-250 Super Duty Lariat in Magnetic Grey; a 2017 Toyota Tacoma TRD Off-Road as a 2017 Tacoma TRD Off-Road in Inferno Orange; a 2016 Jeep Wrangler Unlimited Rubicon as a 2016 Wrangler Unlimited Rubicon in black; and so on for each of the 15), 12 marquee-listing gallery photographs all depicting the same specific 2019 Ford F-250 Super Duty Lariat in Magnetic Grey from 12 angles (exterior three-quarters, profile, Lariat-spec dashboard with Sync 3 infotainment and heated leather seating, rear bench, instrument cluster reading 68,412 miles, 6.7L Power Stroke diesel engine bay, factory eighteen-inch alloy wheel with Continental TerrainContact tyres, cargo bed, wide environmental, honest-wear detail, trailhead environmental), one Mountain West treeline-and-granite-ridge atmospheric ground behind the inquiry CTA close, and one granite-textured inventory banner. All 33 photographs generated through the v2 image pipeline in showcase-demo mode as one consistent documentary shoot: Filson and Patagonia field register, warm directional natural light, Mountain West landscape (alpine, sub-alpine, sagebrush, granite ridges) without identifiable national park names or landmarks. Honesty constraints held per the brief: no fabricated identifiable portraits anywhere in the set (where any person appears at all they are environmental, faces away or out of frame), real-brand badging on the depicted real-brand vehicles renders naturally as documentary register (visible Ford emblem on the F-250 grille, Jeep grille on the Wrangler, etc. all permitted because the listings are for those real-brand vehicles), no fabricated brand marks (no Treeline stickers on any vehicle, no invented dealer decals), no fabricated owner identities, no imitation of CarGurus, Carvana, Bring a Trailer, AutoTempest, Edmunds, Cars.com, or Hagerty layout or trade dress in the photographs themselves.

Fails

  • Intentional noindex and nofollow on the demo build (correct for a demo, flagged by the verifier across pages against a production-ready standard). Same not-a-defect-in-context the prior demos carry.
  • Canonical URL declares the production rampstack.co host while the build is served from localhost during the audit; cross-origin canonical mismatch is the localhost-vs-production artefact, not a real defect. Recurring across all pages.
  • Title tags and H1s on inner pages lean structural (Inventory, Workup) rather than search-keyword-aligned. Judgment item for the showcase context; a live regional marketplace would target topical keywords explicitly.
  • Logo-less type lockup; the Source Serif 4 uppercase wordmark over snowline is the type-led placeholder this batch ships with. The logo pass is a separate per-brand later dispatch.
  • Non-marquee listing detail pages render the listing's primary card image plus a demo-only note instead of a full gallery; the marquee listing carries the full twelve-photograph gallery as the photo-density reference. Production marketplace listings would carry seller-supplied galleries per listing.

Not assessable

  • Core Web Vitals and page experience (no field data in a static-fetch audit).
  • robots.txt and XML sitemap content (single-page audit does not crawl).
  • Real inventory-data backend integration (none in this build by design; demo inventory is a static module of fictitious listings).
  • Real third-party-provider data feeds (intentionally absent; source-provider names on listing-detail tables are demo placeholders).
  • Real seller-vetting workflows (intentionally absent; the inquiry CTA is demo-only).
  • Mobile responsiveness past basic reflow at the audit viewport (separate device captures required).

Treeline Motors is a fictitious specialty marketplace built as a RampStack showcase demo. Mountain West regions are real geographic terms; specific dealers and listings are demo placeholders. No inquiries are sent and no listings are real.

RampStack

Built by the RampStack trinity

How Treeline Motors was built

The four-stage workup behind this inventory listing demo, summarized. Generalized and pattern-level; no named competitors. The full Format A spec and the verification log live in the operated-side run record.

Stage 01

Basano · competitor review

  • Used-vehicle marketplace homepages cluster in two tiers and leave the regional working-vehicle specialist tier wide open. The mass-market national tier runs price-anxiety scoring as the hero move, financing-first conversion architecture, and a passenger-car-dominant inventory mix. The DTC mass-market tier runs vending-machine theatrics over national fulfilment with financing-first conversion. Neither tier serves a buyer in the Mountain West shopping for a vehicle they will actually use for terrain.
  • Listing-detail transparency is solved in the auction-collectible tier and unsolved in the fixed-price marketplace tier. The canonical auction marketplaces surface full ownership history, mileage timelines, dense photograph counts, and provenance threads as load-bearing elements of the listing-detail page. The fixed-price marketplace field treats the same data as ancillary, behind a click, or absent. The transparency anatomy transfers cleanly to a fixed-price marketplace without the auction mechanics.
  • Working-vehicle photography is rare across the field. The mass-market field leans on dealer-lot studio shots: vehicle in front of a building, three-quarter front, brand-neutral background. A regional specialist photographed in the working context (truck on a gravel forest road, four-wheel-drive SUV on a snowed-in switchback, utility vehicle at a job site) signals what the marketplace is for without copy lifting any weight.
  • Voice and palette consistency is uniform across the mass-market field: flat blue-and-white palettes, neutral national voice. A regional specialist with a Mountain West palette (cool granite ground with restrained evergreen and oxblood accents) and a plain-direct voice that speaks with familiarity of terrain reads as the kind of marketplace its audience actually wants without leaning on regional cliches.
  • Trust signals are inconsistently surfaced across the field. Data-source attribution, regional inspection-partner referrals, pre-purchase inspection guarantees, and contracts policy are surfaced inconsistently and usually as footer-tier content. Surfacing them as a discrete trust strip near the inventory teaser is the structural standout the audited field leaves available.

Stage 02

Krine · positioning

Position
Rugged-utilitarian, documentary-honest regional Mountain West marketplace for used working vehicles. Transparency-first on every listing (price, ownership, accident, mechanical history surfaced with source attribution). Filter-rail inventory grid with the four-data transparency band per card; listing-detail page anatomy stacks the four history tables; comparison rail supports three vehicles side by side; saved search persists in browser storage. Rugged Utilitarian leads with Documentary Honest as composition secondary; selected via the creative-brief-selector skill; full brief at progress/inventory-listing-treeline-motors-brief.md.
Archetype
rugged-utility-marketplace
Voice
Plain-direct and specifics-first. Named vehicle categories, named regions, named third-party providers (with the Demo or Fictitious prefix), named partner shops. No marketing inflation. No best, leading, or premier. The marketplace speaks the way a competent independent shop would speak.

Stage 03

Tholo · build plan

home

  • creative-brief-selector
  • competitor-experience-audit
  • vertical-site-conventions
  • landing-page-copy
  • information-architecture
  • frontend-component-build
  • seo-onpage

inventory (search results)

  • frontend-component-build
  • information-architecture
  • landing-page-copy

listing detail (dynamic)

  • creative-brief-selector
  • frontend-component-build
  • landing-page-copy
  • seo-onpage

workup

  • landing-page-copy
  • frontend-component-build

Stage 04

Basano · verification

Holds(11)

  • Heading hierarchy holds across all four pages: exactly one H1 per page, H2 / H3 sequence with no skipped levels.
  • Language declaration, semantic landmark structure (header, main with id=main-content, footer, nav with aria-label), and the skip-navigation link via ShowcaseMetaLayer are all present and correctly wired across the microsite.
  • JSON-LD Organization on the layout (with Brand subOrganization for Treeline Motors); BreadcrumbList on every non-home page; ItemList on the inventory index; Vehicle schema with mileageFromOdometer, vehicleTransmission, driveWheelConfiguration, plus an Offer with priceSpecification on every listing detail page.
  • Hero zone carries the load-bearing inventory-listing conventions: a wide working-context hero photograph at the top of the page (full-width within the content container, aspect 21:9 on desktop), H1 plus lede stacked beneath the photograph, and a full-width search rail below the lede carrying vehicle-type chips, drive chips, transmission chips, year range, price range, and a Mountain West region selector. The primary CTA Browse the inventory and the secondary Save a search anchor under the search rail.
  • Inventory grid card carries the four-icon transparency band below the photograph; the band signals at a glance whether the listing has full price history, full ownership history, no accidents, and full mechanical records.
  • Listing detail page renders the four history tables stacked in named order (price, ownership, accident, mechanical), each followed by a one-line source attribution naming the demo-only third-party provider.
  • Empty mechanical-history tables surface as No records submitted in context rather than being hidden; the empty state is part of the design.
  • Working client-side comparison rail (max 3 vehicles, persists in localStorage) and saved search (filter combination persists in localStorage with a demo-only labelled opt-in). No payment, no real backend.
  • Rugged-utilitarian register held: cool granite ground (#f4f5f7 page, #2a2d31 dark sections) with evergreen #1f4d3a as the positive-signal accent, oxblood #7a1f2b as the primary CTA, aspen gold #c4a456 as a layered warm accent. Source Serif 4 400 / 600 for display, IBM Plex Sans 400 / 500 for body, IBM Plex Mono 400 for every numeric in the four history tables. Brand wordmark in serif UPPERCASE at tracking-[0.04em]; micro-labels in sans UPPERCASE at tracking-[0.08em]. Distinct from Pinto Mesa Boots' sans uppercase at the same wordmark tracking (the differentiator is the family) and from Northbound's serif small-caps at tracking-[0.06em] (the differentiator is the casing model).
  • Demo-only labelling on the inquiry form, the saved-search opt-in, and the comparison-rail persistence note is consistent and visible in the brand's oxblood CTA colour.
  • Documentary editorial photography shipped across all four pages, anchored to each listing's named year, make, model, trim, and body color: a wide working-context home hero, three generic-per-category strip photographs (pickup, four-wheel-drive SUV, utility), 15 inventory-card photographs that each match the corresponding listing's vehicle data (a 2019 Ford F-250 Super Duty Lariat listing is photographed as a 2019 Ford F-250 Super Duty Lariat in Magnetic Grey; a 2017 Toyota Tacoma TRD Off-Road as a 2017 Tacoma TRD Off-Road in Inferno Orange; a 2016 Jeep Wrangler Unlimited Rubicon as a 2016 Wrangler Unlimited Rubicon in black; and so on for each of the 15), 12 marquee-listing gallery photographs all depicting the same specific 2019 Ford F-250 Super Duty Lariat in Magnetic Grey from 12 angles (exterior three-quarters, profile, Lariat-spec dashboard with Sync 3 infotainment and heated leather seating, rear bench, instrument cluster reading 68,412 miles, 6.7L Power Stroke diesel engine bay, factory eighteen-inch alloy wheel with Continental TerrainContact tyres, cargo bed, wide environmental, honest-wear detail, trailhead environmental), one Mountain West treeline-and-granite-ridge atmospheric ground behind the inquiry CTA close, and one granite-textured inventory banner. All 33 photographs generated through the v2 image pipeline in showcase-demo mode as one consistent documentary shoot: Filson and Patagonia field register, warm directional natural light, Mountain West landscape (alpine, sub-alpine, sagebrush, granite ridges) without identifiable national park names or landmarks. Honesty constraints held per the brief: no fabricated identifiable portraits anywhere in the set (where any person appears at all they are environmental, faces away or out of frame), real-brand badging on the depicted real-brand vehicles renders naturally as documentary register (visible Ford emblem on the F-250 grille, Jeep grille on the Wrangler, etc. all permitted because the listings are for those real-brand vehicles), no fabricated brand marks (no Treeline stickers on any vehicle, no invented dealer decals), no fabricated owner identities, no imitation of CarGurus, Carvana, Bring a Trailer, AutoTempest, Edmunds, Cars.com, or Hagerty layout or trade dress in the photographs themselves.

Fails(5)

  • Intentional noindex and nofollow on the demo build (correct for a demo, flagged by the verifier across pages against a production-ready standard). Same not-a-defect-in-context the prior demos carry.
  • Canonical URL declares the production rampstack.co host while the build is served from localhost during the audit; cross-origin canonical mismatch is the localhost-vs-production artefact, not a real defect. Recurring across all pages.
  • Title tags and H1s on inner pages lean structural (Inventory, Workup) rather than search-keyword-aligned. Judgment item for the showcase context; a live regional marketplace would target topical keywords explicitly.
  • Logo-less type lockup; the Source Serif 4 uppercase wordmark over snowline is the type-led placeholder this batch ships with. The logo pass is a separate per-brand later dispatch.
  • Non-marquee listing detail pages render the listing's primary card image plus a demo-only note instead of a full gallery; the marquee listing carries the full twelve-photograph gallery as the photo-density reference. Production marketplace listings would carry seller-supplied galleries per listing.

Not assessable(6)

  • Core Web Vitals and page experience (no field data in a static-fetch audit).
  • robots.txt and XML sitemap content (single-page audit does not crawl).
  • Real inventory-data backend integration (none in this build by design; demo inventory is a static module of fictitious listings).
  • Real third-party-provider data feeds (intentionally absent; source-provider names on listing-detail tables are demo placeholders).
  • Real seller-vetting workflows (intentionally absent; the inquiry CTA is demo-only).
  • Mobile responsiveness past basic reflow at the audit viewport (separate device captures required).