Skip to main content
Dev Sac
Content Site

Hallowmix.com | Seasonal Content Site With 14 Interactive Tools

Halloween planning site built in Astro 6 with 9 Zod-validated content collections, 14 Preact tool islands including a layered sound mixer and fog calculator, 22 layerable sound channels, and 72 printable downloads. 31,000 monthly visitors on a hard seasonal curve.

Astro Preact TypeScript MDX Web Audio API
Hallowmix.com | Seasonal Content Site With 14 Interactive Tools screenshot
0
Interactive Tools
0
Content Collections
0K/mo
Visitors
0
Content Entries

The problem with seasonal content

A Halloween site earns its entire year in about six weeks. Traffic climbs through September, peaks in late October, and falls off a cliff on November 1st. That shape punishes two things: a slow site, because the traffic spike arrives all at once, and thin content, because every competitor is publishing the same twelve listicles.

The way out of a crowded seasonal niche is to give people something to use rather than something to read. A listicle about party music is one of a thousand. A tool that layers actual sound loops into an ambient mix for your porch is not.

What I built

Hallowmix.com is a Halloween command center for adults, built as a pure static Astro 6 site with interactive tools hydrated as Preact islands. It runs about 31,000 visitors a month against that seasonal curve and monetizes through Amazon affiliate placement.

Content is organized into nine Zod-validated collections, and the schemas are the interesting part. These are not nine flavors of “blog post.” A blueprint carries a theme, a decor list, a menu split into food and drinks, host and guest costume notes, and a shopping list. A roundup carries a year and an array of products with ASIN, rating, and pros and cons. A playlist carries a genre and songs with streaming URLs. A masterclass knows its series, its part number, and the total parts in the sequence.

Modeling each content type honestly means the templates can render real structure instead of parsing prose, and it means a malformed entry fails at build time rather than shipping broken.

Static HTML shell 9 collections · Zod-validated at build 0 KB JavaScript until an island is needed blueprints · articles · roundups · playlists · galleries · masterclasses · history · downloads · tools Sound Mixer 22 channels · Web Audio Fog Calculator volume + output Yard Planner + 11 more tools ISLANDS HYDRATE ON VISIBILITY, NOT ON LOAD

Fourteen tools, none of them loaded by default

The tools are the reason people come back. A sound mixer that layers 22 sound channels into a custom ambient track, with 10 named presets as starting points. A fog machine calculator. A yard haunt planner. A lighting designer. A budget calculator, a party checklist, a cocktail lab, a movie matchmaker, a costume name generator, a haunter quiz, a playlist builder, an interactive history timeline, and a Halloween countdown.

Every one of them is a Preact island that hydrates on client:visible or client:idle rather than on page load. A visitor reading a decor article downloads no tool JavaScript at all. Someone who scrolls to the sound mixer gets the sound mixer and nothing else.

This is the specific reason to build a content site in Astro rather than a single-page framework. Fourteen interactive tools would normally mean shipping a large bundle to every reader, most of whom want a shopping list. Islands invert that: the page is HTML, and interactivity is opt-in per component.

The ambient sound mixer showing a grid of individually controllable sound channels including howling wind, rain, thunder, creaking doors and organ music, each with its own volume slider

Printables as a traffic channel

The site ships 72 printable downloads and a library of ambient audio. Printables are an underrated seasonal asset, because they earn links and shares from people who would never link to an article, and they keep working every October without being rewritten.

They also convert a browsing visitor into someone who has your file open on their kitchen counter while they shop, which is a more useful place to be than page two of a search result.

Dark Manor

The theme is Victorian gothic, built entirely on CSS custom properties with no framework. Deep near-black backgrounds, aged gold for headings and calls to action, sienna as the secondary accent. There is an alternate lights-out stylesheet for the parts of the site that want to go darker still.

Skipping a CSS framework here was the right call. The design is a single strong point of view applied consistently, not a system that needs to absorb arbitrary future layouts, and hand-written custom properties express that in a fraction of the weight.

The seasonal build

Everything is output: 'static', deployed as plain HTML to cPanel over rsync. There is no server, no database, and no runtime to fall over when traffic multiplies in the last week of October. The infrastructure cost of the peak is identical to the cost of the trough, which is the correct architecture for a business whose traffic swings by an order of magnitude on a calendar.

Like what you see?

I build tools that solve real problems. If you have an idea or a project that needs engineering, let's talk.

Get in Touch