Oh good find! Just posted something there. Please upvote everyone!

Just started playing with Gatsby and it looks great. I've been wanting something to easily write static files in other formats besides just markdown. Here's a pen I did a while back with some type styling around "the Great Gatsby" if it helps spur the process. http://codepen.io/Gajit/pen/Qyjpoy

Cool logo!

I don't think I want any reference to the actual book though. There's only a loose connection between the book and the project. I just picked it caused I like the name + it was open on NPM :-)

My contribution :dancer:

Just a note: @renatorib I like the way you smashed the colors into the last one, 70's style. :D

My 2 cents: try to not be to close to Phenomic colors https://phenomic.io/ (which is another React/webpack static website generator)

@MoOx why? Are colors.

@renatorib those are great! Let's turn this thread into a logo thread — let's get a bunch of ideas and then pick one for the coming website, social properties etc.

I'm not great at logo design myself but I'd be happy to get things going, and provide some feedback. @KyleAMathews what do you think the logo should evoke? Any other project logos that you like?

@renatorib although I think the lettering logo you made looks great, maybe we want to stay away from the book and the retro theme? Also I don't know how readable the lettering would be at smaller sizes?

Without directly referencing the book or the movie, maybe there's elements we could take from the movie's visual design?

Also whatever we end up with, it'd be great to have something that's easily usable as a favicon/icon/square logo.

@SachaG I like this from the movie design:

Inspite it may look-a-like a freemansory symbol.

@SachaG I haven't thought much about it yet... don't have much experience with logos either. Will chime in when I've thought things through but in the meantime everyone feel free to work through ideas.

Right now I don't have strong feels for or against drawing inspiration from the book/movie. I didn't pick the name because of them per se so we don't necessarily need to hold to its aesthetic but that being said Art Deco is cool and choosing it as our aesthetic would simplify picking fonts, designs, etc. And people would enjoy the association between our name and the logo/design.

https://fonts.google.com/specimen/Poiret+One for example is a really nice art deco style font that's on Google Fonts. We could use that for our headers and perhaps logos.

Some other fonts that fit into the Art Deco mold:

• https://typekit.com/fonts/anisette-std
• https://typekit.com/fonts/futura-pt
• https://typekit.com/fonts/brandon-grotesque
• http://www.dafont.com/andes.font
• https://www.thedesignersfoundry.com/products/neue-droschke

Ok, got into the spirit of things a bit :-)

Here's Andes:

Poiret One:

Anisette:

Futura bold italic:

Looking at the other open-source static site generators, a lot of them use their initials as an icon (H for Hexo, MM for Middleman, etc.). So maybe we should do something around the "G"? So an art-deco G monogram of some kind?

Yeah, that could work. Try some stuff and throw up some samples!

@KyleAMathews I like the Poiret One font style. I also the G of it beautiful as a standalone lettering (for the icon).

Here's an early idea:

Let me know what you think!

@SachaG nice!

Which fonts are those?

It's Futura Bold.

Do not aim at low hanging fruits: yes of course book and movie is obvious association. But what in common in tool and movie? One way to get to logo is to start from moto.

Brandon Grotesque is another great option for a font — inspired by Futura and other geometric-style fonts popular in the 20s-30s. One of the more popular web fonts right now. Would be great for headers or body on site.

https://typekit.com/fonts/brandon-grotesque

@SachaG Love that simple G for the square logo!

@rgbkrk agreed ❤️

@SachaG you have a bit of time to play with the design? I was thinking a good place to try out your design would be our Twitter avatar which is currently quite hideous. What do you think about taking your monogram and colorizing it a bit and I'll put it up on Twitter? I'm going to start on the website this week so will be playing around with some design ideas that I'll share.

@SachaG Wow, love that logo.

OK, I'll work on something :)

Did you have any specific color in mind? How about something like this?

Edit: cropped PNG version here: https://cl.ly/hboi

SVG:

• https://cl.ly/hbTv
• https://cl.ly/hbjr

Trying colors similar to the movie could be nice. This page has good stuff
http://vintagedancer.com/1920s/fabrics-and-colors/
On Wed, Sep 28, 2016 at 6:41 PM Sacha Greif [email protected]
wrote:

SVG:

