Capital Campaign Landing Page

Overview

Three Gaits needs a single landing page built for their Capital Campaign. The project has a defined structure, content, and imagery already in place. An AI-generated HTML wireframe was created as an intermediate deliverable to hand off to the design team for a polished mock-up.

Background

Client contact Jolie requested a landing page specifically for the Capital Campaign (distinct from the main Three Gaits site). Mark offered to build a full microsite similar to the Enduring Sanctuary project, but Jolie confirmed she only needs one page. The Capital Campaign has its own logo (created by Lukash).

AI Wireframe Approach

Mark used a Claude project to generate an HTML wireframe as a starting point:

1. Jolie provided a written description of what she wanted the page to accomplish
2. Mark fed the brand guide, content, and Jolie's brief into a Claude project
3. Claude generated a complete HTML page with structural layout — headers, subtitles, CTA buttons, image placeholders, and content sections
4. The wireframe included sections for: who they are, impact, a quote, supporting facts, why now, vision, and the investment ask
5. A small tag element showing the fundraising goal amount was noted as a particularly good detail

The HTML can be imported into Figma, which can parse it and give designers a workable starting structure. The wireframe can also be published via Claude and shared as a live link for review.

"It did a pretty good job. Some of this stuff needs to be moved around and needs to be wiggled here and there, and we need to dress it up. But you can export this as a PDF and just send it to them and say, hey, here's a rough wireframe." — Mark

Page Structure (from wireframe)

• Header / hero
• Who we are
• What's the impact / why are we doing this
• Pull quote
• Supporting facts (noted as needing to be horizontal, not vertical)
• Why now
• Our vision / what the new space will do
• The investment ask (amount tag)
• CTA button(s)

Image assets are available from existing project files.

Decisions

• One page only — not a microsite
• Use Capital Campaign logo, not the main Three Gaits brand mark
• Design team to mock up — Melissa will assign to the design team queue; they will determine who is available
• Workflow: AI wireframe → designer polished mock-up → client review pass → build

Action Items

• [x] Mark to email HTML wireframe file and Claude-published link to Melissa
• [ ] Melissa to create task in project management system and assign to design team — targeting mock-up completion within the week
• [ ] Design team to import HTML into Figma and develop polished mock-up
• [ ] Jolie to review polished mock-up and provide one final pass of feedback
• [ ] Developer to build final page after client approval

Related

• ^[1]
• ^[2]