Skip to content
St Piste-ers’27
Design systemOrganiserHO
St Piste-ers ’27
OrganiserHO

Concept C · Design direction

Après
Modern

An energetic ski-travel brand for a group in their twenties: huge condensed poster type, confident blocks of chairlift red, sunflower and pine, and chunky sticker-like cards with hard offset shadows. Retro-alpine stripes and sunbursts give it personality, while a floating pill tab bar keeps the phone experience one-thumb simple.

See it live Organiser view
Snowboarder above the clouds in a duotone pine and sunflower treatment
116 days to go

Colour

Retro ski-poster blocks used with intent: red means “this needs you”, pine means “sorted”, sunflower is for celebrating and waiting. Status always pairs colour with an icon and a word.

  • Chairlift Red#C4321A--am-redPrimary action · needs you
  • Sunflower#F3B22E--am-sunHighlight · waiting · posters
  • Pine#123B30--am-pineDone · confidence · depth
  • Powder#A8D3EE--am-powderInfo · calm surfaces
  • Cream#FBF0DC--am-creamPage surface
  • Ink#1B1511--am-inkText · borders · shadows

Contrast: cream on red 4.9:1 · ink on sunflower 9.7:1 · cream on pine 11:1 · ink on cream 16:1.

Type

Display · Bricolage Grotesque 800, width 75

116 days

Pick your mountain

Equipment details needed

Text · DM Sans 400–700

Height, boot size and what you need to hire. It takes two minutes and means your skis are waiting when we arrive.

Small · Only organisers and the hire shop see these.

Eyebrow · condensed caps, tracked

Icons

Chunky 2.25px strokes on a 24px grid, rounded like an embroidered ski patch.

  • Trip
  • Skis
  • Board
  • Gondola
  • Chairlift
  • Dates
  • Money
  • Room
  • Helmet
  • Insurance
  • Flights
  • Location
  • People
  • Snow
  • Ticket
  • Readiness

Photography

Full-colour for places (people want to see the resort). Duotone for mood and backgrounds. Always held by a bold frame — arch, sticker or hard shadow.

Val Thorens in morning sun
Arch frame · full colour · places
Snowboarder throwing up a wall of powder, pine and sunflower duotone
Duotone · pine on sunflower · mood
Snowboarder getting ready, red duotone
Sticker crop · red duotone · moments

Buttons

Press, and buttons sink into their shadow. Keyboard focus draws a 3px ink ring with offset — try tabbing.

Forms

Inputs, selects, segmented, switch, error

Airlines need it exactly as printed.

! That email looks incomplete — check the bit after the @.

Room preference
I have travel insurance that includes winter sports cover.We’re recording your confirmation — the organisers don’t check your policy.

Conditional equipment form

Switch to snowboarding: poles disappear, stance appears.

What are you riding?
How confident are you?
Sizes for the rental shop

Only organisers and the hire shop see these.

cm
kg
What do you need to hire?

Bringing your own? Just flip it.

  • Skis
  • Ski boots
  • Poles
  • Helmet

Hiring: skis, ski boots, poles

Status & progress

Badges

  • Done — availability submitted
  • Needs you — equipment details
  • Waiting on organisers — room
  • Partly done — deposit part-paid
  • Not needed — bringing own skis

Segmented progress

72%

Ten chunky segments; a hatched segment shows a part-step. Always shown with the number.

Stickers

Best week116 daysCateredValueDemo price

Stripes: red / sunflower / pine — used as section breaks and the nav underline.

Cards

Standard

Thick ink border, 20px radius, hard 5px offset shadow. Paper on cream.

Action

Red shadow says “this is yours to do”. Used for next steps only.

Waiting

Dashed outline, no shadow — nothing to do yet, it’s on the organisers.

Poster

Solid colour block for the big moments — countdown, readiness, best week.