Primer Brand and Illustration Guidelines

[primer]

Primer Brand and Illustration Guidelines

[ashygee]

Template for social images started in Figma.

Because Figma has pre-set frame sizes for various social media platforms I think we can just add to this file. I'll set up some more social images that we can drop into our posts in the future.

[broccolini]

Thanks for working on this @ashygee! I think I need to see the header illustration in context with the rest of the page, it's hard for me to tell what works best when it's cropped tightly since that's not how we see it in the browser—if you have this setup with the full page in Figma can you share the link, or we can jump on a call and look through it.

Octicons is almost there but I think has a few too many details that are distracting against the surrounding content, though it looks slightly closer to the content below. I think it's also due to the higher contrast of some of the elements. Perhaps we can look at this in the browser or Figma together too?

[broccolini]

I'm inclined to go with the first one (dark background, more detail) and see how it works in practice. I'm fully okay with being wrong and it not working, but I think best way to test this type of change is to ship it :)

[ashygee]

@broccolini Great! I'll export and we can replace and test

[ashygee]

Homepage Illustration Update

Original

Option 1

Option 2

Option 3

Octiocons Illustration Update

Original

Update

CC @broccolini @emilybrick

[ashygee]

Favicon updates are tied to #114.

[ashygee]

Thanks for the feedback @broccolini!

I don't have a mock with the rest of the page yet but that's something I can set up for further discussion. I'll share the link here once I have it up.

For the Octicons illustration I will remove some of the outside details and see how that feels.

[ashygee]

@broccolini I've set up a Figma file with some site mocks to view the illustrations within the full page. I also went ahead and removed some of the outer decorative elements on the Octicons illustration. Looking forward to discussing with you! 😄

[ashygee]

@broccolini Avatar ideas up on Figma. There are two versions of the paintbrush taken from the previous favicon exploration in #114.