Skip to content
Web Design · Concept2025

CyberPhysics

A concept landing page for a futuristic fitness brand, built to test what fitness marketing looks like when it borrows from tech products instead of the usual aggressive gym clichés.

Visit site

01Context

CyberPhysics is a self-directed concept project. I wanted to see what fitness branding could look like if it dropped the hyper-masculine, “no pain no gain” tone that most gym sites lean on, and borrowed the language of tech products instead.

The idea started from a simple observation: traditional gym websites all run the same formula, aggressive imagery, red and black, guilt-driven copy. It speaks to people who already identify with hardcore gym culture, and alienates a growing group who want to improve themselves without the intimidation.

The angle

Position the gym as a “human upgrade facility” rather than a place to suffer. Use a dark interface with electric-lime accents, tech-forward language, and trainer personas that read like characters from a sci-fi film. Make fitness feel like optimisation, not punishment.

02Constraints

  • 01

    A one-week timeline, solo. Every decision had to move fast, so I leaned on bold visual direction over extensive research.

  • 02

    No real client and no brand to inherit from, so the whole visual language had to be invented from scratch and kept internally consistent across every screen.

03Key decisions

  • 01

    Built the brand around a single concept, “Evolution is no longer optional,” and let that line drive the tone of every section instead of decorating screens after the fact.

  • 02

    Chose a dark interface with one electric-lime accent, used sparingly, so the energy reads as high-tech rather than aggressive.

  • 03

    Wrote fictional trainer personas and section names (“Bio-Hacking Protocols,” “AI-Driven Analytics”) to sell the sci-fi positioning through copy, not just visuals.

  • 04

    Kept the pricing and schedule sections clear and scannable, so the futuristic styling never got in the way of the practical information a real visitor would need.

04Solution

  • 01

    A hero built around the core concept, with the positioning line front and center and a single clear call to action.

  • 02

    A features section framing the gym's offering as “intelligent resistance,” using the tech vocabulary consistently.

  • 03

    A schedule and pricing block that stays readable and structured, with the styling carried through but never allowed to reduce clarity.

  • 04

    A full type and color system underneath it all, so the concept holds together as a real design language rather than a one-off screen.

05Design system in action

Because this was a branding-led concept, the type and color system is part of the deliverable, not an afterthought.

Typography
  • Display heading: the loud, characterful layer
  • Section titles: the structural layer
  • Body large: primary reading content
  • Body regular: secondary content
  • Caption and labels: data and small print
Color
  • One electric-lime accent, used with restraint
  • Dark background as the base
  • A raised card surface for depth
  • Primary, secondary, and muted text tones for hierarchy

06Learnings

  • 01

    Constraints breed creativity. Having only one week forced quick, confident decisions and taught me to trust my visual instincts instead of over-iterating.

  • 02

    Color restraint creates impact. I initially used the lime accent too freely, which diluted its power. Pulling it back to only a few key moments (the CTA, highlights, the featured pricing tier) made each instance more meaningful.

  • 03

    A concept still needs discipline. Even without a client, the strongest parts came from treating the fictional brand as if it were real and holding the design system to the same standard as client work.