[wp-design] Second Draft

Joen Asmussen joen at noscope.com
Thu Feb 17 14:05:01 GMT 2005

Right, I managed to throw together a new draft, based on some things I 
wanted to communicate visually, and some ideas Michaels and Khaleds 
awesome sketches showed.

First, some feedback though, so as to not spam too much.

Matthew Mullenweg wrote:

> That's a very good point, even if we nail something revolutionary and 
> exciting to us, we probably want to deploy it over a few version help 
> people gradually adjust and also see how it's working in the Real World.

A soft rollout. That's a good idea. We'd also be able to do some 
hotfixes if we make some huge blunder.

> I'm only speaking from what I've observed, and I've watched a lot of 
> people use WordPress for the first time. I don't really want a dark 
> border, but I think some gentle styling could give a more usable, 
> unified, and consistent user experience. If we start to put marching 
> ants around the active box, please stop us, but I don't think we 
> should pre-emptively cut off any experimentation on this front.

I see where you're coming from, and I'm all for experimentation and 
seeing how things would work. The reason I mentioned it is so we might 
save some time. When I heard "1px dark border" some alarm bells 
immediately rang. I've _made_ these mistakes before. Sometimes it's okay 
to style websites, but not for admin interfaces like these. With that 
said, I'm pretty sure I've made myself clear now, so I'll shut my 
piehole. Plus, I realise it's quite possible that Michael or Khaled can 
style the input boxes in a way that puts all these comments to shame.

>Also on the subject of the input box I really liked what Chris D did
>on his mock up which was have this oval offset thing rather than a
>square box. It was smaller and tighter.
Did I miss anything here? I haven't seen Chris' mockup?

Now for my sketch:



As you can see, it's heavily building on both Mike's and Khaleds nice 
drafts. I wanted to extend some of my ideas, including collapsing, etc.

* Moved logo to the top right.

* I kept the box around the whole post. This is not something I'm 
married to, but I like it, especially for when we'll add a preview. That 
way we can keep the post editing completely separate from the preview. I 
also tinted it light gray.

* Widened title box, just like Michael did. This is a good idea: a wide 
input box encourages people to write.

* I havent' changed any text sizes, it would take too much time. Rest 
assured that I completely accept and expect a larger font when we go CSS.

* The "quicktags" panel is modelled after Word. It is below the "Post 
Body" title, but above the text area, similar to Word (or other text 
apps). It is left aligned, because IMHO things just die when they get 
centered. Furthermore, I could expect this to be a problem with a liquid 

* Removed the "save and continue editing" button, for the same reasons 
as Michael.

* I moved many things to a "sidebar" to the right. I did this because it 
is somewhat secondary to the contents of the post. To separate these two 
I added a small dotline.

* Collapsable menus. Instead of reinventing the spoon with regards to 
how things collapse, I simply re-ised a metaphor that is well 
established on the Windows platform. The plus. When you click the plus, 
something expands, and it turns into a minus. When the minus is clicked, 
this collapses. The strenght of using this plus/minus, is that people 
know what it does, almost by heart. It is not "something new to learn". 
On a sidenote: I know we have some Mac people among us. As I recall, mac 
people have a small blueish arrow that rotates down when clicked? I 
could go for such one as well.

* The sidebar is now wider than the categories made it before. The extra 
space makes it lighter, and allows for both "Post Password" and "Post 
slug" to be located there.

* I have moved "Timestamp" and "Post Author" to the sidebar, but they 
are collapsed by default. I mentioned this when looking at Michaels 
sketch. If a user wants to change the time of a post, he/she shouldn't 
have to look through the advanced options.

* The same logic applies to the "advanced" section I've added in the 
bottom. As you can see, all contens are immediately visible under the 
"advanced" title, and there's no doubt what you can do there.


Joen Asmussen

ICQ: 2462161, AIM: workjoen

work: www.titoonic.dk <http://www.titoonic.dk> | private: 
www.noscope.com <http://www.noscope.com> & www.turtleshell.com 

More information about the wp-design mailing list