[wp-design] Hello, and some thoughts

[Khaled Abou Alfa]

This is exactly the kind of discussion I was looking for. Okay let's
take things right from the top, (and Joen it's good to talk, so no
matter how wordy things get it's all good stuff, speak your mind :))

The 5th element, that's the word. I was thinking about that but I
couldn't quantify it, you're completely correct on this aspect. So
what does WordPress mean to me? I guess these are the things I
associate with it all:

Community, Speed, Flexibility, Friendly/funny (think of the
installation notes and comments to get the idea), Advanced and
unfortunately until now Ugly. But that's what we're trying to sort
out. So the last one we can remove from the core values of what we're
trying to achieve here.

What do I think signify all of the above, except funny probably are
sound waves, in 3D. They show flexibility as they bounce everywhere,
there's the element of speed, and because they come in groups of lines
they can also be seen as a community.

The closest thing I can think of is when you open Acrobat Reader 6,
you get those funky white lines, that's the sort of thing I've got in
my mind for some reason.

I guess another idea would be to try and get some sort of running figure. 

I've touched up on the colours, I think we should be thinking shade of
cool shades of blue. aqua with another colour to compliment. Seems to
me we're trying to give it a bit more softer friendlier image. In
order for us to do this we have to choose either warm colours or soft
colours. One option I guess is choosing a softer pastely colour
scheme. I agree though there should be less grey. The design really
should breathe. I also agree with the communicative buttons colours.

Definitely need mock ups that we can volley around. I think that's how
the design will evolve between us.

Also just a note on icons, I'm sure it's a great coup to get this guy
Michael, but I really set my heart on doing some of the icons if it
gets down that road. I always like a challenge for every new project I
do, and I'm always trying to learn from them. Having said that I
wouldn't allow for my rubbish icons to go in there, so how's this for
a deal, if we go down the icon track, then I get a crack at doing them
first, if the general consensus is they're weak, or rubbish or
whatever, and trust me I can take the beating it's cool, what doesn't
kill me makes me stronger and all that, then you can invite your
friend to sort it out for us. Sound like a plan?

Great, finally feel we're getting started. Good work guys.


On Thu, 10 Feb 2005 20:00:35 +0100, Joen Asmussen <joen at noscope.com> wrote:
> Just recently, I was invited by Michael (and Khaled?) to partake in this
> shuttle project. Thanks for that.
> 
> I'd like to just spend a short paragraph to introduce myself and what I
> can do, just so you all know who I am. After that I have some thoughts
> about the whole development of shuttle, and how I think development
> could work/benefit. This might have been discussed prior to my joining
> this list, but it'll help me get up to speed, so bear with me.
> 
> First of all, I'm located in Copenhagen Denmark, not more than a mile or
> 5 from where Michael lives. Designwise, I come from a background in
> Macromedia Flash development. I have a 3 year graphic design education
> in my backpack, and currently, I'm employed at Titoonic
> (www.titoonic.com). I have a huge deal of experience with usability in
> web and application interfaces, and I'm no stranger to graphics either.
> I hope to be able to add some graphic input and usability related advice
> to this project.
> 
> As for the project itself, I have some ideas I'd like to share, with
> regards to how this can get started (it's still in "discussion mode"
> right?).
> 
> *5th Element*
> In visual identities, one talks about the "5th element" being an
> integral part of the whole. There's the logo, the typeface, the color
> setup and the layout, and then there's the 5th element. The 5th element
> can be a shape that's used creatively, as a backdrop etc., or perhaps
> just a particular effect -- for Apple it would be the aqua glass effect.
> 
> I'm mentioning this, because I think discussing Wordpress branding is
> too early. We need a "core values" discussion first. Take Apple for
> instance -- their core values would be "lifestyle", "elegance",
> "innovation". Even Movable Type, (I think), communicates some sort of
> core values through their design, whether this is intentional or not.
>  From their straight layouts, their greenish hues and the spokes in
> their logo, I'm getting "functional, stable, simple".
> 
> Ideally, we could assign 3 core values to Wordpress as well. Based on
> these 3 values, we'd be able develop "sort of" a 5th element, from which
> most other aspects of shuttle could be derived. Whether this means all
> icons, colors, logos and layouts derived will be glassed, metallic,
> pixellized, or simply plain and functional, I do not know. But with the
> basic thoughts in place, there'll be a clear, red line between values
> and design.
> 
> *Screenshots*
> This is a jump in the process, but I want to get it out there as early
> as possible anyway. Once branding and style guidelines are agreed upon
> and we actually get down to building it, I propose we start out by
> making a buckload of screenshots, rather than fiddle with html / css or
> whatever. Making a mockup in Photoshop is a quick and intuitive way of
> seeing what works, and what doesn't. Whenever we tackle big projects at
> Titoonic, we start out with mockups. Sometimes even functional
> application mockups, built in Flash. They work some of the way, and show
> how the UI will work, but only as a demonstration. The gist is, once the
> mockup is agreed upon, it's not much work to actually build the final
> product.
> 
> I realise these thoughts might be overkill, but they're good to keep in
> mind while working on it.
> 
> Finally, I have some comments to Michaels last response.
> 
> > * Colors used are too muddy, too many shades of grey.
> 
> Agreed. But we should keep in mind that the wordpress admin interface
> has more in common with a windows or a mac application, than it does a
> website. As such, my recommendation would be that if we do add colours,
> we add only branding colors and communicative colours. By communicative
> colours I mean that error messages are red, and "operation succeeded"
> msgs are green.
> 
> > * The font feels a bit old. I'm not sure why. / * I personally feel
> > better with sans-serif for headlines, but I recognize that WP has a
> > 'serif' image.
> 
> I say a different font. Imagine if Photoshop used Georgia for palette
> titles ... (no offense meant to anyone)
> 
> > * The letters could be kerned closer I think.
> 
> I think that's too close to being a branding element. As soon as a font
> is kerned, it goes from anonymity to "part of the design", and sometimes
> anonymity is preferred, especially if we're talking body text. As for
> logos, etc. it could work just fine.
> 
> > * Add just a touch of color to the WP 'image'. I mean look at the 'Web
> > application of the year' box on the frontpage, it alone adds a touch
> > of life.
> 
> Exactly. Wordpress should have two or three "main colors", that define
> the interface. If I say "Yellow CMS", you say Textpattern, if I say
> "bluish greenish CMS" you say Movable Type. If I say Wordpress, what
> colors are you thinking? Soft grays? And is that satisfying?
> 
> > * Go for cleaner lines in general, remove some of the muddy
> > monochromatic grey's and rely more on structure of the presentation
> > (if that makes sense).
> 
> No gradients on buttons :)
> 
> I'll stop writing now, and I'll keep it shorter in the future -- this
> message is only a way to get up to speed faster.
> 
> Best regards,
> 
> Joen
> 
> --
> 
> Joen Asmussen
> 
> CPH, DENMARK
> ICQ: 2462161, AIM: workjoen
> 
> work: www.titoonic.dk <http://www.titoonic.dk> | private:
> www.noscope.com <http://www.noscope.com> & www.turtleshell.com
> <http://www.turtleshell.com>
> 
> _______________________________________________
> wp-design mailing list
> wp-design at lists.automattic.com
> http://lists.automattic.com/mailman/listinfo/wp-design
>