Upcoming Design Changes to the WordPress Admin UI

The WordPress Admin panel is getting a new look. The new look is flatter colors with and a metro-ish style. There is still some depth, but it has been consolidated with less gradients and reduced rounded corners. Icons have become fonts rather than images and special attention has been paid to detail for retina devices.

Preview Images of the New and Evolving WordPress Admin Design Layout

Here are several images from of the WP admin panel with the MP6 plugin activated. Read more about the MP6 plugin and how you can preview the new admin theme yourself after the following images:

Metro WordPress Admin UI

New WordPress Admin UI Posts Edit Screen

New WordPress Admin UI Plugins Panel

New WordPress Admin UI Settings Panel

MP6: This is a plugin to break the wp-admin UI

It’s easy to preview the new wp-admin panel. Simply install the MP6 plugin on your favorite test site and you can experience the latest updates.

This is a plugin to break the wp-admin UI, and is not recommended for non-savvy users.

This plugin will be updated frequently and tested daily. There’s a steady conversation brewing over at http://make.wordpress.org/ui/ and you are encouraged to participate.

Matt Mullenweg’s summary of updates on 3/8/13:

  • A visual treatment for the toolbar and menubar that visually unifies the two and reduces clutter.
  • Flatter visual styling, with square corners, for tables and grouping elements like .postbox.
  • Increased saturation of the traditional WP blue (old vs new comparison: http://cl.ly/image/1X2G3X1Y0y2g ).
  • A splash of color to denote the current menu item.
  • Removed the burnt orange hover state in favor of a lighter blue.
  • Single-color icons are now served via an icon font, making them load instantly and look crisp at any zoom factor.
  • Consistent typography for all operating systems by including the Open Sans web font. (Cognizant of complications embedded this could entail.)
  • Added padding between links in the menu for easier touch navigation
  • Lightened the page background using white backgrounds for grouping elements and a gray background for the body.
  • Removed the large header icons for a cleaner look at the top of the page

How do you feel about this latest look? WordPress is starting to appear more grown up; more CMS, less blogging-platform. WordPress is indeed now a CMS that everyone from a Mommy blogger to large enterprise can utilize. The admin panel is right there leading the way and is becoming sharper than ever.