posthog.com icon indicating copy to clipboard operation
posthog.com copied to clipboard

Introducing a "casual" font

Open corywatilo opened this issue 1 year ago • 13 comments

Why add a casual font?

I've been experimenting with adding a more fun/casual font into the mix for use in titles/subtitles in some marketing assets. This includes things like illustrations, ads, callouts (like in hero product images on product pages), and maybe even print media.

The idea is not to replace our existing font (Matter) on our website, but to add something to our library that matches the illustrative style in our hedgehog graphics like this one:

image

Recent experimentation

The font I've been using to experiment with is Londrina Solid, and I chose it for a few reasons:

  • Has a casual, cartoon feel
  • It's bold and chunky
  • Licensing works for us (this is a huge deal with many fonts, especially being an open source company)

Here are a few places I've used it so far:

  1. Session replay pricing graphcs image image

  2. Event types explainer

    image
  3. [Experiment] Future changelog graphics

    image

  4. [Experiment] Product-Market Fit book title/subtitle

    Left: Current design Right: Experiment

    image


Another style

I know there's been some pushback on this font choice, and I'm not 100% sold on it necessarily (though I do think I had a more clear vision in my head about where I wanted to go that I didn't really think to verbalize), so I'm opening this issue to discuss what characteristics we might want in a casual, cartoon font.

Here's another fun font (Zing Rust) I was experimenting with:

image

While it's very different from Londrina, it still has a fun feel that could work well with our hedgehog graphics. Though it doesn't feel quite cartoonish enough.

Compare all three (Matter, Londrina, Zing) below (I like the feel of Londrina the best here):

image

That said, I think we can still do better.


Custom font

One option is to have a custom font created just for us. I think this might be a good choice for us so we can really craft the feel we want. But in order to do that, we need to have a clear vision of what we want and what we don't.

I had a call with a font foundry who specializes in custom fonts and got a quote (private link) which I think is pretty reasonable. (I should note: I never thought I'd be in the position to commission a custom font, but I think it might be the right move here.)


Feedback

So if you have feedback about fonts – or can articulate why you don't like Londrina – I'd love to hear it here so we can keep it in mind when evaluating options going forward.

corywatilo avatar Aug 16 '24 17:08 corywatilo

Personally, I find Londrina hard to read unless it's used in headings. I definitely prefer it to Zing Rust, but just from a readability POV I'd prefer us to use it sparingly.

358664584-ef27f17a-3833-474d-8f0d-5424bff98408

E.g. Here, I find the second line noticeably harder to read in Londrina than in Matter.

I admit I'm not really a fan of the style - I think it looks a bit child-like, in a comic sans sort of way - but that's purely subjective and probably a kneejerk reaction to change. Trust you, Eli and Lottie to make the real call here.

joethreepwood avatar Aug 19 '24 09:08 joethreepwood

  • I sense the consensus on Londrina is it's fine, but doesn't spark joy, with which I agree. Fwiw, I think it works well illustrations, like the event types graphic, when paired with the sloppier line art style, but it doesn't work in other contexts – e.g. the book cover, changelog graphics. Readability is meh and it lacks the impact you want for a heading.

  • I'd like to see Zing Rust without the rust/rough effect – I assume there is a version like this? It works really well as a heading font for me – e.g. on the changelog mockups. It's almost a comic book font (a good thing), but the rough effect just doesn't seem to fit with the rest of our art-style.

  • I strongly think we should mock-up a t-shirt design with potential fonts as well, as merch is another place where a casual font would be useful. Ideally, whatever font we choose should work in that context, as well as the ones above. I think Zing Rust could work there too but, again, minus the rough effect.

andyvan-ph avatar Aug 19 '24 10:08 andyvan-ph

I agree that we could use a casual font - but I just don't think we've found it yet. Londrina Solid just feels a bit too childlike, I think because the weight and proportions are different for each letter and it makes my brain itch. The other font- don't really like the texture in it plus feels word art esk. Sorry to be a buzzkill here but think honesty is best.

I think getting a custom font is a really cool idea but I'm tempted to find some alternative fonts as inspiration to see if we can nail this vision before commissioning someone to make a font + paying money.

I have done some research and found 4 fonts that match the vibe of the hedgehog drawing style (rounded ends, thicker constant weights, and feel less serious than MatterSQ)

thoughts?

1.

Group 10090

2.

Group 10091

3.

Group 10092

4.

Group 10093

lottiecoxon avatar Aug 19 '24 10:08 lottiecoxon

the weight and proportions are different for each letter and it makes my brain itch

This is definitely the root of me finding Londrina hard to read, fwiw

joethreepwood avatar Aug 19 '24 10:08 joethreepwood

@lottiecoxon I'd like to see no.3 in other contexts, but none of them are jiving with me atm.

(could be that specific graphic isn't ideal for judging)

andyvan-ph avatar Aug 19 '24 10:08 andyvan-ph

thats fair I think it's a hard one to nail, but I would also ask do we really need a new casual font everywhere? I thought Matter SQ did a perfectly good job, and then we let the graphics or illustrations bring the personality

lottiecoxon avatar Aug 19 '24 10:08 lottiecoxon

I've been playing around with another casual font, Westbum.

I like it, but still think it's a little "structured" / less casual than Londrina. It looks nice on its own, but not necessarily when layered with graphics, plus it's a little plain / less identifiable than Londrina.

image

And it really lacks the "umph" that Londrina has here:

image

corywatilo avatar Aug 20 '24 14:08 corywatilo

PS here are a bunch of styles I experimented with

image

corywatilo avatar Aug 20 '24 14:08 corywatilo

fwiw, if we're thinking of using the casual font more heavily, I think that the custom route makes more sense. given how people like to copy us, it would give us something they categorically can't steal!

andyvan-ph avatar Aug 20 '24 14:08 andyvan-ph

I like these + tbh I'm not mad at Westbum either - kinda like it

Screenshot 2024-08-21 at 15 40 15 Screenshot 2024-08-21 at 15 40 10 Screenshot 2024-08-21 at 15 40 22

lottiecoxon avatar Aug 21 '24 14:08 lottiecoxon

Thought, possibly late: Why don't we just use Lottie's handwriting as the font?

Same as we do for the Hogs, e.g

Screenshot 2024-09-26 at 13 04 18

joethreepwood avatar Sep 26 '24 12:09 joethreepwood

I mean if we wanna send the font guy my hand writing and see what he can do with that I wouldn't say no

lottiecoxon avatar Oct 03 '24 12:10 lottiecoxon

Why don't we just have you handwrite everything instead, manually? You can start with the privacy policy!

joethreepwood avatar Oct 03 '24 13:10 joethreepwood