glossy valley

the idea

Glossy Valley dresses the birthday site as a glossy game menu, the chunky, shiny kind you'd click through before the fun started. panels are sky-blue glass with a bright top half and a navy bevel. inside them sit near-white wells for the words. buttons are round and glossy with white icons. sections are split by a hairline with three small diamonds, and a faceted gem is the one ornament.

nothing is torn and nothing is tilted. where the sticker look is paper and marker, this one is plastic and light: level panels, soft navy shadows instead of hard offset ones, and a sky wash with a glow on the horizon behind every page. it's bright, it's playful, and it's very easy to read.

the palette and the type

glass blue is the accent: the main buttons and the page you're on. panel blue and sky top make the glass. navy carries every word and outline. mint means done, sunburst gold is the gem and the badges, selection teal lights up whatever the pointer is over, and party purple fills the love meter. glass blue comes with five checked alternatives, bubble pink, mint, sunburst, lilac and aqua, every one tested so navy stays readable on it; the buttons and the scrollbar's capsule follow the pick.

• Baloo 2 for the headlines: round and bold, with a navy outline.
• Nunito for labels, buttons and everything you read at length.
• Gochi Hand stays for what friends write by hand, so their cards still look like their notes.

the glass bar (the nav)

the nav is a glass bar floating just inside the top of the page, with a row of glossy round buttons: home, make, gifts, play and arcade, each with a white icon and its name underneath. the page you're on takes the accent colour and its name sits in a bevelled tab. a small diamond rule separates the buttons from the music switch.

on a phone the buttons drop to a strip along the bottom of the screen, where thumbs are: the first four plus more, which opens a glass sheet upward with the rest. the bar at the top keeps just the site's name (on the front page, the gem).

the scrollbar

the scrollbar is a glass capsule: a glossy pill in the site's accent colour with a navy ring, a thin bevel inside it and a small gold gem at its middle, riding a frosted channel with a recessed lip. it glows teal under the pointer and goes pressed navy while you drag, with the bevel flipped like a button pushed in.

small boxes, like the card maker's message box and the island's menu, get a slimmer capsule without the gem. Firefox draws scrollbars in a single colour, so there it's a plain navy capsule on the channel.

page by page

• the front page: the birthday person's name in rounded glossy letters beside a framed picture of a gem over green hills, drawn in code.
• the card maker: glossy step dots, white wells to type in, and six candy-glass colours for a friend's blob: glass blue, bubble pink, mint, sunburst, lilac and coral.
• the board: renamed the gift pile, with every card a level glass panel. the tidy button says "line them up", and "let them float" puts them back.
• the festival: twelve booths and a row of glossy arcade cabinets.
• the island: the menu opens as a glass sheet, and hugs pop up as +100 LOVE, LOVE UP! and SO LOVED.
• a missing page: "this room isn't built yet", and a way back to the valley.

who it suits

the gamer. anyone who misses chunky glossy menus and the sound a button made when you pressed it. a friend who'd rather have bright and playful than handmade and scrappy. it's a good fit for a 21st, a birthday that's going to be shared on a big screen at a party, and for anyone whose favourite colour is "sky".

the island itself stays the same paper-cutout world whichever look the site wears (the look reaches its menu and the words that pop up), and every card, photo and clip friends left is exactly the same: a look changes how the site is dressed, never what's in it.