Photography Blog Professional Website Template

Quick summary

Ruin is a single-page, anchor-nav landing page template designed for an online photography course about capturing emotional depth in forgotten and decaying spaces. The layout guides visitors from a cinematic hero reel through a creator documentary, module stories, student transformations, and an identity-driven inline quiz that converts curiosity into enrollment.

Who this template is for

This template is built for photography course creators who teach emotional, location-based storytelling. It fits creators who have a strong personal narrative and want their landing page to reflect that same depth.

• Hobbyist mirrorless photographers who feel their landscape or street work lacks emotional weight
• Urban explorers who document abandoned places and want to build a more intentional practice
• Fine art photographers developing gallery-worthy series around abandonment, decay, and time

What problem this template solves

Most photography course landing pages feel generic. They list bullet-point benefits and show a headshot, but they do not make a visitor feel anything. Ruin solves the trust and motivation gap through cinematic storytelling and identity-driven conversion.

• Visitors leave before committing because the page does not demonstrate the creator's real expertise
• Standard call-to-action buttons do not answer the deeper question: "Is this course right for me specifically?"
• Before-and-after student work is buried or absent, leaving potential students without proof of transformation

What you get with this template

You get a fully structured, single-page hub and spoke layout with five distinct anchor-linked spoke sections. Every section is designed to deepen trust progressively, from first impression through to the moment a visitor enrolls.

• A looping short-form video hero section with creator name and a single defining line of copy
• An inline quiz section with five image-choice questions, four photographer archetype results, an email-gated PDF field guide, and an auto-applied discount code on the enrollment call to action
• A student transformations section with before-and-after image pairs and audio critique triggered on click

Feature list

This template covers the full conversion journey from first scroll to course sign-up. Each built-in section and component is described below.

Cinematic Short-Form Video Header

The hero is a vertical-ratio video reel letterboxed into the viewport. It shows the course creator moving through an abandoned space, composing a shot, and firing the shutter. The loop runs under twelve seconds and ends with the creator's name and a single narrative line fading in over the final frame.

Hub and Spoke Anchor Navigation

A persistent anchor navigation bar links directly to each major spoke section. The copper-green color is reserved for interactive states, making every clickable element feel like a deliberate discovery. Visitors can jump to any section or scroll the full narrative arc.

Creator Origin Story Section

This section presents the creator's documentary-style origin story. It includes a gallery comparing the creator's earliest abandoned-place photography against their recent work, giving visitors a clear picture of the journey they are being invited to join. The primary quiz call to action appears here.

Module Breakdown with Location Stories

Each course module is introduced with a real location story, such as a Soviet-era swimming pool in Georgia. A sticky image panel keeps the visual context locked in view as visitors scroll through lesson details. Module expandables allow visitors to explore depth without leaving the section.

Inline Quiz and Archetype System

The five-question inline quiz uses image choices to identify one of four photographer archetypes: The Archivist, The Ghost Hunter, The Light Chaser, and The Storyteller. Results include a personalized module pathway, an email-gated downloadable field guide for the matched archetype, and a secondary enrollment call to action with an auto-applied discount code.

Student Transformations Section

Before-and-after image pairs show real student progression. Clicking each pair triggers the creator's audio critique for that transformation. This section provides social proof in a format that feels personal rather than promotional.

Page sections overview

Design & branding system

The visual identity follows a Heritage and Story theme built on a Warm Stone color system. The palette is inspired by the physical texture of derelict spaces, warm where light breaks through and cool where decay has settled in.

• Four core colors: exposed plaster cream (#E8DDD3), oxidized iron (#8B4513), shadow corridor charcoal (#2C2420), and patina copper-green (#6B8F71)
• Backgrounds alternate between deep charcoal and plaster cream; text sits in high contrast against both; copper-green appears only on interactive elements
• Typography uses Fraunces as a serif italic display face for headlines and DM Sans as a clean body and interface typeface

Mobile & speed optimization

The template is built desktop-first, reflecting how photographers typically browse and research courses. A strong mobile fallback ensures the experience holds up across all screen sizes.

• Scroll-linked reveals, word-by-word text animations, and image transitions are handled as high-interactivity client components
• Static sections use server components to keep load behavior clean and predictable
• The quiz state machine, before-and-after hover interactions, module expandables, and audio-on-click features are isolated as client-side components

How this template helps you convert

The page is structured as a progressive trust arc. Each section answers a different stage of the buyer's internal question, moving from curiosity through credibility to commitment.

1. The cinematic hero reel and creator origin story answer "Who is this person and should I trust them?" before a single product claim is made.
2. The module breakdown with location stories and student transformations answer "What will I actually learn and what proof exists that it works?"
3. The inline quiz answers "Is this course right for me specifically?" and delivers a personalized result, an email-gated field guide, and an auto-applied discount code that turns archetype identity into enrollment action.

Other information about this template

This template was designed for the abandoned places photography online course niche but the hub and spoke structure, quiz conversion system, and creator documentary format can support other photography education creators with a strong personal narrative and location-based curriculum.

• The template style is Hub and Spoke with Anchor Navigation, a format well suited to long-form course sales pages that need to balance depth with scannability
• The creative direction is Creator Spotlight, meaning the page architecture is built around a single creator's expertise escalating across sections
• The landing page direction is Quiz and Assessment, with the primary call to action being "Find Your Exploration Style" repeated in the anchor nav and after the origin story
• The footer follows a Vercel Horizontal Flow pattern and is intentionally minimal to keep attention on the conversion path above it
• The template is localized in English with USD pricing and is written for a US-centric audience while remaining globally relevant in its subject matter

Show more