Create with Google
Development and maintenance of Create With Google's website and Inspiration Hub.
The project
Ustwo Sydney helped Google in launching a web platform for creative makers.
“Create with Google” shows what’s possible across the Google Creative Canvas with tools, creative considerations and inspiration to help bring creative ideas to life.
As the main developer of the website, I was responsible for building up the front-end components in accordance with Material Design conventions and Google’s security best practices, and put them together into a multilingual, CMS-driven website visited by thousands daily.
01
Animating SVGs
To give life to the website, I animated a few scribbles as soon as they become visible in the viewport.
Each of these SVGs is composed of the path of the scribble, used as a mask, and an image. By animating the stroke-dashoffset CSS property of the mask, the image underneath is progressively revealed, producing a nice impression of the image being painted.
02
Inspiration hub
The inspiration hub is where one can find the best case studies of what's possible across the Google platforms.
The page is rendered with all case studies by default. A series of data-* attributes are applied to the cards, referring to their properties: platforms, verticals, etc. It is then possible to filter the cards on the front-end through the sidebar.
03
CMS-driven pages and sections
The whole website content is dynamic and multilingual, provided by a headless CMS.
Each page has been thought individually to receive a specific list of section types, allowing for just the right level of customisation. These sections are then parsed and rendered from their associated Jinja components (using macros).