Website design

[dead-claudia]

(Inspired by this comment.)

*adorns UX cap for a moment* 🎩

mithril.js.org seems a little too plain and text-oriented thematically for a web framework. I feel it needs a little more design put into it to look better. A little more color and a little less dense, so the new reader isn't immediately slammed by a wall of text.

Compare the current site to some of these:

• Angular 2
• React
• Vue
• Ember

It's way easier to follow and way harder to get lost looking at Mithril for the first time when the site immediately grabs your attention and directs you where you likely want to go. And a nicer, more spacious design and layout would be wonderful. (Minimalism only goes so far before it doesn't look like any real design.)

Also, the logo really could use an upgrade. @rdsteg uploaded this nice album containing all the submissions for the logo so far. Currently, the logo doesn't stand out very well, and it no longer seems relevant to the framework - the three rings for what I'm guessing stood for M, V, and C bear no meaning for what's now an event-driven reactive framework.

---

Here's what I feel should be the front page:

• Mithril, with a short, quick tagline to advertise.

  • Introduce the framework very quickly, and make it look great. New visitors usually don't yet understand why Mithril is awesome, and developer attention spans are just as short as everyone else's, so we need to grab their attention quickly and tell them why they should care.
  • Reference npm install --save mithril
  • A couple links to the tutorial. It's okay to duplicate it here, so newcomers don't have to look around for the button instead of the most relevant spot.

• A few short details on why it's nice.

  • Simple (we know this, but they don't)
  • Versatile (integrates very well, batteries included)
  • Fast (the existing graph is okay, but it should also have a short summary along with it)

• Quick and simple snippet to show what it looks like. Maybe somewhere between React's examples and Ember's initial snippet, not so short it has little meaning, but maybe limit it to one or two idiomatic snippets, so it can be understood fairly quickly (React has too many IMHO).

• And finally, a link to the tutorial, to nudge them a little more (if they got that far).

---

/cc @lhorie @tivac (and anyone else with ideas)

*removes UX cap*

[pygy]

Do we really want to cater to people with an attention span so low they can't read a page of text?

I wouldn't be surprised to learn both the coding style and the simple home page are set up as passive deterrents against low quality contributions and support requests...

Mithril is reasonably successful without being a smash hit. The community is lively yet human-sized.

Its limited success makes knowing it a less marketable skill than knowing React or Angular, though... it's a tradeoff. I wouldn't want to live in eternal September.

[spacejack]

Here is a design concept I was playing with a while ago (reposting from the closed issue.)

http://www.spacejack.ca/mithril-design/

[dead-claudia]

@pygy I'm speaking from the perspective of advertising. And FWIW, I don't believe it'll devolve into absurdity beyond a larger number of dumb questions on Stack Overfow. To use Angular as an example:

• Their Gitter appears only somewhat more active than ours
• Their Google group has fairly light traffic, only just enough to require some structure
• Their GitHub repo would be better had they used labels better
• Stack Overflow is where most of the mess really is

I'm not quite that concerned about it. We tend to be a little more accepting of programming help here, but if things start really taking off, it's not that hard to start having them ask on Stack Overflow.

[gilbert]

Whatever the design, the home page definitely needs some live, working demos. "Look what you can do!" is a necessary message to deliver before you can say "Look how easy it is!"

[RobertAKARobin]

For what it's worth, I really like the site the way it is. My impression is that Mithril is intended to be extremely lightweight and no-BS, and the site reflects that. The only thing I might change is the logo, which looks a little hacky. I think it would be fine with no logo at all.

[orbitbot]

See also #1687 for wall of text, a sense of despair and suggestions.

Also FWIW, my bikeshed is a nice shade of purple, and I basically agree with @isiahmeadows' original points.

A fairly lightweight edit that might have a high ROI in "sense of freshness" might be to use multiple fonts on the website, eg. a separate header font. There are multiple sites that suggest font pairings, fe. with the current Open Sans (which is really common among OS projects).

[mike-ward]

Most frameworks I look at have about a 10-minute window to convince me they're worth the effort to learn. That means:

• The website loads fast. I assume the framework is rendering the page. Slow page and I'm out of there.
• Code example up front that gives me a gist of what to expect.
• Resource size and dependencies. Don't make me hunt to find these.
• Simple, flat page layout.

As you can probably guess, I like Mithril's web site for the most part. The tagline is a bit weak. Not sure why, but tags seem work best for me in three's like; "No nonsense, pure Javascript, blazing performance".

Maybe what is needed is not a full website redesign but a splash/landing page. My favorite splash pages are http://nancyfx.org/ and https://parceljs.org/

[dead-claudia]

@mike-ward I'm inclined to agree with you on the tag line being weak. As for that whole "rule of three", it's a thing. And yes, I do agree a splash/landing page is one big thing the site needs. (That would solve the biggest part of this bug.)

[osban]

I think @panoply has done some work on a new splash page, but I don't know in what stage it is now.

[panoply]

@osban I missed this, Apologies. I have something on file that I produced a while back but it's generated dynamically where the current docs is mostly static. I've got a fair understanding of how the docs and site are generated and what new site design would entail with the current setup and have time coming up the next few months.