Hey I like it. Its clean and minimal. Without throwing too much Info
at the users. Don't you think "Download" will be more appropriate Than
> I'll start off by saying that my hopes are that Bryan Veloso gets around
> to designing the official website at some point. I'm most definitely not
> giving him a deadline because that shouldn't be how you contribute to a
> project you love. You should just get on and do it. I've got faith
> you'll come through buddy but for now I can understand things not being
> the right time etc.
> As such I'm going to talk about the mockups that have been going through
> the list and try and turn a pragmatic eye to them and set up a proper
> design discussion about these things because these things need
> direction.
> I've heard that people say the website shouldn't tie up with the
> software as if we're beholden to this. We can have the website in one
> way, the installer in another and the actual software in another way. I
> think that's bollocks. Seriously. These areas don't have to beholden to
> each other, however they seriously do need to be linked together to
> provide a cohesive experience. Part of the joy of Habari from a design
> POV is that we're starting from the ground up, we can actually step back
> and take a minute to take stock.
> So we've got the task of creating a quick and ready website that will
> allow (amongst other things) devs to talk about Habari in an official
> capacity, which is an important issue at the moment since the project
> doesn't have an official voice.
> Before I jump into the actual design, lets consider the ethos behind the
> current crop of designs that have come through with Habari. We have
> tried at every stage to question every additional element that is put
> onto the page. Our core values here isn't about information overload,
> it's about putting all the right elements on the page that will be used
> on a regular basis, it's about simplifying and streamlining the design
> down to the essential areas. The fact that it's a minimal design is one
> that has been battered again and again because through simplicity we're
> able to make software that people will understand how to use and make
> the most of rather than being confused and moving on.
> That ethos should therefore be moved into EVERY design we do. If our
> design philosophy was to make it as detailed as possible, then that's
> what the design elements should look like.
> The second part is consistency in what we do through the life of the
> project. I don't want to be making any onerous precedence where we
> basically are putting anything up there because it's about speed. Even
> when we're in a rush we should remain true to the core values of the
> designs. If we decide in the future to go in a different direction then
> it'll be important to migrate all aspects at the same time etc.
> So with that ethos in mind lets talk about what is essential at this
> stage (it'll differ I'm sure in versions down the line once we ebb
> closer to 1.0).
> Here's my list.
> 1. We need the name Habari there. It should be big enough to see
> straight away so that people are clear as to where they are. I've
> discussed this before as to why we shouldn't and won't be putting an
> logo elements on the final page. Why? Because we haven't decided on it.
> It's that simple. Let's not put a visual associating Habari when really
> we haven't had to time to think through the implications. The logo will
> come through and when it does I'm sure we'll all be completely happy
> with it. Hopefully in a Firefox sort of way happy, since as far as I'm
> concerned that's one of the most (if not the most) successful internet
> icon of the past few years. Hey if we're going to have goals lets make
> them as high as possible.
> 2. The motto, which is Spread the Word!
> 3. An small explanation of what Habari means and what it actually is.
> This needs to be limited to either a sentence or 2 maximum. Should take
> 10 seconds to read and easily to digest that just gives the person who's
> visiting the site for the first time all the quick information about
> what they're looking at.
> 4. Calls to action. This is a simple idea. We want people to do things
> once they come to the site right? Otherwise why would be here. So what
> do we want the user to do? Well:
> a) Download the source.
> b) Learn about Habari and what makes it special
> c) Contribute to the community
> d) For those that have been here before and want to see how the
> development is going maybe is planet habari like page.
> e) COntrinute to the Wiki and documentation
> These are all that I can think of at the moment to be honest. It's these
> 5 calls to action. The thing is at this stage I don't think any one
> should take a higher preference to the other because we're building the
> community. We don't know what the majority of poeple coming to the site
> will want. SOme might be coming over to see what's going on, other to
> see what they can contribute, still others to download and play around
> with the software, others to hear about the development, however can
> anyone here actually tell me the precentage of users at this stage? No
> because we don't even have a developer's preview out yet, so we can
> decided which area should have a larger space than the other.
> The way these are shown should ideally be flexible enough to add more
> calls to action for the foreseable future until we get closer to version
> 1.0
> 5. Mockups. When people come to an open source software site they
> generally want to see what the actual software looks like as it informs
> them how mature or not the project actually is and whether or not they
> can be bothered to contribute to it. They say never judge a book by it's
> cover, however I'm sorry to say that in the crowded world of blogging
> software it's important that the software has that edge. And we need to
> market every area to pull in as many new contributors as possible and
> build the community as much as possible. The screenshots are our cover
> and as such we should be highlighting these on the front page because
> they'll draw the user in.
> First of all I'll say that I never do this, critique other people's
> designs however it's important to illustrate where I feel these are
> going wrong in relation to the thoughts I've written above.
> Maybe I should create a document (or put it on the wiki) that sets out
> our design philosophy so that people can read that first before jumping
> in, I dunno we'll see).
> So lets look at the current designs on the table and how they fare (I
> think these are the latest versions of both):
> 1. This is the one done by Brian:http://habari.heimidal.net/mockup_with_content_new_3.png
> 2. While this one was done by Dean:http://dev.deanjrobinson.com/habari_design/habari_mockup1.png
> 1. Brian's mockup:
> The first thing that I've got to say is it doesn't really follow the
> design ethos. There's a lot going on in the page. It does have some nice
> large chunky calls to action on the side. There's a lot of text there
> though. A lot less needs be said and that might be where images come
> through.
> The issue is that the download section is given one kind of treatment,
> the what is habari is given another importance, documentation is given
> yet another set of importance and so on (see number 4).
> It's also got information regarding the latest plugins and the latest
> theme. Maybe down the line but not now as we've only got like 1 theme
> and a handful of plugins. Is it really that important to put this
> information on the front page now? I don't think so.
> It's got the motto but not what the project is actually called right
> there at the top. There is space for it at the top left hand corner
> however.
> A green colour has been added to this. This instantly is giving the site
> a branding direction which we've gone around the mill on this. Colour
> will come eventually (this could be just in the icons or whatever)
> however we shouldn't really be putting ourselves being associated with
> specific colours at the moment since they're bound to change in the next
> few months anyway.
> There is no pictures of the mockups on there so the instant grab isn't
> actually there.
> 2. Dean's mockup:
> Well we've got colour in this one and the flower logo. Once again we've
> got a lot of words on the front page that well doesn't really need to be
> there from the word go. Maybe potentially down the line however not at
> the moment.
> The pane on the right hand side is a good idea of icons for calls to
> action. That's the focus that people look at. The thing is that it's to
> the side. A lot of our current design mockups is centre based. I say
> this because it's decisions like this that might not seem like much to
> the casual user but if we get it right from now we link things up in a
> tight and professional looking design.
> Now based on that I spent seriously 30 minutes on the attached mockup.
> It's just to illustrate where the design could have gone and how it
> keeps in with things. and keeps things simple. I've put the icons there
> just for show, so that you know what we're talking about. It's meant to
> convey the ideas I've discussed is all. I'm not planning on spending any
> more time on this as I've spent an hour writing this email and 30
> minutes to illustrate my point, arguably I could have spent that time
> better but I'm trying to make a point here and I'm an extremely verbose
> asshat.
> The design might seem far too married to the mockups at the moment and I
> think the mockup area might be much to have the same design but I think
> the idea is solid in how and where the mockups should be conveyed.
> The idea is thinking about what's really essential on the page and why.
...