• https://cl.ly/hbTv
• https://cl.ly/hbjr

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/gatsbyjs/gatsby/issues/408#issuecomment-250348924,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAEVh3Dmlxhhi5oymDM46nXELO_EpgBkks5quxdRgaJpZM4JuuKY
.

I thought about it but I figured it might be better to the clean, modern "JS library" aesthetic (https://facebook.github.io/react/, http://horizon.io/, etc.) rather than go all-out on the retro style.

Although I guess maybe a mix of browns/pinks/oranges could work if it's not too heavy? In fact I'm using a similar color scheme on http://stateofjs.com

Just my two cents here. I think @SachaG is right with the clean aesthetic. Gatsby should fit in well with other parts of the ecosystem (namely React, Webpack and GraphQL). In any case, if we were to go with a vintage look, then a more retro looking font would make more sense.

Here's a more retro color palette (not necessarily for these specific colors, but just for a general idea):

Btw, regarding the logo font I think we need to stay with Futura, otherwise it won't match the "G" in the monogram.

Doesn't mean we can't use another font for body copy. For example I quite like Montserrat:

https://fonts.google.com/specimen/Montserrat

f92672 on #21232d might look nice as well

How about using a monospace font for the body copy? Gatsby is going to be used mostly for blogs and documentation sites. The font used by iA Writer is stunning.

I like monospace fonts for headings, but they're not super-readable for body copy imho. You'll note iA don't use a monospace font for their blog, even if they use it inside the app.

Trying it out :-) https://twitter.com/gatsbyjs/status/781360858467213312

Here's a slightly tweaked version with more contrasted colors:

And PNG of just the orange version: https://cl.ly/hbRC

BTW it's funny, somehow my designs all end up with the same orange-and-beige color scheme… see http://sachagreif.com/, http://www.communitybuildingguide.com/, and http://www.patternify.com/

I guess it's good to have a style :)

I don't know that we need to keep with the aesthetic of React, etc. I don't get the feeling that a ton of thought went into their branding and also there's a lot of value in having something distinctive. Gatsby is already a pretty distinctive name / aesthetic so I say let's keep running with it.

@SachaG nice! I'll re-upload that to Twitter for higher-def.

I feel like https://middlemanapp.com/ is a nice example of a more muted, less "startupy" color scheme with their mustard color. You changed my mind, I think it's worth exploring that direction too :) It definitely has more personality.

More inspiration ;)

@SachaG yeah :-) it's fun/effective to get in a grove and roll with it for a while.

On fonts, totally cool with Futura. Typewolf suggests as a font pairing, New Caledonia which I rather like. It'd cost us $140 for the 400/400i/700/700i fonts but we could use some OpenCollective money for that — https://opencollective.com/gatsby

@f0rr0 I really like Space Mono among monos https://medium.com/google-design/introducing-space-mono-a-new-monospaced-typeface-by-colophon-foundry-for-google-fonts-84367eac6dfb#.h1cyt77cq

Anonymous Pro is cool too by same designer behind Proxima Nova https://www.typewolf.com/site-of-the-day/fonts/anonymous-pro

Yep I used Space Mono for https://crater.io/ and http://stateofjs.com/. Agree that Anonymous Pro looks great too!

In fact here's a site pairing Futura and Anonymous Pro: https://www.typewolf.com/site-of-the-day/per-sandstrom

@SachaG yeah — I really like Middleman too. Something a bit off-beat and with more personality would suit my tastes.

Also more strategic — my feel is Gatsby can find a lot of traction beyond the early adopter React.js crowd. The designers, web agencies, hobby developers of the world. Something not so "I'm a JS library" would feel more approachable and friendly.

Poppins (a Futura-esque font) and Anonymous Pro do look nice together — try them out on http://kyleamathews.github.io/typography.js/

Oooh I love the new colors @SachaG and the mark, very lovely 👍

I think a monospace font might be too techy, but then you need to be able to write Markdown to use Gatsby so maybe that's a fair assumption…

@mxstbr with the new GraphQL layer you'll be able to write posts in hosted CMSs like Contentful or even just use Wordpress, etc. https://github.com/gatsbyjs/gatsby/issues/420

We'll also be able to do crazy stuff like use Trello as a CMS https://changelog.com/trello-as-a-cms/

Ah yeah, then I'd definitely not go with a monospace font to not invoke that code-y feeling.

