Every December for the past 6 years, 101WKQX (our Alternative Rock format radio station) throws a pre-Christmas multi-night concert bash called The Nights We Stole Christmas (TNWSC). In 2017, Rise Against, Foster the People, and Queens of the Stone Age headlined the three nights at the Aragon Ballroom.
My team was in charge of creating all the visual assets to support this event, from all the cross-platform marketing pieces for pre-promotion, to all of the signage, decorations, and promotional items for each night, to caputuring every aspect of the 3-night event with photography and video. Each year of TNWSC, we try to enhance the overall experience for our fans and sponsors alike, so in 2017, we partnered with AV Chicago to use their gigantic video wall display for an improved presentation with motion graphics, interactive Instagram feed, and other custom sponsorable opportunities.
I worked with the Promotions, Programming, and Sales departments to conceptualize various visual needs for this whole event. In addition to high-level art direction and project management, much of my effort was spent designing & coding the custom microsite, as well as developing a strategy for content roll-out (from pre-promotion, to providing photos & videos to engage fans with after the event). I also worked closely with our videographer and AV Chicago to strategize & art direct the content for the video wall for each night.
101WKQX (Cumulus Media)
Art Direction, Information Architecture, Content Strategy, Web Design & Development, UI/UX, Graphic Design
Sabrina Česas – Logo, Print, Graphics
Giorgio Reyes – Video
Zach Spangler – Photography
Julia Paul – Photography
AV Chicago – Video Wall
Since 2017 was the 6th installment of TNWSC, several of the design elements were previously-determined in years past. However, new this year, I overhauled functionality and layout of our custom microsite, as well as brainstormed content and layout ideas for the new on-stage video wall backdrop.
The logo is the same, while we tailored the design for the poster and social media graphics around the 2017 content. The t-shirt design is new and inspired by the Dr. Seuss classic “How The Grinch Stole Christmas”. These items are relevant because aspects helped shape the visual tone for the website and video wall content.
When planning out the custom microsite, I created a sitemap to serve as a blueprint for the various pages that I’d need to build. Then, I created a handful of sketches and wireframes to get a better sense for the content layout… this is especially helpful when trying to articulate my vision to other team members.
Early on in the development stages for the video wall content, I created a few schematics for my team and I to refer to when coordinating with AV Chicago. This helped ensure everyone was on the same page, and allowed us to have more productive conversations about layout and content.
For pre-premotion, I opted for a one-page website, with a cool video background, and a clean layout that quickly spells out all important info. Further, I built a custom sticky nav with smooth scroll that allows the user to easily bounce around from section to section. The ulitmate goal was to capture the user’s attention, give them the facts, and send them on their way to buy tickets!
The browser view is a scrollable figure that demonstrates the page layout (at this viewport size). The iPhone view is a video that demonstrates the user experience on mobile. Note the sticky nav (with horizontal scroll), the smooth scroll vertically from section to section, as well as the horizontal scroll for the lineup each night.
This figure demonstrates the video background we used within the masthead/branding section. The falling snow was created using PNG graphics and CSS.
This figure is scrollable, helps demonstrate the full page layout for the Relived section that was created to recap the concerts with photos and videos.
The video wall was a new asset for us to use in 2017, giving us the ability to create a variety of animations to enhance the presentation of the concerts. The video wall also allowed us to generate revenue with custom sponorable opportunities that we used in between band performances during stage setup.
During the “Countdown Schematic” phase, we carved out various sponsorable opportunities. These examples demonstrate the rotating logo video. The figure on the left is my rough mockup to establish layout and scale. The figure on the right is a portion of the finished animation.
These videos put our work into greater context of final output, providing a reference to scale, as well as a reference to the graphics were tied into the experience of the concert.
We received great feedback from sponsors, record labels, and fans for all of our work for TNWSC. The video wall was a successful addition this year, elevating the overall concert experience to an exciting new level. Regarding the custom website, the amount of traffic that we received further underlines the success, and proved to be a great compliment to the sold-out shows.
These photos by Zach Spangler demonstrate the popularity of the event, on-site. Judging by the overall engagement on the microsite, I’d surmise that it was a very nice compliment to the event as a whole.