User-centered design for intranets means — no surprise here — centering the design of your intranet around real intranet users. It means watching them interact with your intranet and making design decisions based on what you see. It's an approach we've long advocated — see our 2005 editorial "Making users a part of your next software project" or our 2009 presentation "User-Centered Design for Mobile".
For me, it's especially thrilling to see the results it yields. We've spent a year-and-a-half practicing user-centered design for our new release, and it's brought about what I think is the most important new feature in ThoughtFarmer 6: the easiest intranet editing interface ever devised.
History of Easy Page Editing in ThoughtFarmer
We did extensive user research and user testing when we designed the very first editing interface in ThoughtFarmer, way back in 2005 (when we called ourselves a "wiki intranet"). We started with paper prototypes and progressed to higher-fidelity prototypes after each round of user testing.
By the time we released ThoughtFarmer, our user-centered approach had produced an editing interface that was easy and intuitive. By today's standards it looks pretty rough, but remember that this was a few years before YouTube, Twitter and Facebook. (Internet years are kind of like dog years, aren't they?)
Over the next few years we made incremental additions to ThoughtFarmer's editing interface, gradually expanding its functionality. While each addition on its own seemed too minor to warrant user testing, the cumulative effect of these changes was significant. By 2011 we were unhappy with our editing interface and were determined to do a complete user-centered overhaul.
Overhauling Page Editing
We started with a list of hunches ("95% of the time you just need the Title and Body. Make them HUGE!!"), pet peeves ("It's ugly! Too many alignment points!"), but most importantly, some statistics: 94% of pages created by ThoughtFarmer users were of type "default", even though ThoughtFarmer now had Blogs, Calendars, Forums, Galleries, Groups and Sections. It was apparent that most users did not know that they could create different page types. This problem became our chief focus.
Over the next several months, Darren and I tossed conceptual wireframes back and forth, iterating on each others' work.
Eventually it shaped into something we thought could work. We passed it off to Selma Zafar, our Senior UX Lead, who would take the concept the rest of the way and prepare it for user testing.
After testing with a variety of novice, intermediate and advanced ThoughtFarmer users, our UX team came back with a thick report. Although we had made progress in some areas, we hadn't improved the main problem: users still didn't notice the different page types.
We iterated several more times. We strengthened the right column. We relocated the "Publish" button. We added a strong "Page type" dropdown, with visual explanations of the various page types. We added a "Guided Tour". And our user testing now revealed that we had a winner!
ThoughtFarmer 6: the easiest intranet editing interface ever devised
The final editing interface in ThoughtFarmer 6 is, like the rest of ThoughtFarmer, deceptively simple in appearance. It starts with a prominent Add and Edit button in the top corner of every page.
On your first edit, ThoughtFarmer presents a concise Guided Tour. New users appreciate the hand-holding.
When the editing interface loads, the cursor is already positioned in the large Title box. Start typing to add your title. If you notice that you've put your page in the wrong place, you can quickly move it.
To Publish a page, press the prominent Publish button. If it's not ready for public consumption, check the "Private" box.
Below the Publish box is the new Page Type selector. This solves our biggest usability challenge: make it easy for users to discover additional page types, without introducing a confusing two-step process. Other intranet systems, such as SharePoint, force you to decide whether your content is a Page, List, Announcement, Blog, Wiki, and so forth, before you can create it. Making that decision intimidates novice users. In ThoughtFarmer, you simply click the friendly "Add" button and start typing. It defaults to a page type that makes sense. If you choose, you can browse the other page types and select a different option. And your choice doesn't have to be permanent -- you can swap to a different page type at any time.
If you choose a page type that has additional options, a panel appears. For example, if you choose "Group", you can specify Group Type, Address, and Membership Options.
We've also improved the rich text editor. We've rearranged the buttons so the groupings are more natural. And because the text entry area auto-grows, you never get those funny double scrollbars (you know the ones, where different things start scrolling depending on where you put your mouse?). Instead, the entire page, including the text editor, scrolls as a single unit.
Finally, we've tucked a myriad of features into the "Settings" box that appears in the right hand margin. These are lesser-used features (including some new ones like Content Expiry, Content Publishing and Content Subscriptions), but easy to access when you need them.
Ultimately, user-centered design for our new intranet editing interface is about these two questions — one quantitative, and one qualitative:
- Does the new editing interface help employees complete the tasks they need to complete?
- Do the employees enjoy using the new editing interface to complete those tasks?
Our UX team can confidently answer "Yes!" to those questions.
Looking for a clear and simple path to a new intranet? Download our free Intranet Buyers Workbook to learn 10 key steps in evaluating intranet solutions.
Have questions? Get in touch! We're always happy to hear from you.
January 17, 2013