Admin user experience

From DevSummit
Jump to navigation Jump to search

Group attendees, consist of WordPress, Drupal/Backdrop, Django, custom PHP/JS interfaces. WordPress "Guttenberg" product experience

  • A replacement for shortcodes in the WordPress experience
  • Deals with embeddables being represented visually but still easy to move around within the body.
  • Front-end editing
    • Potentially causes problems that it leads editors to prioritize the desktop experience (or whatever UI they're using to edit).
    • However, it is frequently requested by the editorial teams.
  • Medium editor: Clone or open-source version of the medium.com blogging platform.
  • Future of content distribution: Likely to be content repositories that provide JSON feeds, but users use whatever editing tool they want and content can be presented in any way they want.
  • Accessibility:
    • Depending on your audience, it affects the editorial exerience with creating content. e.g. requiring alt text may be necessary but it may make your editors resent the editing tools.
    • Try to use tools that notify users of accessibility issues but allow them to create content in a stream of consciousness but notify and fix the accessibility issues before or after saving.
  • Structured content:
    • Developers leaning more towards using highly structured content where everything is individually set.
    • Structured content often runs into limitations where input data doesn't match the structure. e.g. attempting to list "requirements" as other referenced content, but the requirements are non-digital such as "bring a phone" which didn't match the expectations of the developers.
    • Can cause field bloat as each new type of structure adds more and more fields.
    • Show the user as few fields initially as possible.
    • Sometimes the concept of reused fields makes things difficult because the same field may be used differently in different contexts.
  • Communication:
    • Talk to your editorial teams. Collaborate together between your developers and editorial teams
    • Document how to use the site, either written or video. Site-specific editorial guides.
    • Built-in/inline documentation in the editorial exerience would be optimal.
    • Continuous feedback is important.
    • New staff members are extemely valuable to solicit feedback about your editorial tools.
  • Modeling workflow:
    • Frequently end up using Google Docs or external tool for creating content, then "lock" the content for production and push it out to the CMS.
    • Workflow systems: No successful experiences of those present for building full workflows.
    • Build different workflows at times for different types of editors: e.g. Power user vs. basic users. Content creators vs. translators. Moderators.
  • Preview:
    • Use a separate window for preview. The simplest solution but it's dependent upon the user being able to save the form (e.g. get through all the required fields).
    • Preview window in WordPress allows you to preview even before all required fields are saved.
    • Split-column preview is possible when using JSON-fed content, the editor is creating the content and populating the JSON while the rendering engine is constantly pulling that out and showing it as the content is created.
  • Testing for improvements/regressions:
    • How to measure improvements to the interface.
    • Come up with KPIs (Key Performance Indicators) like how fast the content was created.

Using pre-build products like WordPress or even Drupal, end-users might not realize that the interfaces are even able to be modified.

Rocket surgey for dummies:


Round-table on random useful tools:

  • WordPress: Advanced custom fields great for structured data
  • Admin columns: Allows you to control layout on a per custom post-type
  • Paragraphs: Pre-build collections of content pieces
  • jQuery DataTables: Handy tool for presentation and editing experiences. Select all, search, filter, bulk operations on any listing of content.
  • WordPress: Creating custom shortcode for any reusable pieces (such as sliders or embeds) in the theme or possibly a plugin.
  • WordPress BeaverBuilder: Good tool for doing page layouts.

Picking a WYSIWYG:

  • Ended up using CKEditor because it's the most popular.
  • Editors are moving towards maintaining semantic structure a little bit better.