[wp-design] Second Draft
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
* 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.
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