@KyleAMathews Anonymous Pro looks great if we decide to go with monospace, imo it looks techy since we are used to seeing monospace fonts and associating it with code. To a non tech person it would look like just another font and a neat one at that.

This is Brown - it looks friendly and approachable while remaining traditional in some resepects https://lineto.com/The%20Fonts/Font%20Categories/Text%20Fonts/Brown/

@ArchieHicklin I liked this so much. You can put a outline effect like this

Playfair Display for headers + Futura for body font looks quite nice.

And adding a monospace font to the mix is cool too. This is Space Mono:

That does look nice! I'd be curious to see what it looks like with the retro palette, too.

how about more cute? 😂

@SachaG

@ArchieHicklin haha! Did you draw that? That'd be hilarious to have him popping up throughout the design. A little whimsical add-on.

Or maybe little as part of little helpful callouts — he could be the butler or whatever giving hints.

Here's the svg http://imgh.us/gatsbysvg.svg - maybe can even add a green light on a dock across the bay 😂 @KyleAMathews yes just made it in Sketch on a lunch break.

😆 a green light for sure.

@KyleAMathews colors look great!

@ArchieHicklin I love the character! I can totally see him popping up throughout the site offering helpful tips :)

@SachaG Haha - thanks! I love how http://emberjs.com/ do that! Provides a nice design voice

