Sitecore Core Development

Friday, March 31, 2006

New UI

Based on requests from customers we are redesigning the UI of the Content Editor. Currently we are finalizing the last details, so what you see is pretty close to the end product.

It turned out that many end-users felt that editor was too complicated, presenting too many options at once. We take this kind of critisism very serious as the editor is a place that many people spend a lot of time in.

Instead of taking a evolutionary approach, we decided to redesign the entire editor - hopefully solving all problems in one go. Luckily this coincided with a release of new screenshots of Office 12. The Office 12 UI seemed to solve a lot of our problems, and it was not a hard decision to try to emulate it - as far as possible.

This has, in my opinion, turned out much better than expected. We are able to present more and better UI in less screen-real estate while increasing usability.


The main principles for the new design has been:
1. Performance - the new editor (which is unoptimized) is about 4.5 times faster than the old.
2. Simple - all (most) functionality is in the ribbon - and nowhere else.
3. Predictable / static - no magically appearing/disappearing options. If something is not possible, it is just greyed out.
4. The editing area is for content editing - no carouselles or portals - just content.
5. Editor feel - this feels and looks like an editor - not a management tool.

The are a couple of interesting things in the screenshot above. The yellow Format tab is a contextual tab, which is visible as the cursor is in a Rich Text field. This tab provides HTML editing tools like Bold, Italic, Indent, Outdent etc. It is possible to add contextual tabs per item and per field.

The Rich Text editor contains a yellow Image box which is actually an embedded web control directly in the HTML as it is now allowed to have web controls in HTML fields. It will be interesting to see, what this will be used for.

The true seal of approval has come from Ole and Runi, who have always prefered the DBBrowser, but are now using the new editor.

1 Comments:

Post a Comment

<< Home