Hidden Features in Web Design: Turning on Party Mode for Wheelhouse
Every website project is different.
I’ve been a developer for about a decade, and each website project I’ve worked on (and probably every website I’ll ever work on) has been unique. The goals of the projects change based on the clients and their needs—our job is to create solutions for our clients’ challenges, after all.
But the first priority for any website is functionality. It should provide an intuitive experience for users and be easy for our clients to update on the backend. After that, design and detail are what set a website apart from the competition—they’re what make a website memorable.
Sometimes those details take the form of a fun animation or hover state. Sometimes it’s a clever 404 page.
In the case of Wheelhouse’s website, it was a hidden bonus feature.
But first, some background.
Atomicdust has worked with 1000 Spruce, the company behind Wheelhouse, for several years, starting with Start Bar back in 2016. (That website had a hidden feature too — a game unlocked when visitors typed in the Konami code.) Around that time we also worked on the branding for Wheelhouse. After creating the branding, interiors and website for The Midwestern last year, the team asked us to design a new website for Wheelhouse.
The business is a unique concept. During the day, it’s a restaurant that draws downtown workers, tourists and sports fans on game days. At night, it’s a hopping bar that stays open until 3 a.m. on the weekends. Their website needed to appeal to both audiences, separately.
A bright idea.
One of our senior designers, Katie, designed the site’s homepage with two modes: starting at 7 a.m., the site is in day mode, with a light background and hand-illustrated sun shining bright over Wheelhouse’s building. After 5 p.m., the site changes to night mode—the background gets dark and the moon comes out. Users can toggle between the two modes any time by clicking the small circles in the top left corner.
To develop this functionality, I added an .svg shape behind the building that transitioned from light to dark depending on the mode. I wondered, why stop at two colors?
I added a third circle at the top with an outline that changes colors as the building cycles through the color spectrum. (The circle is only visible in night mode, since there’s not much demand for ragers during the day.) Complemented by a picture of the nightlife crowd awash in party lights, the rotating colors of the building showcase the energy of Wheelhouse at night.
Party mode was born.
Hidden gem.
I love adding hidden details like this to websites because it can be a great way to show a brand’s personality. Wheelhouse’s dual personalities of restaurant and late night bar provided a great opportunity to take advantage of the web as a dynamic medium. Plus, the interactivity invites people to explore, and surprising little features reward them for their curiosity. It’s like finding an Easter egg in a video game; it’s not central to the experience, but it’s a fun diversion you can share with friends.
Ideally, party mode gives the people who discover it a better sense of the late-night vibe at Wheelhouse, and makes the brand more memorable—important for the next time they’re looking for someplace fun for going out.
And who knows, maybe there are other surprises hidden around the site too…
