Revisions to IPFS brand book

[akrych]

As a first step to make or UI Style Guide - I made (first sketch of) IPFS Brand Book Guidlines.
Feel free to comment, if you want to change something or add something :)

PS. I made also set of icons for IPFS, free to use for our community.

IPFS_brandbook.pdf

[hacdias]

BTW, it would be very coooooool to have an Icon Font to use the icons on the web 😅

[akrych]

@hacdias We can do this :) 👍

[hacdias]

Uuuuu. Really nice 😄

[lidel]

@akrych I came up with two areas to think about in spare time: up to you to decide if they belong to PDF version of Brand Book, or is it something for an appendix to a final Style Guide.
Just wanted to write them down somewhere :)

[1] Indicating Progress

A common theme in IPFS ecosystem will be uploading/downloading something, be it data or metadata, stats. We could provide some guidelines/ideas about on how to communicate things like:

• "upload/download in progress" (0-100%) – visual feedback when sending a big file. Some ideas: it could be a clean progress bar, it could be IPFS cube being slowly filled with colour and progress % overlaid over it etc
• "wait a sec" – a spinner for things that do not take more than 1-3 seconds

(Having some prototypes, we could extract them into reusable components)

[2] Icons for popular actions

IPFS exists in a specific problem domain, which makes it possible to anticipate need for specific icons.
We could add a few more to avoid situation where apps are using different icons for the same action.
I suspect the most popular actions would be:

• "Upload" / "Download"
• "Pin" / "Unpin"
• "Share" / "Copy"

ps. found potential typos in PDF: Guidlines → Guidelines, Table of contest → Table of Content :)

[nothingismagick]

The link logo doesn't seem like its style matches the other icons.

I propose thinning out the body of the links like this (but SVG and clean):

---

And here is a suggestion for a way to use the classical idea of the pin and combine it with the IPFS logo.

{edited to be more to the point and less inflationary}

[nothingismagick]

Consistent use of typography within the brandbook:

Page 22 (screenshot):

Page 17 (screenshot):

Note: If the user of the brandbook styleguide writes IPFS with Verdana, the "I" will have serif-esque styling. In Montserrat this is not the case. To this end I would not consider Verdana to be an appropriate drop-in replacement for Monserrat.

[nothingismagick]

It would also be a good idea to have the English proofread before publishing this document again:

"Typerface?"
"secoundary?"
"is safe web font"
"Everywhere when"

"How to write paragraph"

"pallete"
"maincolors"
"the Navy blue"
"this include also they"

[editted to remove unflattering and needless commentary]

[nothingismagick]

Starting on page 15, the subheader at the bottom right is "Visual identity" - it should be "Logo" until page 19.