I worked with a small team to redesign the three main pages of Google Firebase’s marketing site. I helped design the themeboard the client selected and the initial homepage layout, but my focus was primarily on the layout of the usecases page and creating the final illustrations used throughout the site.
The themeboard that was chosen stuck to Google brand guidelines but had a few twists. The different sections of content were presented on large white cards with restrained copy and straight-forward layouts making the page scanable for developers and approachable for marketers (their two user groups). We introduced a new take on the Firebase illustrations that were informative yet fun and focused on lighting and layering.
I iterated and worked closely with the Firebase team to create illustrations for each of their complex use cases. I subtlely implemented Google’s shadow and texture requirements with the playfullness found in Firebase’s initial illustrations. I contianed scenes to floating circles, refinied the color palette, and utilized opacity and shading to add depth and focal points.
Many of the illustrations needed to exist in multiple locations. I decided to create simpler versions of the illustrations to live in the secondary locations that could be scaled much smaller and still communicate the core message.
I created the layout of the use cases page to adapt to three different variations of use cases: (1) those with text, illustration, and a branded case study, (2) text and illustration, and (3) with text only. Each needed to explain the overall purpose of the use case and show the Firebase products used. To keep the page scanable on mobile, each case is collapsed into a drawer that can be expanded to reveal the rest of the content.