Your SlideShare is downloading. ×
Drupal content editing ux
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Drupal content editing ux

1,176
views

Published on

Published in: Technology

1 Comment
3 Likes
Statistics
Notes
No Downloads
Views
Total Views
1,176
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
26
Comments
1
Likes
3
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Drupal content editing UXSergei SorokinCOO Ukraine
  • 2. Overview• Problem outline and a bit of history• Basic principles of improving backend UX• Real-life examples, tips and modules• Spark project and Drupal 8 UIimprovements• Conclusion and Q&A
  • 3. Drupal admin interface over the yearsDrupal 4.7 Drupal 5
  • 4. Drupal admin interface over the yearsDefault Drupal 6 in GarlandthemeDrupal 6 in Bartik theme withadmin_menu module
  • 5. First D6 themes & modules aimed atimproving admin interface• rubik• rootcandy• admin• admin_menu• vertical_tabs• etc…
  • 6. D7UX initiativeD7UX principles:• Make the most frequent tasks easy andless frequent tasks achievable.• Design for the 80%• Privilege the Content Creator• Make the default settings smartSite: www.d7ux.org
  • 7. D7UX results• Updated andsimplified structure• “Seven” theme withoptional overlay• Admin toolbar withshortcuts• Dashboard• Contextual links
  • 8. D7UX was a hugeimprovementTo push it further, let’s identify theissue first
  • 9. Problem outline• Drupal admin interface, concepts andentities can be confusing even forbeginner developers• Clients who are using the CMS usuallydont think in the same logical patterns asdevelopers• Developers rarely pay attention to thisissue and it ends up being ignored
  • 10. How to make client’s dailyinteractions with your producteasier?
  • 11. Basic principles• Simplify by reducing all that is notnecessary• Dont make user guess• Ensure consistent logical and interfacepatterns• Minimize cost of user error
  • 12. Real-life examples, tipsand modules
  • 13. Navigation• By default user is redirected to /user pagewhich is usually useless for editors• Redirect user to the page where he/she canperform their common actions• https://drupal.org/project/login_redirect• https://drupal.org/project/rules• Logging in is not the only use case• Remove unused menu items with permissons• https://drupal.org/project/shortcutperrole
  • 14. Dashboard & content listDashboard• Default D7 dashboard• https://drupal.org/project/workbenchContent list• https://drupal.org/project/admin_views• https://drupal.org/project/improved_admin• https://drupal.org/project/views_bulk_operations
  • 15. Total control https://drupal.org/project/total_control
  • 16. Content: easy improvements• Give meaningful names and descriptions to contenttypes, their fields and other entities• Clone existing nodes withhttps://drupal.org/project/node_clone• Create another node of the same content type in a rowwith https://drupal.org/project/addanother• Schedule automatic publishing and unpublishing ofnodes https://drupal.org/project/scheduler• Add https://drupal.org/project/linkit to provide easyinterface for internal and external linking to nodes, users,managed files, etc…
  • 17. Content: reduce with permissionsLeave only necessarynode options by:• Limiting permissions• https://drupal.org/project/override_node_option
  • 18. Content: WYSIWYG• Don’t make user think about input format, set it byrole with: https://drupal.org/project/better_formats• Integrate it with file system• Remove unused buttons in editor
  • 19. Content: media filesAllow user to manage and reuse uploaded files:• https://drupal.org/project/media_browser_plus• https://drupal.org/project/imce• https://drupal.org/project/filedepot• http://drupal.org/project/plupload for multiple fileuploadsThese modules can be overwhelming for editors,so try to disable unused features and customizeper needs.
  • 20. Content: dealing with complex formshttps://drupal.org/project/field_group https://drupal.org/project/conditional_fields
  • 21. Content: custom design
  • 22. Views & panels• Views built-in feature that is often overlooked: addcontextual links in all listings on the site to allowquick access to node editing or deletion.• Allow editors to edit headers and footers of Viewswithout giving access to everything else withhttps://drupal.org/project/views_ui_basic• Easily rearrange view items withhttps://drupal.org/project/draggableviews• If you use panels, you can override panel contentper node with https://drupal.org/project/panelizer
  • 23. Minimizing cost of error• Enable revisions by default and usehttp://drupal.org/project/diff to let editors comparethem and easily roll back• Make sure you have (at least) daily backups set up.Not really an UI advice, but it’s always relevant• Use https://drupal.org/project/field_validation tocreate specific validation rules for fields• Install https://drupal.org/project/clientside_validationto send feedback to user immediately without havingto submit the form.
  • 24. SparkDistribution for D7and part of core in D8
  • 25. Spark• In-place editing• D&D layout tools• Enhanced contentcreation• Dashboardimprovements• Mobile (responsive)administration• CK Editor in core• And much morehttps://drupal.org/project/spark
  • 26. SparkIn-place editing Responsive layout builder
  • 27. Spark is anothergreat step forward
  • 28. Conclusion• Drupal admin interface often can be complex forend users• Constant improvement is evident (though it couldbe faster)• Usability of Drupal and your project in particulardepends on you: don’t overlook the issue, testbackend usability, improve it, share it bycontributing• It’s a good investment that will enrich your projectsand make your clients a bit happier
  • 29. Recommended readingThe Design of Everyday Thingsby Donald A. NormanDont Make Me Thinkby Steve Krug
  • 30. Thank you!Questions?