Tweaked the colors for code some again this morning to ensure they were contrasty enough (4.5 is the general guideline — use http://leaverou.github.io/contrast-ratio/#%23b55021-on-white to test). Nice way to do this is manipulate lightness of colors in LAB color space (matches how humans perceive color better than other color spaces) — using http://davidjohnstone.net/pages/lch-lab-colour-gradient-picker for that.

I'll be building out an initial version of this soon to try it out live. So I can reproduce it: fontSize: 16, lineHeight: 1.42, scaleRatio: 2.5, playfair display, futura, space mono, headerGray: 20, bodyGray: 30, link color: #367f8a, code background: rgba(246, 224, 196, 0.38), hljs-string: #b55021.

Something I was wondering – should we use that off-white orange color as the background for the whole thing? Or keep a white background?

We could try it for sure — one cool thing about using https://www.netlify.com/ for hosting (as I'm planning to) is that when you make a PR, it rebuilds the site with your changes so it's easy to try something experimental and share it for feedback. I think I'll start with white but yeah, I'd be curious to see whether a colored background works. Ember does that and it works.

Oh that's pretty cool. I've been using Heroku and now GH Pages for my static sites, but I'll check out Netlify next time.

Just had a thought, maybe we could use the newly-released Figma to do a live collaborative design session around the Gatsby identity/homepage?

I'd be down for that! Next week is pretty free for me.

If you want to join, choose some times when you'd be available — http://doodle.com/poll/tnf6tyu3my7ez3y6

Make sure to change your timezone if not in PST.

Let's plan on the Wednesday 7-8pm PST slot.

I created a Figma canvas for us to use https://www.figma.com/file/cdetTt0bxTyIYVJMJdNZKVm1/Gatsby Fill free to start adding stuff before Wednesday :-)

I'll create a Google Hangout link and post it here before then that we can use for talking.

nostalgic fun
Also like @ArchieHicklin's idea with mackey mc mascot, keeping it light hearted

I added an art-deco typeface to the figma board

Here's the hangouts link — I'll be on in 1.5 hours or so https://hangouts.google.com/call/4ro2xvkn6rco3avensilb77nlue

Great! Is it a public hangout link? It'd be great to broadcast it live to the world :)

Good idea! Here's a live broadcast link — ignore the previous one https://hangouts.google.com/call/kzovtzb4urdx7cijeiwft6z6mqe

What's the public link if people just want to watch but not take part?

This (I think) http://youtu.be/uGQ3YCvK3fM

FYI, that link it's working.
ᐧ

On Wed, Oct 5, 2016 at 9:34 PM, Kyle Mathews [email protected]
wrote:

This (I think) http://youtu.be/uGQ3YCvK3fM

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/gatsbyjs/gatsby/issues/408#issuecomment-251845766,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AALns0S8BCn1Ze2VDJueQHi3pJNeL3O-ks5qxFAUgaJpZM4JuuKY
.

David Landry

participate: https://hangouts.google.com/call/ammh5lzslbfyjdpkf6gk5v4p54e

view: http://youtu.be/BY9Jv1gWFwY

Hi all! Just wanted to share an idea I had for the logo. My idea is to have the letter 'G' with icons representing the build process (Files -> Webpack -> Loaders -> Static HTML) built into the path of the G. I knocked up a quick image to convey the idea better, with the circles representing where the icons would go.

I think it looks futuristic, and conveys Gatsby quickly.

This is an iteration on the arrow/futura G logo.
I'm not great at colour so I just chose red/orange for now.

I think, the 'Brown' typeface could go nicely with the above

http://www.colorhunt.co/ a great resource for colour mixes

Hi all! I was going over your artboards (or Figma analog of artboards) and was wondering how was the experience overall using Figma and particularly the export process. Is it comparable to Sketch?

@f0rr0 I didn't try exporting anything yet, but overall I really liked Figma! Very intuitive, pretty fast, and the live/collaborative aspect makes it great for brainstorming.

I like the aesthetic of https://github.com/gatsbyjs/gatsby/issues/408#issuecomment-250372331 although the font immediately makes me think of Google, but it gave me an idea someone might want to try implementing.

That piece behind the G should resemble messy papers and then the inside, the horizontal piece of the G could be used as a ledge to hold a stack of papers. I'm not sure it would work as a flat icon though, you might have to make the G 3D and change the viewing angle.

@SachaG can you share the vector version of your logo? would like to try some variations - great job!

@eliwilliamson see https://github.com/gatsbyjs/gatsby/issues/408#issuecomment-250348924

What if you mixed the color of this https://cloud.githubusercontent.com/assets/1271434/19060757/b23e3c1c-899f-11e6-8541-b08564309ce4.png
With the gentleman character and used the futura font?

@mdxprograms

@ArchieHicklin yes!!! that's exactly what I was thinking. nice work

Hey team, I wanted to properly introduce myself and talk a bit about a v1 site teaser concept that @KyleAMathews discussed the other day. My name is Eli and i'm the Creative Director over @netlify - at Netlify, we believe it is important to support open source projects in any way possible. Since I don't hold the talent on the back end that Kyle and others do, I thought i could contribute in design. Kyle and I met the other day to discuss things and we both agreed that with the Gatsby 1.0 release around the corner, we should get a simple teaser page up - additionally, a docs library for easy reference. In talking with Kyle, we found that we can continue with this 20's motif in the teaser page. We specifically were inspired by the old Packard Co. car ads. That said, I plan to work on some mocks Monday that should set us up to get something launched very soon. Before we begin, I wanted to open up a discussion around other points of inspiration. Feel free to note some sites or designs that do things well that we should consider in this initiative. Thank you!

@eliwilliamson welcome Eli! Really looking forward to your help!

Spent the morning getting an early version of the website up with the coloring/typography ideas we've discussed in the past https://gatsbyjs.netlify.com/

Would love to hear your thoughts! Feel free to clone the repo and start playing with ideas. The site is under the www directory on the 1.0 branch. Docs pages live in the docs directory.

@KyleAMathews i was exploring that retro concept and had quite a bit of fun but found the pallete a bit limiting as featuring sites requires something a bit more monochromatic to support varying color in a thumbnail. After a v1 which leaned a bit too literally towards the 20's motif, i think v2 is a happy compromise between modern software (the inherent nature of gatsby) and a retro nod/motif. Check it out below and let me know what you think! What works, what doesn't work, etc.

Very cool Eli! That car there is amazing :D Your take on the Monogram is really nice as well. Feels a touch more art deco than our current one.

I'm really liking the pallette and the distressed backgrounds. I can see what you mean that a more monochromatic pallette makes example sites pop more which is definitely important.

If you don't mind — could you share your v1? It's nice to see all the source ideas as that might help spark more ideas in the rest of us.

Which fonts were you using? Could you try a revision using Futura/Playfair Display/Space Mono? Or how do you think about how they look at https://gatsbyjs.netlify.com/docs/old-readme/?

You can drop the "Coming Soon!" — I'm pretty sure this won't be launched until 1.0 launches as well. The website will be used for the 1.0 docs but not publicized until the 1.0 launch.

Also please drop the "with netlify" :-) we really appreciate your help but we can't elevate any one sponsor that high. Also it's confusing as Gatsby is host agnostic. My thought is there'll be a "sponsors" section further down the page for your and other company/org logos.

