Were huge fans of Word­Press, the open source blog­ging soft­ware pow­ered by web stan­dards. From the blogs of the New York Times to ama­teur home­pages fea­tur­ing goofy cat pic­tures, Word­Press is used on hun­dreds of thou­sands of sites read by tens of mil­lions dai­ly. It is the largest self-host­ed blog­ging tool in the world.

When founder Matt Mul­len­weg approached us to redesign Word­Press for an upcom­ing, sig­nif­i­cant ver­sion 2.5, he want­ed more than a pret­ty new skin. The entire user expe­ri­ence was up for review.

A matter of clarity

Word­Press was designed to get out of a writ­ers way while pro­vid­ing pow­er­ful fea­tures. But, as often hap­pens with soft­ware updat­ed by many hands, some of Word­Presss ini­tial sim­plic­i­ty and clar­i­ty had got­ten lost as new fea­tures were added over the years. Nav­i­ga­tion­al labels and admin site struc­tures had evolved organ­i­cal­ly; there was a ran­dom­ness and unpre­dictabil­i­ty to every­thing, from the loca­tion of key func­tions to the num­ber of items in the nav­i­ga­tion menu. It evolved with­out regard for sus­tained user test­ing or seri­ous infor­ma­tion architecture.

Work­ing with its users and devel­op­ers, we con­duct­ed research to under­stand how peo­ple used Word­Press. In response, we craft­ed opti­mal­ly-usable archi­tec­tures. Based on user needs and com­pet­i­tive analy­sis, rig­or was applied to exist­ing fea­tures, while new fea­tures were inte­grat­ed into the emerg­ing fabric.

In short, we con­struct­ed a revised infor­ma­tion archi­tec­ture that is more about the user than it is about Word­Press. In the old Word­Press, nav­i­ga­tion was with­out hier­ar­chy. Impor­tant activ­i­ties to the user, such as writ­ing a new blog post, sat right along­side less impor­tant admin­is­tra­tive ones. Like­wise, the old Dash­board was dom­i­nat­ed by Word­Press-spe­cif­ic news.

Sure, users enjoyed get­ting updates on Word­Press periph­er­al­ly as they zipped past to man­age com­ments or write a new post, but this front page did­nt help them under­stand what was real­ly impor­tant to them: their web­site. We eval­u­at­ed and pri­or­i­tized the top tasks most users per­form, then mir­rored that in the nav­i­ga­tion and dashboard.

For exam­ple, while an advanced user could man­u­al­ly edit the slug of a post via a field in the right side­bar whose loca­tion was ran­dom and drag­gable, no pro­vi­sion was made for the less-savvy user. But on top of that, no user could learn the final URL of a post until after it was pub­lishe­dun­less will­ing to per­form URL-hack­ing gymnastics.

We took care of that in the new Word­Press. After you com­pose a title, a field con­tain­ing editable text appears under the title to indi­cate what the final URL will be. Users can edit the URL as they see fit. As users grow accus­tomed to see­ing the URL field appear each time they write a title, they will gain knowl­edge that turns them into advanced users.

A clear design

As s archi­tec­ture removed cob­webs, fresh design brought clar­i­ty and ease of use to the sites look and feel. It had pre­vi­ous­ly been devel­op­er-dri­ven, but the new look was a smooth evo­lu­tion of the old Word­Press design, not a painful rup­ture from it. Hier­ar­chy, clar­i­ty, and oth­er ele­ments of good design were incor­po­rat­ed with­out cheat­ing. The same con­straints form­ing the under­pin­nings of ear­li­er Word­Press designssuch as the need to use HTML rather than images and Flashre­main in place. Design ideas also fed back into archi­tec­ture and research, in a cre­ative loop that is only pos­si­ble with small teams.

Although the Word­Press admin design has evolved since leav­ing our hands in 2008, we are delight­ed to see how many of our user-focused design inno­va­tions and cor­rec­tions have become stan­dard parts of the inter­face­help­ing to account for the plat­forms con­tin­u­ing growth and popularity.

Our responsibilities on this project

Research and devel­op­ment; usabil­i­ty test­ing; infor­ma­tion archi­tec­ture; brand design and con­sult­ing; graph­ic design; user inter­face design. Launched 29 March 2008.