CONCEPT WEBSITE WITH E-COMMERCE

Jen Foster is an artist who embodies passion. She’s also a music veteran with a pretty serious fanbase, so I had to match that passion when she asked me to design her website around the release of her newest double album, The White Room SessionsWe decided on a concept website that correlates to the design of the album art. We used a WordPress theme; however, it was a completely customizable one, and we also implemented custom CSS. Everything on the site from the menu to the font was completely bespoke.

I began listening to every song over and over to capture a “feeling” that would translate to the site. I like to do this with every artist website (and when I design graphics too), but with a concept site directly correlating to the music, it was especially important that I capture this album’s essence.

Website Design
Graphic Design
Logo Design

Jen Foster Worktape Image

Jen Foster White Room Session 1

Jen Foster White Room Session 2

WEBSITE DESIGN

(INSPIRATION)

The imagery is reminiscent of old studio work tapes and vinyls. The foundation of the site came from this imagery. The colors of the album art (and what I subsequently used for the site) are derived from a stained glass window in Jen’s house.

(COLORS)

Jen Foster Website

(NEWS)

We wanted a main page that was a little different than most. Minimalist. Jen loved an image of her with just CD information and a “hamburger” menu. However, she then asked me to link to a couple news items from the homepage, which presented a challenge in keeping it minimalist.

The solution was a sidebar that looks and acts similar to a ticker feed. Any new news items are right there, and actually (in my opinion) add to the aesthetic. I also embedded her twitter feed to display her most recent tweet. That’s as up-to-date on Jen as a fan can be without leaving the homepage!

Jen Foster Website - Home

Jen Foster Website Store

(E-COMMERCE)

The challenge with the entire project came with Jen’s specific requests for e-commerce. Everyone who pre-ordered a physical copy on CD or vinyl was to receive a free download of the album. Therefore, I needed to build a form that would give Jen all the relevant information (addresses, emails, etc.) before allowing customers to download a copy of the album. Not gonna lie, it was more difficult than one might think.

Jen also has international fans who like to buy her music and merch. When creating the online store, we had to organize Table Rate Shipping so the appropriate shipping rate would be charged to people in Madagascar who wanted a T-shirt. Payment was also processed through PayPal®, so we had to factor in those fees as well. Not entirely difficult, but certainly more math than I’m used to.

(MENU)

The menu is just kinda sweet. It was inspired by a work tape. The small category titles derive from the labels above each line, and the handwritten script, along with the numbers, would be the track names.

Jen Foster Worktape

Jen Foster Website Menu

© MATT WILLIAMS