David Foster

UI/UX Design & Front-end Development

Redesigning the official website of the Hollywood awarded musician, composer, record producer and songwriter David Foster. Updating its visual appearance and making a seamless user experience more approachable for his fans.

Summary

David Foster is a Canadian musician, record producer, composer, songwriter, and arranger. He has been involved in the production of albums and hits from artists like Michael Jackson, Celine Dion, Madonna and more than 50 other recognised artists around the globe. Foster has won 16 Grammy Awards from 47 nominations.

With such a busy live involved in the music and media industry, it’s normal to not having time to update his website, outdated since 2001. Back in 2017, I was tasked with the mission of redesigning his online portal to update it to the latest trends.

The challenge

As a musician and producer, with a so wide scope in social media and latest celebrity news, redesigning the website of a personality like David Foster would mean delivering the best and highest quality digital product and having to deal with tight deadlines to follow his tours and shows.

Some of the challenges that this meant were:

  • Update the online brand identity according to the latest trends and make it represent all that Foster’s work stands for.
  • Design and deliver a full website in less than four weeks, having to deal with stakeholders from both ends as well as his own sign off on the designs.
  • Integrate 3rd party services such as ticket RSVP methods as well as music players and social media feeds to ensure a smooth and approachable feed of updates.
  • Set up the news feed in a way that could be easily updatable as well as understandable for marketing teams to take care of it.
  • Develop the website with the highest code standards and optimise it for both desktop and mobile and maintain a low-size file to make it accessible from everywhere.

Features

Having a website with the highest standards and low maintenance is a major quest to take and a difficult thing to achieve. These are some of the reasons that we decided to design and build a WordPress site taken as many integrations as possible to make sure the website was always updated but doesn’t require major updates regularly. Some of these features were:

  • Bandsintown integration with a live feed of performances as well as the possibility to get more information and book tickets when available.
  • Awards feed displayed on a selector with different branches displaying its career winnings since the 60s.
  • An archive with all his records from more than four decades where he has been involved, including record information, tracklist and cover artwork.
  • Additional information such as Media with his latest snaps from his performances as well as information and a shortcut to David Foster’s Foundation.
  • Integration with all his social networks as well as his store for easy and accessible connections with external platforms to his website.

An updated vision

New times require a new approach, and therefore redesigning David Foster’s website meant to update his visual online presence. Going from a ’00 visual theme to a more trendy and modern look following the guidelines of his values as an artist, we came up with a brand new brand identity that would suit perfectly the website.

Some of the aspects of this new appearance involved:

  • A dark theme with predominant grey scale images and gold accents.
  • Use of serif typographies to give a more modern yet serious look to the copy of the site.
  • Full-width elements with predominance of pictures of the artist as well as small pieces of the copy where needed, otherwise book-look pages with well tabulated paragraphs.

Mobile

One of the main goals of redesigning David Foster’s website was making the website responsive, and therefore accessible for all users in all kind of devices.

Foster’s previous website was a static HTML non-floating website that looked either cut or unscaled on mobile devices, and we had to have in mind the public that visits the website using their phones when crafting his new website.

This is the reason why, given that his career is focused on being in the go and touring and visiting countries, we came up with a website accessible on mobile, high contrasted with a dark theme and text-based. So that it’s also light-weight and fast to load.

Launch

After getting the prototype signed off and started building and connecting all the integrations with the CMS, and having spent almost three weeks of design and development, it was the time of doing the final testings with our beta testers and performing the final amendments.

After getting the portal signed off, we managed to publish it and go live right before David Foster started his tour around China and Japan, ensuring the success of his brand new website world wide.

Get in touch

Want to start a project with me? Let’s get started.