I really like the "quickstart" section but I think we should have a slogan and a bit of verbage about why Gatsby is cool first like Jekyll's website https://jekyllrb.com/ This is the slogan we've been using "Transform plain text into dynamic blogs and websites using the latest web technologies. A React.js static site generator." TBD if we'll keep that but try adding it?

Would love to hear others' thoughts! This isn't my area of expertise for sure :-)

Great feedback @KyleAMathews per your request here is my v1 that didn't quite have a good balance IMHO. Also, please forgive the padding, type ratios, etc. here as i didn't make a polishing pass on it after deciding to shift direction.

I was using Futura (medium and bold) for logo and utility cases, signpainter for 20's commentary (...bee's knees, etc.), Big Caslon for more display fonts in content, and lastly my system mono font for code cases. I will try a version with the fonts you mentioned above.

I'll be sure to drop the 'coming soon' comment, move netlify's promotion elsewhere, and add the gatsby blurb above the 'quickstart' section.

Stay tuned...

@KyleAMathews check out this latest iteration. I think it bares a closer resemblance to what you're looking for. I also included an alternate which shows the same mockup just using the fonts you suggested. TBH i was weary that playfair might be a bit to playful for a utility font but it _faired_ well as a display font for the intro copy IMO.

V3

V3 w/ kyle's selected fonts

please let me know which typeset you prefer and if there are any other trailing changes. If all looks good, i'll translate this design language to a simple docs page. just give me the 👍

Nice! Yeah, let's go with Playfair — it's a favorite of mine plus our font budget for this site was already eaten into for Futura :-) (though Libre Caslon is nice too)

Let's vary the size of text on the left a bit like http://harpjs.com/

Change the first section to "Create dynamic blogs and websites using the latest web technologies" and make it bigger.

How were you thinking the rest of the homepage would look? Keep the aquaish color as the background further down? Switch to a white background? Might be worth exploring that a bit more.

Change "sites on gatsby" to "site using gatsby". Probably don't need "view" as part of those thumbnails. I'm assuming these would click to a page with mini-case studies on the site. Also feels like the sites section to could use a bit more space between it and the stuff above? Perhaps. Seems a touch crowded.

Also let's fill out the quickstart guide a bit to make it more realistic e.g.

npm install -g gatsby
gatsby new my-sweet-site
cd my-sweet-site
gatsby develop

Looking forward to your take on the docs page!

When you post your docs page take, could you post the sketch file as well? Want to have a go at converting the v0.0.01 I created over to your new designs.

It looks like we are running short on time for a docs page mock today but i think the typography, padding, and color palette can be extracted from the landing page mockup (see below). In this version, i added playfair in place of the display caslon. I also updated the description (both in copy and in size) and 'getting started' commands. Lastly, i cleaned up the 'sites using gatsby' section to be a bit cleaner and to lay on a dark backdrop (nice and expansive for adding additional sections down the road).

download sketch file

Nice work! I like the layout but I have to admit I'm not a huge fan of the broken-up background. I would probably pick a plain background with a lighter color, something less aggressive. I might take a stab at it myself later :)

First Attempt

Hello everyone, here is my first attempt at the logo. I am still looking for a font that goes with the entire aesthetic. Let me know if I should continue in this direction.

Cheers,
Yogesh

the g reminds me of google for some reason but I like the simplicity and the color

Loving the yellow/gold on the black background of the last mock, although I agree that the blue section feels a little awkward. I think the logomark that @SachaG did is perfect. It's got a timeless vibe to it. I'm not a big fan of Playfair paired with Futura. I'd recommend something didoni style. Here's one I've been kinda digging: https://fonts.google.com/specimen/Prata

@gregcorby Prata is nice! https://prata--gatsbyjs.netlify.com/docs/old-readme/ vs. the existing Playfair Display https://gatsbyjs.netlify.com/docs/old-readme/

Prata:

Playfair:

Another open source didot is Computer Modern Serif (designed for Tex and used all over in math/scientific papers) http://checkmyworking.com/cm-web-fonts/

Hi all! Here is another contribution to the Gatsby logo. (Handwritten/calligraphed in Illustrator)
It's just a draft and needs some tuning. Let me know what you think

