Skip to content

update homepage cta #2984

Description

@arii

Homepage Redesign Guide: Transition to Option D

Objective

Update the BoomTick homepage to emphasize a single, memorable value proposition instead of multiple competing headlines.

Design Goal

Pack smart.
Dance more.

Followed by a concise explanation of what BoomTick provides.

The redesign should feel like a modern editorial landing page rather than a traditional blog.


Success Criteria

Visitors should understand within 3 seconds:

  • This site is for dancers.
  • It helps them prepare for dance weekends.
  • It offers practical travel and gear advice.
  • The featured guide is the primary place to begin.

Phase 1 — Simplify the Hero

Remove

Delete the current hero copy:

Built for dancers.
Look good.
Travel smart.
Dance more.

This creates unnecessary visual competition and makes the hero feel cluttered.


Replace With

Primary heading:

Pack smart.
Dance more.

Secondary copy:

Gear, travel, and tips for better dance weekends.

Phase 5 — Modernize the Featured Guide

Current card feels like a blog card.

Instead create an editorial feature.

Layout

------------------------------------------------
| Large image |                                |
|             | WCS Travel Pack                |
|             |                                |
|             | Description                    |
|             |                                |
|             | Read Guide →                   |
------------------------------------------------

Image should occupy roughly 45%.

Text 55%.

Desktop only.

On mobile stack vertically.


Done Criteria

Featured guide feels like a magazine feature.

Image quality is emphasized.


Phase 6 — Navigation

Reduce visual weight.

Current navigation is slightly too prominent.

Recommendations

  • Increased spacing
  • More transparent until scroll

Desktop

Gear Guides
Travel
DIY
Merch
About

No excessive separators.


Done Criteria

Navigation supports the hero instead of competing with it.


Phase 7 — Background Effects

Current floating particles are distracting.

Reduce

  • quantity by ~50%
  • animation speed
  • opacity

Only a few particles should be visible.

They should create atmosphere rather than demand attention.


Done Criteria

Background feels alive but subtle.


Phase 8 — Improve Visual Hierarchy

Hierarchy should become

  1. Hero image
  2. Headline
  3. Subtitle
  4. Featured guide

Current hierarchy places too much emphasis on text.

The redesign should feel balanced.


Phase 9 — Mobile Optimization

Hero should fit within one viewport.

Recommended order

Logo

Headline

Subtitle

Browse Guides

Featured Guide

Hero image

Featured article

Avoid forcing users to scroll before understanding the site's purpose.


Phase 10 — Accessibility

Maintain WCAG AA contrast.

Minimum touch targets

44x44px

Buttons

Visible focus state.

Heading hierarchy

H1

H2

Body

Never skip heading levels.


Final Acceptance Checklist

  • Hero uses only one clear message
  • Headline is "Pack smart. Dance more."
  • Subtitle reads "Gear, travel, and tips for better dance weekends."
  • Hero image is significantly larger
  • Featured guide feels editorial
  • Mobile hero fits comfortably within one screen
  • Navigation is visually lighter
  • Background effects are reduced
  • Layout has generous spacing throughout
  • Overall aesthetic feels premium, modern, and focused

Design Principles

Every element in the hero should answer one question:

"Will this help a dancer have a better weekend?"

If an element does not reinforce that message, simplify it or remove it. The homepage should feel confident, focused, and editorial rather than promotional.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions