Page intent
The War Dungeon homepage is the brand statement. A first-time visitor leaves it knowing three things: that this is a Warhammer + Dungeons & Dragons specialty retailer; that it commits fully to a distinctive Steampunk + Old-West aesthetic that no other UK Warhammer specialist attempts; and that there are tools and content here (Army Builder, How-To Guides, Tutorials, Creator content, Painting Showcase) that they will not find at Element Games, Wayland, or Goblin Gaming. The primary visitor action is buy a product — but the homepage achieves that conversion path by establishing trust, surfacing curated discovery routes, and demonstrating depth of value.
Mandatory sections (top to bottom)
Every homepage concept MUST include all of these sections in this order. The visual treatment varies per styleguide evolution (Frontier / Gaslamp / Apothecary) but the content requirements are non-negotiable.
- Pre-header announcement bar — rotating messages: free UK shipping threshold (“Free UK shipping over £75”), current campaign (“New 40K Combat Patrols in stock”), cross-brand loyalty reminder (“Earn loyalty points at War Dungeon — redeem at Nerdworks, ArtSabers, Paragon”). Sienna or liquourice background per styleguide; modesto-condensed in caps with widest tracking; rotates every 6-8 seconds.
- Global header — Nerdworks pattern (inherited from camcom-v2): logo (left), primary nav (5 top-level items, NOT 7 — earlier 7-item nav caused overflow): Warhammer (mega-menu containing 40K, Age of Sigmar, The Old World, Hobby Supplies, Paints), Dungeons & Dragons, Tools, Learn (mega-menu containing How-To Guides, Tutorials), Creators, search, account, wishlist, mini-basket with loyalty points badge.
- Hero — single bold cinematic composition. NOT a rotating carousel. Painted miniature diorama lit dramatically (warm side-lighting, smoke/fog atmosphere). Headline in modesto-condensed display (“Battle on Your Tabletop. Crafted on Ours.” or similar — copy TBC by Lily). One-line subhead in palatino-linotype body. Single primary CTA (“Build Your Army” leading to Army Builder, or “Shop New Releases” leading to shop archive — operator’s call on which dominates). Etched plate border frame around the composition.
- Trust strip — 4 cells: free UK shipping over threshold; 30-day returns; multi-game expertise (“40K · AoS · The Old World · D&D”); “A Nerdworks Brand” credibility marker. Engraved gear divider between cells. Rivet borders on each cell. Icons in engraved line-art steampunk register.
- Tools teaser — Army Builder (launch) and Battle Simulator (Phase 2, surface anyway with “Coming soon” treatment). Two cards side-by-side, each with diorama photo, 1-line description, CTA into the respective landing page. Brass plate frame on the cards; steampunk-mechanical visual treatment with gears as decoration.
- Choose Your Game — 6 visual category cards in a 3+3 grid: Warhammer 40,000, Age of Sigmar, The Old World, Dungeons & Dragons, Hobby Supplies, Paints. Each is a clickable curated category mini-homepage entry (NOT a grid). Lit-diorama imagery dominant; category name in modesto-condensed; 1-line positioning; CTA. Cards have rivet borders and etched-frame ornament.
- Fan Favourites — 4 featured products in a row: cover image (on-white catalogue shot), title, star rating, price, “Quick view” CTA. Mixed across games (one 40K, one AoS, one D&D, one hobby/paint). Loyalty points badge on each card — small brass roundel showing earnable points.
- How-To Guides + Tutorials editorial strip — 3 large content cards: cover image (lit diorama or in-progress mini photo), difficulty badge (Beginner / Intermediate / Advanced), read or watch time, CTA (“Read Guide” or “Watch Tutorial”). Cross formats: one painting how-to, one rules tutorial, one terrain-building piece.
- Creator Partner spotlight — featured creator card: avatar, name, game tags (40K / AoS / D&D), 2-sentence positioning, “Visit Creator” CTA. Below: scrollable strip of 4–6 additional creator thumbnails. Sourced from AffiliateWP-powered creator profiles.
- Painting Showcase / UGC — 6-tile masonry gallery of customer painted miniatures. Each tile clickable to a single showcase post. Submit-your-painting CTA at the end of the gallery.
- Loyalty programme cross-brand strip — full-width band: “Earn here. Redeem anywhere.” Logos of sister brands (Nerdworks, ArtSabers, Paragon, War Dungeon). CTA: “Sign in to see your balance” (logged-in users) or “Learn how loyalty points work” (visitors).
- Newsletter signup — themed name TBC by Lily (“Join the Garrison” working hypothesis). Email input + subscribe CTA. Incentive: 10% off first order OR equivalent in loyalty points. Steampunk-typewriter visual treatment on the form.
- Global footer — 4-column shape per Design Brief: Shop (top-level categories) / Discover (Tools, Learn, Creators, Community) / Help (Contact, Shipping, Returns, FAQ, Track Order) / Brand & Loyalty (About, Sister Brands cross-redemption block, Loyalty programme, Affiliate). Newsletter strip + baseline utility strip (payment icons, social icons, copyright, policies, “A Nerdworks Brand” badge).
Excluded from homepage (belongs elsewhere)
- Endless product grid — category mini-homepages and leaf categories own that surface.
- Battle reports / blog posts in full — Learn hub owns this.
- Affiliate enrollment / creator application form — Creators landing owns this.
- Detailed loyalty points rules table — Loyalty programme page owns this.
- Game-system rules explanation — How-To Guides own this.
Conversion principles
- Hero leads with intent, not promotion. The hero composition tells the visitor what kind of place they’re in, not what’s on sale today. Promotional messaging lives in the announcement bar.
- Tools + content are conversion accelerators, not distractions. Army Builder enters the buying funnel (configure → cart). How-To and Creator content seed return visits, which are the highest-converting traffic.
- Loyalty point earning is visible. Every product card shows earnable points (small brass roundel). Reinforces value at decision moment.
- Trust strip is above-fold-adjacent. First-time visitors need shipping + returns + multi-game expertise as quickly as they can scroll.
- Curated categories carry the brand voice. The “Choose Your Game” cards are mini-positioning statements, not generic taxonomy links.
Voice notes
Headline + microcopy voice is Old-West saloon-shopkeeper register per the Design Brief — earthy, knowledgeable, atmospheric. Not jokey; not corporate. Treats the visitor as a fellow hobbyist who knows the games. Specific copy is TBC by Lily; the mockup should use placeholder copy that READS in this register so the operator can evaluate fit. Example fits: “Forge your army.” “From the workbench.” “Ten thousand years of war, and yours to command.” Example anti-fits: “Shop now!”, “Best prices guaranteed!”, “Click here for amazing deals!”
Render direction — Editorial Restraint
This Build Brief renders ONCE, against the Frontier styleguide (SWD1) only. The visual treatment trials a single deliberate aesthetic methodology: modernist saloon broadsheet — minimum chrome, type carries the rhythm. The Steampunk + Old-West register expresses itself through typography, vertical rhythm, and editorial composition rather than ornament. The aesthetic question this run answers: “What does the brand look like if we trust the type to do the work?”
- Imagery — sparing. Only the hero is full-bleed photographic. Where photography appears below the hero it is large-scale, surrounded by generous negative space. No illustration. No texture overlays.
- Ornament — none. No rivets. No gear dividers. No etched plate frames. No gear-pattern background fill. Section dividers are 1px hairline rules in caput. The gear-pattern SVG is retired entirely from this rendering.
- Surface treatment — flat rodeo throughout. NO inverted-panel dark mode. NO texture. NO gradients. Every section sits on the same flat rodeo surface; the page reads as one continuous broadsheet.
- Hierarchy — modesto-condensed headlines at full scale (40–80px) do the organising work. Eyebrow tags in small-caps palatino with letter-spacing. Body in palatino-linotype at 18px with generous leading (1.6–1.7). Vertical rhythm is the principal compositional device.
- Component shape language — rectangles at 7px corner radius. Borders are 1px caput hairlines. Cards have no fills, only thin frames. CTAs are large modesto-condensed text-buttons with a 2px sienna underline rule — NO boxes, NO plates, NO ridge borders.
- Mandatory expressive moments — the brand register must still read as Steampunk + Old-West, but through copy, type, and composition. Acceptable: a single etched scrollwork ornament under section heads as a typographic flourish. Not acceptable: rivets, plate frames, gear icons in the chrome.
Technical constraints
- Page max-width 1440px (global setting).
- Base font size 18px (larger than CamCom default).
- No mobile simplification — rivets, gear dividers, etched ornament stay below 480px.
- Performance stack carries the imagery payload: Object Cache Pro, WP Rocket, ShortPixel (WebP + compression).
- Hero diorama photo is the single largest image — use the largest responsive size + lazy-load below-the-fold imagery.
- No rotating carousels anywhere (hero is single composition; product strip is static grid; creator strip is horizontal scroll, not auto-rotate).
- AJAX add-to-cart from any product card via quick-view modal.