WebGPU logo/mark?

[koalie]

Hello!

As far as I could find, there isn't a logo or mark for WebGPU. We've gotten a request for one from someone who most likely wants to mention WebGPU in a talk. Logos or Marks are useful for other things.

Has the group thought about creating one? If you take free advice (\<insert grinning emoji>), please consider using the W3C Blue! (#005A9C)

[grorg]

Hi @koalie

We haven't got a logo. We discussed it briefly, because someone made one for us but it was too similar to the WebGL logos.

We'll consider all suggestions, as long as they are willing to hear negative feedback 😝

In the meantime, I suggest they use "WebG💩"

[cerisano]

The WGPU project (implementation of the WebGPU native API) already has a logo, and even a rather fetching tee.

[toji]

Resurrecting and old thread because I saw someone use the WGPU logo in a slide deck yet again during a WebGL meetup today and it made me sad. Not because I have anything against the WGPU logo, which is awesome, but because unless that team wants to donate it to the WebGPU working group we should probably stop accidentally appropriating it.

Anyway, I've had a back-of-the-napkin sketch floating around on my desk for a bit and decided to mock it up in Photoshop real quick and throw it out as a proposal:

The basics are that I strongly wanted something with triangles at its core, since that's the basis of so much of what these APIs do, and also really liked the idea of highlighting the "Web" part, in this case by forming an abstract "W". I also like that this hints at fractal complexity while still staying simple and easy to read, which I feel aligns with the API goals well. 😁

I'm not good with colors or fonts, so consider those placeholders. For the colors I started with the aformentioned W3C Blue for the biggest triangle and just kinda nudged the color picker up for each subsequent triangle. 😅 You could also have the same effect with any other base color or have it be a mix of colors like the bottom right variant suggests.

[jdarpinian]

Neat! I think I like the one with space between the triangles. Although replacing the W in WebGPU probably works better without space between the triangles.

[litherum]

A few design thoughts from Myles (not from Apple):

1. We should choose a font that isn't one of the default installed fonts on common OSes - this is generally considered a design sin. Bonus points if we can use the same font that the W3C uses in its communications.
2. I don't see any reason to bold "GPU". I've never seen anyone bold the "GPU" before when discussing this topic, and doing so here seems strange and unfamiliar.
3. I think the fake shadows won't age well. (The light source seems to be in a different place for each of the shadows...)
4. I like the visual pun of using triangles.

[toji]

Thanks for the feedback!

1. Yeah, I'm not very opinionated about the font (and I am under no circumstances to be trusted with colors). I'd want someone with more design experience to make some better informed selections in those areas.
2. Not attached to making "GPU" bold. I had no particular reason behind it.
3. Yeah, the fake shadows are extremely haphazard! If we liked the concept (kinda gives it an origami look) I'd definitely want to put more thought into the placement and direction of the shadows, an possibly even try to physically light it. For what it's worth I think the flat color variants are nicer, though.
4. 🔺❤️

[koalie]

Hi Myles, all,

On 22 Mar 2021, at 23:47 , Myles C. Maxfield @.***> wrote:

• We should choose a font that isn't one of the default installed fonts on common OSes - this is generally considered a design sin. Bonus points if we can use the same font that the W3C uses in its communications.

FYI: The font in the W3C logo is Base Twelve Sans from Emigre Graphics.

Coralie

-- Coralie Mercier - W3C Marketing & Communications - https://www.w3.org @.*** +337 810 795 22 https://www.w3.org/People/Coralie/

[toji]

Thanks Coralie!

Taking into account some of the feedback above, here's what my proposal would look like with the Base Twelve Sans font and removing the bold from "GPU":

I also noticed that the very distinctive "W" of this particular font already looks like overlapping triangles anyway, but the layout was flipped horizontally, so I gave that a try as well:

Personally I don't think it "reads" as well when flipped like this (at least as an English reader that tends to naturally look at things left-to-right") and I don't know if anyone will pick up the correlation in the orientation between the W in the text and the W made by the triangles. 🤷‍♀️ Also, I got a comment internally that the triangles didn't necessarily have to be equilateral, so I tried a narrow version that matches the angles of the text's W:

I'm not particularly a fan of the this version, though I will admit that it works a bit better in the horizontal version.

[koalie]

It may be just me, but the kerning between "P" and "U" seems to need some manual adjustement: reducing the space a teeny bit.

[kainino0x]

Personally I don't think it "reads" as well when flipped like this (at least as an English reader that tends to naturally look at things left-to-right") and I don't know if anyone will pick up the correlation in the orientation between the W in the text and the W made by the triangles.

Agreed.

here's what my proposal would look like with the Base Twelve Sans font

FWIW, to my eye, this font is out of place here. Compared with the W3C logo, there's (1) more text and (2) more graphics (the W logo), and I think Base Twelve Sans is too opinionated/"interesting". The WASM logo uses simpler font(s) but I can't figure out what font it is without opening the .ai file.

[jdarpinian]

How about something like Helvetica Neue Light? I also tried adding a different kind of gradient to the triangles with Unsharp Mask. Maybe not subtle enough.

[dneto0]

I just saw this all for the first time.

I really like the design concept. Great job @toji ! I'm +1 on the no-gaps version, the gaps version, and the several colours version.

(I personally like the endless ability to mutate Google-ish brands such as the Google logo and the Android "android" and still have them be very recognizable. I know it's not for everyone.)

Personally, the fonts shown here look wrong to me. Either ugly, "dated", or in the case of Helvetica Neue Light, too light. I expect a font that lightweight font would not look good when shrunk down, e.g think of the mark/logo at the bottom right corner of a slide deck.

Having read the TeXBook and Metafont book, and having absorbed some aesthetic preferences from them, I expect different font stylings would be needed for ideal rendering for different sizes.

[toji]

After the discussion on today's call, I went back to the logo and tried a few different fonts with it. I liked Poppins as a nice geometric, sans-serif font that works well at varying weights, though I'm certainly still up for suggestions! (Sorry, James. Didn't include your gradients to this one.)

Also, simply because I could, I put together a page that demonstrates the logo being rendered entirely with CSS! Is this useful? Almost certainly not! But it amuses me anyway. 😉

[javierluraschi]

Same SVG from @toji converted to PNG with transparency:

[edankwan]

I am not a designer but this is my take on it:

[Kangz]

Now that we agreed on this logo, can we add an svg to gpuweb/gpuweb so we can reference it everywhere?

[munrocket]

My take on it: 🕸️GPU