Oct 26

Veerle Pieters - Designing and Using The New EE 2.0 Interface

Categories:
DesignExpressionEngine
Tags:
design, expressionengine, veerle
Published:
10:16am on Monday 26th October, 2009

Veerle is a highly-respected designer and blogger, and runs Duoh! with her husband Geert Leyseele.

Watch Veerle’s talk on Vimeo.

The Design Process

  • I was asked to design the new EE 2.0 interface
  • The brief: tabbed menu, the ability to remove and add tabs, save space, make it more professional and less bloggy, fluid layout, smooth edges and softness, customisable GUI, inline demos, and user shortcuts
  • The design process: I was thinking in terms of tasks and levels. Keep it simple. It is better to start designing for beginner users, then the UI can be adapted for experts (rather than the other way around). The current EE Control Panel is overwhelming with options and features
  • Thinking about IA rather than design
  • Screenshots demonstrating iterations on the CP homepage, admin page, file upload preferences, and templates page
  • The Publish page will have a “Writing Mode” - a lightbox that covers the entire page, hiding all non-writing tools
  • Delivered the PSD files to EllisLab and thought the job was done. But then I decided to make a more sombre, grey theme with hot pink higlights. It was eventually chosen as the default for EE 2.0
  • If you use the highlight colour for every clickable element, there is no hierarchy
  • Still talking to EllisLab to finalise design touches - correct usage of highlight colour, rounded CSS3 corners, transparent PNGs, typography, spacing

Q&A

What about IE6 support?
(Derek Allard) IE6 is not officially supported for the Control Panel.

I'd love to hear what you think - please use the form below to leave your comments. Anything I consider too offensive, off-topic, or spammy will be deleted at my discretion. Some HTML is permitted, or you can use Textile.

Commenting is not available in this weblog entry.
  1. Nobody has commented on this article yet - why not be the first?