Hey folks, as part of working towards a major new release (alpha 11) that'll be rolling up my last ~2 months of work, I've taken another crack at playing with the typography/colors of the website. Would love to hear what you think!

https://unist-graphql--gatsbyjs.netlify.com/docs/old-readme/

I'm fairly happy now with the typography. Been using https://www.typographychecklist.com/ lately on some client sites and the author frowns on using Futura as a body font. So I moved that to be the header font and used for the body font TeX Gyre Schola — an open source revival of Century Schoolbook — a modern serif from the early 20th century that pairs nicely with Futura. https://www.fontsquirrel.com/fonts/TeX-Gyre-Schola

While I'm kinda competent now at typography, I'm just fooling around with colors. I used http://davidjohnstone.net/pages/cubehelix-gradient-picker#23,8,1.11,1.12,1,0.1,0.95 to pick different colors but I'd love someone else to take a crack at picking colors for the various elements.

If you want to play with the site, checkout the unist-graphql branch. The typography & colors are defined in https://github.com/gatsbyjs/gatsby/blob/unist-graphql/www/utils/typography.js

Is renaming considered? :)
I don't know about you, but to me Gatsby is oftentimes hard to spell right without thinking too much. I have a name idea - will throw it in if renaming is an option.

No... not at this point. It's a bit too old and well-known now. Perhaps
adding an alias to your shell would help?

On Sat, Feb 25, 2017, 10:00 AM Radu Brehar notifications@github.com wrote:

Is renaming considered? :)
I don't know about you, but to me Gatsby is oftentimes hard to spell right
without thinking too much. I have a name idea - will throw it in if
renaming is an option.

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/gatsbyjs/gatsby/issues/408#issuecomment-282500773,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAEVh5lLkQxrApWrJwzsPEMWbsMDzjLcks5rgGwsgaJpZM4JuuKY
.

Could I suggest more line-spacing for the typo? Or maybe just more white-space generally? Seems a little cramped.

Still taking logo suggestions? If so, here's a 'modern' approach, based on notion of cmd-line etc.

@YoungElPaso what are you referring to? The website?

Everyone's had some great submissions and I'm onto my third production Gatsby site so I'm so thankful for the work @KyleAMathews has done. 🎉

My suggestion for the site (without redesigning everything) would be to strip it right back. The site is superb so far but there's something a bit off. I feel like (rightly so) everyone was looking to incorporate Gatsby into this art deco theme with the logo and identity.

I think that's superb and I love @SachaG 's logo. But I also feel that along the way the website identity has now become tied to the logo. Although this sounds rational I don't think it is.

Kyle has said himself that Gatsby was chosen as a name mostly because of the fact it wasn't taken in npm. It's a dope name but I think what's missing is that the website identity should represent why people are using Gatsby. The site is a showcase for the product.

Gatsby is minimal, it's quick to develop with and it's lightening fast. You can show Gatsby to a non-tech person and they will understand why it's used (I speak from experience of actually having done this! Try this with other frameworks lol...)

Apologies in advance because I know this will be an unpopular suggestion but I would ditch most of the colour. Focus on the text (this is why most people will be visiting the site) and the cleanest, clearest way to display that.

I would switch to:

White backgrounds, separating any segments with 1px borders rather than color changes, and then one solid black for h titles, one grey for paragraphs or inactive navs and then one strong bolder orange for active elements, buttons and the logo.

Sorry for the blue and lack of orange - I was doing this quickly in Chrome dev tools.

Also - should probs use an SVG for the logo rather than a png when it's officially launched - no need for visitors to cache it.

Nice. Personally I'm attached to the logo, but as far as the colors as concerned I could go either way.

@ArchieHicklin interesting! I'm not attached to the colors/fonts/art deco identity per se but I do really want Gatsby to have a strong and unique identity. My worry about "stripping things back" is it's too easy to fall back into some sort of generic minimalistic look & feel that'd look simple and nice but would look like everything else out there...

Would you like to do a quick PR exploring more what you're thinking?

Also Futura isn't a great body font so either keep what I'm using or pick another font that goes well with Futura and is more readable for lots of text.

