Admin user experience

From DevSummit
Jump to navigation Jump to search
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.

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.