August 29, 2011

Wikia Editor Redesign

Identifying a user’s primary interaction with your website is essential to understanding where to focus a development team’s limited resources. At Google, the search box and corresponding results are so important that the company tests every interaction no matter how minor. During my time at Wikia I continually advocated for the company to focus similar attention on the Rich Text Editor (and source mode) which is used to write, edit, and add images to every article in every wiki. So I’m excited to see that my redesign of the editor has finally made it’s way out of development and onto the site. While this was the last project I worked on at Wikia I always felt it would make the largest impact on the user base.

For a would-be wiki editor the initial experience of clicking the “Edit” button can be scary and confusing. This is why a large percentage leave the page immediately after entering into edit mode. To better engage the user, the redesign focused on cleaning up the interface by exposing a limited set of features to a first time user while still allowing power users the ability to expand modules and customize the experience to better suit their needs. A few of the elements we focused on were:

  • Moving more advanced tools such as media (images, galleries, video and tables); categories; and templates from the primary edit bar into a side bar.
  • Keeping these advanced tools collapsed for a first time user but respecting their expanded state and the user’s desire to make a feature more prominent by keeping modules expanded upon future visits.
  • Moving the “Publish” and “Preview” buttons from the bottom – an awkward location for such commonly used features – to a more prominent position in the upper right.
  • Designing the editor to fit within the structure of the page without the use of a second scroll bar. This was often puzzling for visitors.

New editor at Wikia

As with any design this new version is far from perfect but I believe it’s a huge leap forward for Wikia. Novice wiki editors and casual browsers will encounter a more simple and intuitive interface which should lead to increased contributions and usage across the site. My hope is that Wikia will continue to iterate on their editor by incorporating A/B testing and other methods of feedback in an effort to create a world-class long form writing environment.