Athlete Landing Pages - Figma

Project Overview

We are building an elite landing page platform for athletes (i.e. Soccer, Football, Hockey, and Basketball) to showcase their careers to scouts and sponsors.

We did some templates "Vibe Coding," but the templates lack the "editorial polish" of a professional product. We need a designer with sports experience and love to design 4 new athlete profile templates and place them into Figma. These will be high-end, layered web experiences that feel bespoke, while maintaining a single, modular code base.

Key Responsibilities

1. Professional Art Direction (The "Anti-Slide" Mission)

Implement sophisticated UI details (overlapping elements, intentional typography, and high-end white space) to move away from a "slide-deck" aesthetic.

2. Modular Theming & Vibe Logic

Design the visual rules for four distinct "Vibes" that can be applied to the same base code:

The Gritty: High-contrast, textured, "underground" feel.

The Clean: Minimalist, Swiss-style, "Pro-League" prestige.

The Bold: Heavy saturation, massive typography, "Hype-Tape" energy.

The Energetic: Futuristic, motion-focused, "Next-Gen" tech feel.

3. Fallback & "Trial State" Design

You must design for the "Imperfect State." Profiles must look premium even when data is missing:

Fallback Imagery: Design image containers that look intentional when populated with generic sport-specific assets (e.g., a high-end stadium shot) instead of a personal athlete photo.

Video Empty States: Create attractive placeholders for missing video URLs (e.g., stylized "Play" icons with "Highlights Coming Soon" text).

Missing Data Logic: Develop a subtle "N/A" or "—" styling (e.g., light gray typography) for skipped metrics to ensure the layout remains balanced and professional without leaving awkward gaps.

4. Conversion & Contact Logic

Universal CTA: Every template must feature a prominent Call to Action (CTA) and Contact Button.

Lead Generation: Design the visual flow for a "Recruiter Contact Form" that allows scouts to reach players/parents securely without exposing private email addresses.

5. Global Component Library

Every layout must elegantly house the following data points:

Identity: Full Name, Sport, Position, Birth Year, Grad Year.

Context: School, City, Team/Club Name.

Narrative: Strengths, Accomplishments, "My Story" (Bio).

Requirements

Portfolio: Proven experience in Editorial Design or Sports Branding. We want to see how you handle "expensive-looking" typography and high-impact imagery.

Systems Thinking: Mastery of Figma Variables/Tokens. You must design with the understanding that colors, fonts, and corner radii will be swapped programmatically.

Empty State Mastery: You understand that a design is only as good as its "worst-case scenario" (missing data/images).

Mobile-First Mindset: Athletes and scouts live on their phones; the mobile experience is the priority.

Project Deliverables

Figma Master System: Modular components for all data points and contact forms.

Thematic Style Guides: Specific rules for the four "Vibes" (Colors, Fonts, Accents).

Fallback Asset Guidelines: A curated set of "Generic" sports placeholders that maintain the premium feel.

Final Note for Applicants

We aren't just looking for a "skin" for our app. We are looking for a designer to build the visual architecture that allows a high-school freshman and a pro-prospect to both look elite, regardless of how much content they have uploaded yet.

The deliverables initially will be four wireframes for review and approval. Then the four designs into Figma - where our dev team will implement those figmas into our app.

You must love sports, understand competitve sports and have a portfolio of sports / team / Athlete designs.

Some examples

https://www.athletewebdesign.com/images/large-view/portfolio-hahaclintondix.jpg

https://www.athletewebdesign.com/images/large-view/mackenziewanicka-large.png

https://www.athletewebdesign.com/images/large-view/kadend-large.jpg

https://www.athletewebdesign.com/images/large-view/portfolio-23.jpg

https://www.athletewebdesign.com/images/large-view/portfolio-25.jpg