I guess, thinking a bit more, I'd be a bit cautious about moving away from Art Deco. Gatsby is a very well known name and lots of people associate it with this style. So we get a big boost by associating ourselves with these design ideas as well. There's lots of good things about the 20s that we can associate ourselves with e.g. it was a time of confidence and rapid technological growth, etc. Soaring skyscrapers were new as well as cars, airplanes, etc. Lots of interesting motifs we can use on the website and example sites.

I totally agree that there is something "off" about the site still. I'm only a passable designer so I can get things pretty good but my design intuition fails me for the last 15-20%.

I think @ArchieHicklin has stayed true to what a user wants, a clean well designed site focusing on content rather than brand. @ArchieHicklin site is easy to read, digest and navigate. Users going to the site are there for information and not to get a 1920's art deco vibe.

I'd like to suggest an approach that creates room for distinctive design on the landing/branding page(s) while maintaining a sense of simplicity and subtlety in the docs (where function really trumps form).

This is not my idea, I'm lifting it from this site that I think strikes a great balance: https://www.atlassian.com/git (branding)
https://www.atlassian.com/git/tutorials/learn-git-with-bitbucket-cloud (docs)

Specifically I prefer the use of color in these code-blocks (https://cloud.githubusercontent.com/assets/71047/18999381/1ed78c30-86f2-11e6-8bcf-f06862b1fd10.png) to the more pervasive approach in the current design.

(I'm re-doing my personal site in Gatsby now, very excited for 1.0 and using it for client projects 👍 )

@KyleAMathews You've hit the nail on the head!

Definitely keep the motifs - a great way to do that would be to utilise strong iconography with this 1920's style, or even better, modern iconography that uses the 1920s components you mentioned as a way to illustrate Gatsby's selling points (ie Early Ford Model cars to act as a visual motif for precache, 20's skyscraper development/architecture as a visual motif for building with components etc.)

I'd say if that's the direction you want to go - then go all out and make it clear that that is the design motif. I don't feel the current beige and type combo doesn't give that vibe at all although I may be wrong.

@eliwilliamson was spot on with the illustration as a visual element, but I stick to my original suggestion of pulling back and choosing one color to go with while adding clean illustrations to the documentation and homepage to really give it some emotion.

I don't think this is far off with what @ryandeussing was suggesting with the Atlassian links? It's clean and uses icons to add humanism to the documentation.

Perhaps we could look to do the same but with 1920's themed icons instead?

With regards to typography - Futura PT can look good when kerned and spaced correctly https://www.ableton.com/en/help/ but I agree it doesn't look good as a body font unless you really use it correctly.

I'm not tied to the current design at all. I don't consider myself a great designer. I'd love to see more concrete design proposals e.g. create a PR changing the design. My only requirement is that we work towards a unique and cohesive brand and there's tie-ins to existing design ideas around "Gatsby" and NYC of the 1920s.

We're getting close to a 1.0 release so if a few people want to step up and own this, the time is now!

Good discussion! You know what's a good symbol you more design oriented people might wanna consider, for say iconography or whatever, and from The Great Gatsby, but not art-deco: the green light.

https://s-media-cache-ak0.pinimg.com/originals/b6/c2/ef/b6c2ef876f35a8e15842327ecd0cfa40.jpg

Just throwing that out there as something to consider for color, branding, icon or whatever.

Here's a super quick sketch. Trying to keep a couple ideas in mind: clean, minimal, 20's vibes, scale-able. Not sure I covered all of those but, trying to keep it loose.

NB: got the bulb icon from https://www.autodraw.com - super nice resource for sketching things out.

Hey everyone! Just finished a big revision of gatsbyjs's design! Check it out at gatsbyjs.org. Made a follow up issue to discuss @SachaG's proposal for the frontpage design + other remaining work to "launch" gatsbyjs.org

Would love all your thoughts! https://github.com/gatsbyjs/gatsby/issues/1173

Hey guys, I discovered Gatsby a few days ago and have been learning to build my own website with it. Gatsby has been super awesome so far. I wanted to say: The Gatsby brand and website design (and JS framework of course) is absolutely top notch, I love it!! Thanks for the great work! 🙏🙏🙏

Ok, initial branding + logo work is done. Great work team :-) Archiving this (working on cleaning up issues) but feel free to create new issues to discuss further work you're interested in helping out with.

P.S. go check out @fk's t-shirt design!! https://github.com/gatsbyjs/gatsby/issues/1500#issuecomment-347031574