Baby Got Backend (CMS Expo 2011)
1 like•1,341 views
This document discusses improving usability for content administrators in Drupal sites. It argues that content creators are the most important users as they use the site every day. While Drupal provides good tools for developers and builders, the interfaces do not necessarily equal good usability for content administrators. The document provides recommendations for how to improve usability for content administrators, including listening to their needs, understanding their workflows beyond just the data model, iterating based on feedback, optimizing entire workflows rather than individual screens, using consistent concepts and labeling, and accepting that some solutions will be unique to individual sites and teams.
Baby Got Backend (CMS Expo 2011)
- 1. BABY GOT BACKEND Content administrators are users too
- 2. Hi, I’m @eaton. 2
- 3. P O W E R E D b y S E R V I C E™ 3
- 4. “THE SITE SHOULD BE EASY!” …FOR WHO? 4
- 6. DRUPAL DEVS WORK TO MAKE THINGS EASY FOR BUILDERS
- 8. THE BUILDERS WORK TO MAKE THINGS EASY FOR VISITORS
- 10. WHO’S LOOKING OUT FOR THE CONTENT ADMINS?
- 11. CONTENT CREATORS ARE THE MOST IMPORTANT USERS ON YOUR SITE. 8
- 12. THEY’RE THE PEOPLE WHO USE YOUR SITE EVERY DAY. 9
- 15. GOOD NEWS: YOU HAVE TONS OF TOOLS! 12
- 16. 13
- 17. 13
- 18. 13
- 19. 13
- 20. BAD NEWS: INTERFACE WIDGETS DON’T EQUAL USABILITY 14
- 24. Step 34: Pick up the phone and call Joe, Brooke, Karen or, in a pinch, Doris. Tell them that you've just created a new le and it needs to be approved before your work can continue. Once they have approved the le, proceed to step 35…
- 25. DRUPAL PRESENTS A DATA MODEL, NOT A TASK MODEL 18
- 26. DRUPAL PRESENTS A DATA MODEL, NOT A TASK MODEL 19
- 27. THE TASK MODEL IS YOUR JOB. DRUPAL PRESENTS A DATA MODEL, NOT A TASK MODEL 19
- 28. HOW TO DO IT
- 29. HOW TO DO IT 1. Listen to the content administrators. 21
- 30. 1. Listen to the content administrators. IF YOUR CONTENT CREATORS DON’T HAVE A VOICE, YOU’RE THROWING MONEY AWAY. 22
- 31. 1. Listen to the content administrators. ANALYZE TASK COMPLETION LIKE IT’S AN ECOMMERCE SHOPPING CART. 23
- 32. 1. Listen to the content administrators. GET THEM TO ROLEPLAY AND DOCUMENT BOTH ONLINE AND OFFLINE WORKFLOWS. 24
- 33. HOW TO DO IT 1. Listen to the content administrators. 2. Don’t just understand the data, understand what they’re doing with it. 25
- 34. 2. Don’t just understand the data, understand what they’re doing with it. CONTENT CREATORS INVENT ALL KINDS OF WORKAROUNDS. 26
- 35. 2. Don’t just understand the data, understand what they’re doing with it. UNDERSTANDING HOW FIELDS ARE USED WILL SAVE COUNTLESS HOURS CLEANING UP MESSES. 27
- 36. 2. Don’t just understand the data, understand what they’re doing with it. EVEN NEW SITES EVOLVE QUICKLY. 28
- 37. HOW TO DO IT 1. Listen to the content administrators. 2. Don’t just understand the data, understand what they’re doing with it. 3. Keep asking “why?” and iterate, iterate, iterate. 29
- 38. 3. Keep asking “why?” and iterate, iterate, iterate THINK LIKE THE BUSINESS. WHY DO THEY NEED TO DO A CERTAIN TASK? 30
- 39. 3. Keep asking “why?” and iterate, iterate, iterate DON’T JUST REPLICATE EXISTING MENTAL MODELS. 31
- 40. 3. Keep asking “why?” and iterate, iterate, iterate FAST-AND-CRAPPY TURNS TO POLISHED-AND-GOOD WITH THE RIGHT FEEDBACK. 32
- 41. HOW TO DO IT 1. Listen to the content administrators. 2. Don’t just understand the data, understand what they’re doing with it. 3. Keep asking “why?” and iterate, iterate, iterate. 4. Optimize the workflow, not individual screens. 33
- 42. 4. Optimize the workflow, not individual screens. REAL CONTENT PRODUCTION IS A PROCESS, NOT A SINGLE SCREEN. 34
- 43. 4. Optimize the workflow, not individual screens. METADATA MAKES FOR EASY INTERFACES AND COMPLEX WORKFLOWS. 35
- 44. 4. Optimize the workflow, not individual screens. GIVE USERS CONTEXT (BREADCRUMBS, DASHBOARDS, PREVIEWS...) 36
- 45. 4. Optimize the workflow, not individual screens. STREAMLINE & AUTOMATE AROUND CONFUSION: TREAT DEFAULT FORMS AS POWER TOOLS. 37
- 46. 4. Optimize the workflow, not individual screens. BULK TOOLS. EASY TURNS HARD WHEN YOU HAVE TO REPEAT IT 10,000 TIMES. 38
- 47. HOW TO DO IT 1. Listen to the content administrators. 2. Don’t just understand the data, understand what they’re doing with it. 3. Keep asking “why?” and iterate, iterate, iterate. 4. Optimize the workflow, not individual screens. 5. Use repeating concepts, not just UI elements. 39
- 48. 5. Use repeating concepts, not just UI elements. PROPER CATEGORIZATION AND CONSISTENT LABELING GO A LONG WAY. 40
- 49. 5. Use repeating concepts, not just UI elements. USE SIMILAR VISUAL CUES FOR WORKFLOWS ACROSS THE SITE. 41
- 50. 5. Use repeating concepts, not just UI elements. PLACE SIMILAR FIELDS IN A CONSISTENT PLACE ACROSS ALL SCREENS. 42
- 51. NIRVANA! …ALMOST. 43
- 52. THE BETTER IT FITS ONE TEAM, THE HARDER IT IS TO REUSE. 44
- 53. “ There’s a big difference between the ‘site’ and ‘shop’ mentalities. Devs who work on a site for a long time always make some code that no one else can use. Shops and the Drupal community usually make stuff that can be reused over and over. Blake Hall 45
- 54. HOW TO DO IT 1. Listen to the content administrators. 2. Don’t just understand the data, understand what they’re doing with it. 3. Keep asking “why?” and iterate, iterate, iterate. 4. Optimize the workflow, not individual screens. 5. Use repeating concepts, not just UI elements. 6. Accept that many good answers will be unique. 46
- 55. Thanks! http://lb.cm/backend 47
- 56. 48
- 57. SUPER EXTRA BONUS SLIDES 49
- 58. 50
- 59. 51
- 60. 52
- 61. welie.com ui-patterns.com developer.yahoo.com/ypatterns boxesandarrows.com 53
Editor's Notes
- #2: \n
- #3: \n
- #4: \n
- #5: \n
- #6: \n
- #7: \n
- #8: \n
- #9: \n
- #10: \n
- #11: Any content driven site has an internal team that creates and publishes content. These content administrators spend all day using the Drupal interface, even though they’re not developers and they may have no idea how things work under the hood.\n
- #12: Community driven site has both external and internal content creators. \nPower law. your 1% that's herding the sheep, and your 10% that's actually creating original content.\nAdmins are doing community moderation in addition to managing content.\n
- #13: \n
- #14: Drupal 7 provides tons of improved UX widgets!\nTons of modules let you do crazy things!\njQuery widgets and more!\nBlog posts and books on usability!\n
- #15: Drupal 7 provides tons of improved UX widgets!\nTons of modules let you do crazy things!\njQuery widgets and more!\nBlog posts and books on usability!\n
- #16: Drupal 7 provides tons of improved UX widgets!\nTons of modules let you do crazy things!\njQuery widgets and more!\nBlog posts and books on usability!\n
- #17: \n
- #18: CMS Showdown at SXSW -- drupal was EASIER. wtf?\nrevealed the importance and danger of workflow customization.\ndoes that mean drupal "is easier?" no.\nit means that "your blog" is a crappy way to do forum moderation\n
- #19: \n
- #20: No joke: one client has a 40-page document explaining how to post a new page on their site. 40 pages! It suggests starting with a glass of wine. \n\nWhat IS crappy about drupal that better tools don't automatically fix?\nWorkflow, information overload (too much data, too hard to find),\ntoo many fields, too many clicks, too many screens...\n
- #21: \n
- #22: \n
- #23: \n
- #24: \n
- #25: If a content-driven organization isn't listening to its content creators -- and giving them a voice in redesign and platforming decisions - they might as well be throwing money down the drain. \n\n
- #26: If you have analytics, pay attention to them just as ecommerce sites would pay attention to shopping cart analytics. How often to people start creating content and stop, why? For teams, do you know how long it takes them to create content? Where are the problems? What are their pain points? Chances are it's not "Oh, Drupal is ugly." \n\n\n
- #27: Roleplay, act out the workflow, see where they hang up, see where they grimace. Don't JUST simulate the online stuff, simulate the offline components of their work, too. Where are the roadblocks?\n\n\n\n
- #28: \n
- #29: If your system is older than six months, your content creators have probably found uses for it you don't know about.\nMyspace's CSS jammed into profile fields, "Oh, we've been using the Alt text for something else entirely," etc.\n\n
- #30: \n
- #31: If it's a new site this even more important -- there's often not enough existing data for people to look for best practices, and they just muck with it until it does what they want it to.)\n
- #32: \n
- #33: Keep asking about the "whys" of tasks they do to understand, and avoid rebuilding old frustrations. (Building oysters around pearls is never useful). \n\nThis forces you to think like the business, too, not JUST a coder or designer. \n\n
- #34: There's a big difference between essential workflow and learned workarounds to old systems. \n\nDelicate balance between presenting them with a better approach than they're used to... and berating them into accepting a solution.\n\n
- #35: Iterate, iterate, iterate. Fast-and-crappy turns to polished-and-good with time and feedback from the users. \nBuilding content tools without feedback is like optimizing code without without metrics or profiling data. Flying blind.\n\n
- #36: \n
- #37: Don't optimize the individual pieces without addressing the workflow. \n\nTrain, simulate, roleplay. Do the intuitive pieces turn baffling when content editors have to pull the pieces together? It's easy to be penny-wise pound-foolish. \n\n\n
- #38: Drupal's emphasis on metadata and connections between pieces of content makes it easy to miss how mind-boggling the TASK is, because each one of the 15 screens is "easy" \n\n
- #39: Drupal's emphasis on metadata and connections between pieces of content makes it easy to miss how mind-boggling the TASK is, because each one of the 15 screens is "easy" \n\n
- #40: Wrapper forms that build and save nodes behind the scenes. \nSingle-step forms to create an episode and a cluster of articles, galleries, etc.\n
- #41: \n
- #42: \n
- #43: Just naming the labels carefully and arranging things in the right tabs is huge. This is a classic UX/IA task. \n\nJust because it’s not a difficult technical problem to solve doesn’t mean it’s not important.\n
- #44: 'Manage this' works on every page on the WWE site, it just presents context-relevant 'Manage' options.) \nManaging things is the same TASK even if it's different DATA. Admins only care about their tasks.\n
- #45: Muscle memory and visual patterns are important. NO ONE READS HELP TEXT.\nGrouping implies purpose: having the same groups even when fields differ from site to site\n
- #46: \n
- #47: \n
- #48: \n
- #49: \n
- #50: \n
- #51: \n
- #52: \n
- #53: Lullabot.com - Simple dashboard to see upcoming articles and current live articles\nPanels, Views, Login Destination, Scheduler\n
- #54: WWE.com - Content editing screen\nVertical Tabs (built into D7), CCK Fields, lots of CSS & JS\nLOTS AND LOTS of time asking, “Should this go here?”\n
- #55: WWE.com - Bulk unpublishing, tagging, deleting, management of content.\nViews, Views Bulk Operations, Better Exposed Filters, extra CSS\nInterviews with the content team\n
- #56: Useful resources are all over the place.\n\n