Export and publish suitable asstes to CDN

[james-nash]

Is your feature request related to a problem? Please describe.
While the gravity-particles repo is intended to become the single source of truth for many of Buildit's brand assets - such as the logotype - a git repo isn't the most user-friendly way to retrieve such assets. Also, people often need things like the logo in various file formats - e.g. Keynote doesn't support SVG files, so you need a PNG or EPS export.

So, we should export to formats like that and then publish them at an easily accessible URL for others to conviently download from or link to.

Describe the solution you'd like
I propose we expand our build scripts to:

• Export SVG masters to a variety of formats:
  • Optimsed SVGs (e.g. by running through SVGO) that are suitable for distribution
  • PNGs (most likely with transparent backgrounds)
  • EPS and/or PDF (for Keynote and iOS)
  • Potentially, we could also create a "brand assets" ZIP file that bundles all of the above for a convenient single download (which could be handy for Logo download #14)
• Publish those exported assets to relevant places:
  • Optimised SVGs should be included in the @buildit/gravity-particles NPM package (see Migrate existing SVG assets to particles #15), but other formats should be excluded from that (there's no need for PNG or EPS in downstream web projects)
  • All formats should be uploaded to a versioned URL at static.buildit.digital - just as we do for the gravity-ui-web releases. Ideally, we'd also generate an index page, similar to https://static.buildit.digital/gravity-ui-web/

Additional context
I suggest this issue only covers the mechanics of exporting and publishing these files. We'll separately need to consider how best to make them easily discoverable. On that front, I'd suggest:

• In the first instance, we simply update the existing "Buildit brand" page on our internal Confluence wiki to point to the new URLs
• Longer term, Gravity needs a dedicated website to house all its docs, principles, component libraries, etc. and I believe that would be the natural home for a "brand assets" page that links to these things.

[james-nash]

Oh yeah - one additional complexity is color. The current SVGs (incuding the Buildit logotype) are colorless shapes only. For integration into UIs that's exactly what they should be, since the fill colors that get applied to them are highly context-sensitive.

However, for other uses like Keynote or PowerPoint decks, we may need to pre-fill the SVG shapes with colors. In fact, for PNG exports we necessarily need to do so, since bitmaps can't be recolored like vectors can. Of course, those fill colors should be taken from our color design tokens!

I was doing something similar at home, and started making a Gulp plug-in to fill SVGs with colors: https://github.com/c1rrus/gulp-svg-fill

It kinda works but it's pretty noddy right now. It'll suffice for starters, but contributions to make it better are of course welcome!