Grin Website Redesign

Grin Website Redesign

Have been working on a Grin website redesign lately, and I hope that we - the community can iterate on it together.

Link to Figma: https://www.figma.com/file/mPRsCeypVXyVWmPevwTcGi/Grin-Website-V3.5?node-id=354%3A133

Motivation

Grin currently lacks a solid design language, and I thought we could fix that. The current https://grin-tech.org website doesn’t tell a good story about what Grin is and why it exists. It’s all a bit too bland and neutral.

We should also improve the body copy. I.e. what should the text on the website be? How do we present Grin? Should it the text on the site be more technical or non-technical? Right now, it’s a bit hard to grasp how Grin is different from just reading on https://grin-tech.org. Maybe being a bit more technical on the landing page would be good for explaining how Grin is different from other privacy coins/solutions.

Another goal with the refresh of the website is to make the whole experience more self-contained. You shouldn’t be redirected to Github on every other link, but rather stay on the site for what makes sense. Creating new pages such as a wallet page or announcement page will also be needed.

Art direction

Going back to a more “hacker” look on the site using monospaced text and applying ordered dithering on images.

When landing on the website, you’re met with a black screen with white monospaced text which reminds of a manifesto. The second section of the site describes what Grin is and how it works - here I use a lot of the Grin yellow. The black text on Grin yellow makes the site more vibrant while still retaining the hacker-ish look by combining it with ordered dithered images.

The used fonts are Courier, Times New Roman, and Helvetica Neue (which will need to something else as it’s not a free font).

Closing Thoughts

Grin should be used by everyone, but the website’s target audience should not be everyone, for now.
Most people that visit the site are already in the crypto community to some degree, and I think we would gain more by appealing to that crowd atm. By appealing to crypto devs, cypherpunks and others already in the crypto community.

Some questions to think about:

  • What is Grin to you?
  • Who is https://grin-tech.org’s target audience?
  • What should the art direction be?
    Should it be less/more hacker-like, or should it be something else?

Feel free to comment below, the more the merrier.
Any opinion/thought/idea appreciated!

If you want to work more closely together, jump into the gitter design channel or message me at @nijynot on gitter if you want Figma access or anything else. The design is by no means finished, there’s still a lot to do.

11 Likes

grin-tech dot org

                  **Now with 20% MORE Cypherpunk!!!**
3 Likes

This is so awesome, I really like the thought you put into expressing the cypherpunk vibe back into the website.

2 Likes

Apparently my graphics/drivers are blacklisted by FireFox for OpenGL, and apparently it is not recommended to force-enable it. Can you host the page somewhere that isn’t Figma?

How about having the default style of the page cypherpunk/hackerish, and have the option to with the click of a button switch to a more normal page style?

“Is this cyber-look too much for you to handle? View the page through normal eyes.

The website redesign is fantastic. I like it…super clean and minimal. Thank you @nijynot for your expertise and work. At first, I was concerned about the “hacker” theme, but the rationale is fair enough…most interest in Grin is no doubt drawn from the crypto community, like you said. Knowing one’s audience is huge.

I also like how @nijynot wrote “for now.” Eventually, to be “better money for everyone,” I think it will be fruitful to evolve the image. Today, were a soccer Mom for some reason to jump from her Facebook app and visit the new site, she’s out. She sees hackers and dark web. If she digs deeper, which she likely would not do, and reads that Grin is a privacy coin, she sees Silk Road guns and drugs and porn. She’s out. And soccer Grandma at the Bingo table talking to her friends…we"re nowhere even close to being there yet. @nijynot is right by writing, “for now.” So, “for now,” the new website is great. Do it!

Going forward (one year? two?), a fresher image may eventually give cause for discussion. I’m seeing white with soothing blues or greens. Yes, maybe lame-O, but soccer Grandma! I tip my cap to @nijynot for the work done and for the foresight. Just some thoughts to ponder. :slight_smile:

3 Likes