SlideShare a Scribd company logo

Simplifying Your Admin Experience - FLDC 2023.pptx

We often talk about UX as a focus on making a site intuitive and easy-to-use for anonymous visitors, or perhaps registered users who need manage their account, make a purchase, and so on. But what about the people who will use your site most? While an engaged visitor might return to your site 3-5 times a month, a site admin use the site that many times a week, or more! This session explores how UX principles apply to Drupal's back end, as well as recommends some modules and best practices to make your site easy and intuitive for your contributors.

1 of 43
Download to read offline
Simplifying
Your Admin
Experience
Make Drupal easy for the
people who use it most
Martin
Anderson-Clutz
@mandclu
DRUPAL HAS A
REPUTATION
OF BEING
Hard to Learn
Photo:
https://unsplash.com/@brucemars
We have the power to make
it easier. What follow are
some ideas on how site
builders and developers
can help
Photo:
https://unsplash.com/@brucemars
Photo:
https://unsplash.com/@brucemars
Develop the skill
of observation
“Question the obvious and you
will discover many hidden
insights. What seems to be
obvious often is not.”
Photo:
https://unsplash.com/@brucemars

Recommended

Simplifying your admin experience - Stanford WebCamp
Simplifying your admin experience - Stanford WebCampSimplifying your admin experience - Stanford WebCamp
Simplifying your admin experience - Stanford WebCampMartin Anderson-Clutz
 
Simplifying the Drupal Admin Experience
Simplifying the Drupal Admin ExperienceSimplifying the Drupal Admin Experience
Simplifying the Drupal Admin ExperienceMartin Anderson-Clutz
 
Make your website more user friendly (UX)
Make your website more user friendly (UX)Make your website more user friendly (UX)
Make your website more user friendly (UX)Kirk Kimmel
 
Responsive Web Design for Drupal, CMS Expo
Responsive Web Design for Drupal, CMS ExpoResponsive Web Design for Drupal, CMS Expo
Responsive Web Design for Drupal, CMS ExpoEmma Jane Hogbin Westby
 
How Responsive Do You Want Your Website?
How Responsive Do You Want Your Website?How Responsive Do You Want Your Website?
How Responsive Do You Want Your Website?IWMW
 
Top 6 Web Design Trends For 2016
Top 6 Web Design Trends For 2016Top 6 Web Design Trends For 2016
Top 6 Web Design Trends For 2016Pixel Crayons
 
Tassos Koutlas - Tour API in Drupal 8
Tassos Koutlas - Tour API in Drupal 8Tassos Koutlas - Tour API in Drupal 8
Tassos Koutlas - Tour API in Drupal 8cameronandwilding
 

More Related Content

Similar to Simplifying Your Admin Experience - FLDC 2023.pptx

Nuxeo Platform LTS 2016 - Roadmap
Nuxeo Platform LTS 2016 - RoadmapNuxeo Platform LTS 2016 - Roadmap
Nuxeo Platform LTS 2016 - RoadmapNuxeo
 
Navigation to the rescue!
Navigation to the rescue!Navigation to the rescue!
Navigation to the rescue!Ashley McQuaid
 
Hong Kong Drupal User Group - Introduction of Drush
Hong Kong Drupal User Group - Introduction of DrushHong Kong Drupal User Group - Introduction of Drush
Hong Kong Drupal User Group - Introduction of DrushFrancis Yan
 
Taming Drupal Blocks for Content Editors a.k.a. "Snippets"
Taming Drupal Blocks for Content Editors a.k.a. "Snippets"Taming Drupal Blocks for Content Editors a.k.a. "Snippets"
Taming Drupal Blocks for Content Editors a.k.a. "Snippets"Brian Hay
 
Responsive web design
Responsive web designResponsive web design
Responsive web designpsophy
 
Kristof van roy-behind_the_scenes
Kristof van roy-behind_the_scenesKristof van roy-behind_the_scenes
Kristof van roy-behind_the_scenesnascomgenk
 
Usabilityslideshow
UsabilityslideshowUsabilityslideshow
UsabilityslideshowCarmell06769
 
9 Sketchup Tips for beter 3d modeling workflow
9 Sketchup Tips for beter 3d modeling workflow9 Sketchup Tips for beter 3d modeling workflow
9 Sketchup Tips for beter 3d modeling workflowRonen Bekerman
 
Do your best to make your webpage accessible
Do your best to make your webpage accessibleDo your best to make your webpage accessible
Do your best to make your webpage accessibleBostjan Kovac
 
How to Project-Manage and Implement a Responsive Website
How to Project-Manage and Implement a Responsive WebsiteHow to Project-Manage and Implement a Responsive Website
How to Project-Manage and Implement a Responsive WebsiteJj Jurgens
 
UI Design - Organizing the page
UI Design - Organizing the pageUI Design - Organizing the page
UI Design - Organizing the pageVinod Wilson
 
Word camp raleigh presentation 11 23-13
Word camp raleigh presentation 11 23-13Word camp raleigh presentation 11 23-13
Word camp raleigh presentation 11 23-13Melodie Laylor
 
Drupaldelphia 2013 Presentation- Making Your Site more Friendly to Search Eng...
Drupaldelphia 2013 Presentation- Making Your Site more Friendly to Search Eng...Drupaldelphia 2013 Presentation- Making Your Site more Friendly to Search Eng...
Drupaldelphia 2013 Presentation- Making Your Site more Friendly to Search Eng...Anson Han
 
How to easily identify and resolve front-end performance bottlenecks
How to easily identify and resolve front-end performance bottlenecksHow to easily identify and resolve front-end performance bottlenecks
How to easily identify and resolve front-end performance bottlenecksRaygun
 
Coalmarch Duke presentation Scholars@duke
Coalmarch Duke presentation Scholars@dukeCoalmarch Duke presentation Scholars@duke
Coalmarch Duke presentation Scholars@dukeCoalmarch
 

Similar to Simplifying Your Admin Experience - FLDC 2023.pptx (20)

Nuxeo Platform LTS 2016 - Roadmap
Nuxeo Platform LTS 2016 - RoadmapNuxeo Platform LTS 2016 - Roadmap
Nuxeo Platform LTS 2016 - Roadmap
 
Moving to Drupal
Moving to DrupalMoving to Drupal
Moving to Drupal
 
Improving drupals cex and ax
Improving drupals cex and axImproving drupals cex and ax
Improving drupals cex and ax
 
Art of-web-designing
Art of-web-designingArt of-web-designing
Art of-web-designing
 
Navigation to the rescue!
Navigation to the rescue!Navigation to the rescue!
Navigation to the rescue!
 
Writing for the Web
Writing for the WebWriting for the Web
Writing for the Web
 
Hong Kong Drupal User Group - Introduction of Drush
Hong Kong Drupal User Group - Introduction of DrushHong Kong Drupal User Group - Introduction of Drush
Hong Kong Drupal User Group - Introduction of Drush
 
Taming Drupal Blocks for Content Editors a.k.a. "Snippets"
Taming Drupal Blocks for Content Editors a.k.a. "Snippets"Taming Drupal Blocks for Content Editors a.k.a. "Snippets"
Taming Drupal Blocks for Content Editors a.k.a. "Snippets"
 
Responsive web design
Responsive web designResponsive web design
Responsive web design
 
Kristof van roy-behind_the_scenes
Kristof van roy-behind_the_scenesKristof van roy-behind_the_scenes
Kristof van roy-behind_the_scenes
 
Usabilityslideshow
UsabilityslideshowUsabilityslideshow
Usabilityslideshow
 
9 Sketchup Tips for beter 3d modeling workflow
9 Sketchup Tips for beter 3d modeling workflow9 Sketchup Tips for beter 3d modeling workflow
9 Sketchup Tips for beter 3d modeling workflow
 
Do your best to make your webpage accessible
Do your best to make your webpage accessibleDo your best to make your webpage accessible
Do your best to make your webpage accessible
 
How to Project-Manage and Implement a Responsive Website
How to Project-Manage and Implement a Responsive WebsiteHow to Project-Manage and Implement a Responsive Website
How to Project-Manage and Implement a Responsive Website
 
UI Design - Organizing the page
UI Design - Organizing the pageUI Design - Organizing the page
UI Design - Organizing the page
 
Word camp raleigh presentation 11 23-13
Word camp raleigh presentation 11 23-13Word camp raleigh presentation 11 23-13
Word camp raleigh presentation 11 23-13
 
Drupaldelphia 2013 Presentation- Making Your Site more Friendly to Search Eng...
Drupaldelphia 2013 Presentation- Making Your Site more Friendly to Search Eng...Drupaldelphia 2013 Presentation- Making Your Site more Friendly to Search Eng...
Drupaldelphia 2013 Presentation- Making Your Site more Friendly to Search Eng...
 
How to easily identify and resolve front-end performance bottlenecks
How to easily identify and resolve front-end performance bottlenecksHow to easily identify and resolve front-end performance bottlenecks
How to easily identify and resolve front-end performance bottlenecks
 
Mobilesoft presentation
Mobilesoft presentationMobilesoft presentation
Mobilesoft presentation
 
Coalmarch Duke presentation Scholars@duke
Coalmarch Duke presentation Scholars@dukeCoalmarch Duke presentation Scholars@duke
Coalmarch Duke presentation Scholars@duke
 

More from Martin Anderson-Clutz

I have a Great Idea for a Drupal Module! Now What? - DrupalDevDays 2023
I have a Great Idea for a Drupal Module! Now What? - DrupalDevDays 2023I have a Great Idea for a Drupal Module! Now What? - DrupalDevDays 2023
I have a Great Idea for a Drupal Module! Now What? - DrupalDevDays 2023Martin Anderson-Clutz
 
Configuration Kits - DrupalCamp NYC 2021
Configuration Kits - DrupalCamp NYC 2021Configuration Kits - DrupalCamp NYC 2021
Configuration Kits - DrupalCamp NYC 2021Martin Anderson-Clutz
 
Robust Events System In Minutes | DrupalCon North America 2021
Robust Events System In Minutes | DrupalCon North America 2021Robust Events System In Minutes | DrupalCon North America 2021
Robust Events System In Minutes | DrupalCon North America 2021Martin Anderson-Clutz
 
Manually curated solr search results | DrupalCon NA 2021
Manually curated solr search results | DrupalCon NA 2021Manually curated solr search results | DrupalCon NA 2021
Manually curated solr search results | DrupalCon NA 2021Martin Anderson-Clutz
 
Recurring Dates in Drupal - BADCAMP 2020
Recurring Dates in Drupal - BADCAMP 2020Recurring Dates in Drupal - BADCAMP 2020
Recurring Dates in Drupal - BADCAMP 2020Martin Anderson-Clutz
 
Smart Date - Drupalcamp Colorado 2020
Smart Date - Drupalcamp Colorado 2020Smart Date - Drupalcamp Colorado 2020
Smart Date - Drupalcamp Colorado 2020Martin Anderson-Clutz
 

More from Martin Anderson-Clutz (7)

I have a Great Idea for a Drupal Module! Now What? - DrupalDevDays 2023
I have a Great Idea for a Drupal Module! Now What? - DrupalDevDays 2023I have a Great Idea for a Drupal Module! Now What? - DrupalDevDays 2023
I have a Great Idea for a Drupal Module! Now What? - DrupalDevDays 2023
 
Image Optimization in Drupal
Image Optimization in DrupalImage Optimization in Drupal
Image Optimization in Drupal
 
Configuration Kits - DrupalCamp NYC 2021
Configuration Kits - DrupalCamp NYC 2021Configuration Kits - DrupalCamp NYC 2021
Configuration Kits - DrupalCamp NYC 2021
 
Robust Events System In Minutes | DrupalCon North America 2021
Robust Events System In Minutes | DrupalCon North America 2021Robust Events System In Minutes | DrupalCon North America 2021
Robust Events System In Minutes | DrupalCon North America 2021
 
Manually curated solr search results | DrupalCon NA 2021
Manually curated solr search results | DrupalCon NA 2021Manually curated solr search results | DrupalCon NA 2021
Manually curated solr search results | DrupalCon NA 2021
 
Recurring Dates in Drupal - BADCAMP 2020
Recurring Dates in Drupal - BADCAMP 2020Recurring Dates in Drupal - BADCAMP 2020
Recurring Dates in Drupal - BADCAMP 2020
 
Smart Date - Drupalcamp Colorado 2020
Smart Date - Drupalcamp Colorado 2020Smart Date - Drupalcamp Colorado 2020
Smart Date - Drupalcamp Colorado 2020
 

Recently uploaded

Introducing the New FME Community Webinar - Feb 21, 2024 (2).pdf
Introducing the New FME Community Webinar - Feb 21, 2024 (2).pdfIntroducing the New FME Community Webinar - Feb 21, 2024 (2).pdf
Introducing the New FME Community Webinar - Feb 21, 2024 (2).pdfSafe Software
 
2024 February Patch Tuesday
2024 February Patch Tuesday2024 February Patch Tuesday
2024 February Patch TuesdayIvanti
 
5 Things You Shouldn’t Do at Salesforce World Tour Sydney 2024!
5 Things You Shouldn’t Do at Salesforce World Tour Sydney 2024!5 Things You Shouldn’t Do at Salesforce World Tour Sydney 2024!
5 Things You Shouldn’t Do at Salesforce World Tour Sydney 2024!XfilesPro
 
Enhancing SaaS Performance: A Hands-on Workshop for Partners
Enhancing SaaS Performance: A Hands-on Workshop for PartnersEnhancing SaaS Performance: A Hands-on Workshop for Partners
Enhancing SaaS Performance: A Hands-on Workshop for PartnersThousandEyes
 
The Future of Product, by Founder & CEO, Product School
The Future of Product, by Founder & CEO, Product SchoolThe Future of Product, by Founder & CEO, Product School
The Future of Product, by Founder & CEO, Product SchoolProduct School
 
Q1 Memory Fabric Forum: Intel Enabling Compute Express Link (CXL)
Q1 Memory Fabric Forum: Intel Enabling Compute Express Link (CXL)Q1 Memory Fabric Forum: Intel Enabling Compute Express Link (CXL)
Q1 Memory Fabric Forum: Intel Enabling Compute Express Link (CXL)Memory Fabric Forum
 
My self introduction to know others abut me
My self  introduction to know others abut meMy self  introduction to know others abut me
My self introduction to know others abut meManoj Prabakar B
 
Early Tech Adoption: Foolish or Pragmatic? - 17th ISACA South Florida WOW Con...
Early Tech Adoption: Foolish or Pragmatic? - 17th ISACA South Florida WOW Con...Early Tech Adoption: Foolish or Pragmatic? - 17th ISACA South Florida WOW Con...
Early Tech Adoption: Foolish or Pragmatic? - 17th ISACA South Florida WOW Con...Adrian Sanabria
 
LF Energy Webinar: Introduction to TROLIE
LF Energy Webinar: Introduction to TROLIELF Energy Webinar: Introduction to TROLIE
LF Energy Webinar: Introduction to TROLIEDanBrown980551
 
Breaking Barriers & Leveraging the Latest Developments in AI Technology
Breaking Barriers & Leveraging the Latest Developments in AI TechnologyBreaking Barriers & Leveraging the Latest Developments in AI Technology
Breaking Barriers & Leveraging the Latest Developments in AI TechnologySafe Software
 
Introduction to Multimodal LLMs with LLaVA
Introduction to Multimodal LLMs with LLaVAIntroduction to Multimodal LLMs with LLaVA
Introduction to Multimodal LLMs with LLaVARobert McDermott
 
Q1 Memory Fabric Forum: Memory Processor Interface 2023, Focus on CXL
Q1 Memory Fabric Forum: Memory Processor Interface 2023, Focus on CXLQ1 Memory Fabric Forum: Memory Processor Interface 2023, Focus on CXL
Q1 Memory Fabric Forum: Memory Processor Interface 2023, Focus on CXLMemory Fabric Forum
 
H3 Platform CXL Solution_Memory Fabric Forum.pptx
H3 Platform CXL Solution_Memory Fabric Forum.pptxH3 Platform CXL Solution_Memory Fabric Forum.pptx
H3 Platform CXL Solution_Memory Fabric Forum.pptxMemory Fabric Forum
 
AI MODELS USAGE IN FINTECH PRODUCTS: PM APPROACH & BEST PRACTICES by Kasthuri...
AI MODELS USAGE IN FINTECH PRODUCTS: PM APPROACH & BEST PRACTICES by Kasthuri...AI MODELS USAGE IN FINTECH PRODUCTS: PM APPROACH & BEST PRACTICES by Kasthuri...
AI MODELS USAGE IN FINTECH PRODUCTS: PM APPROACH & BEST PRACTICES by Kasthuri...ISPMAIndia
 
LLMs, LMMs, their Improvement Suggestions and the Path towards AGI.pdf
LLMs, LMMs, their Improvement Suggestions and the Path towards AGI.pdfLLMs, LMMs, their Improvement Suggestions and the Path towards AGI.pdf
LLMs, LMMs, their Improvement Suggestions and the Path towards AGI.pdfThomas Poetter
 
Building Products That Think- Bhaskaran Srinivasan & Ashish Gupta
Building Products That Think- Bhaskaran Srinivasan & Ashish GuptaBuilding Products That Think- Bhaskaran Srinivasan & Ashish Gupta
Building Products That Think- Bhaskaran Srinivasan & Ashish GuptaISPMAIndia
 
How we think about an advisor tech stack
How we think about an advisor tech stackHow we think about an advisor tech stack
How we think about an advisor tech stackSummit
 
DNA LIGASE BIOTECHNOLOGY BIOLOGY STUDY OF LIFE
DNA LIGASE BIOTECHNOLOGY BIOLOGY STUDY OF LIFEDNA LIGASE BIOTECHNOLOGY BIOLOGY STUDY OF LIFE
DNA LIGASE BIOTECHNOLOGY BIOLOGY STUDY OF LIFEandreiandasan
 
Zi-Stick UBS Dongle ZIgbee from Aeotec manual
Zi-Stick UBS Dongle ZIgbee from  Aeotec manualZi-Stick UBS Dongle ZIgbee from  Aeotec manual
Zi-Stick UBS Dongle ZIgbee from Aeotec manualDomotica daVinci
 

Recently uploaded (20)

Introducing the New FME Community Webinar - Feb 21, 2024 (2).pdf
Introducing the New FME Community Webinar - Feb 21, 2024 (2).pdfIntroducing the New FME Community Webinar - Feb 21, 2024 (2).pdf
Introducing the New FME Community Webinar - Feb 21, 2024 (2).pdf
 
2024 February Patch Tuesday
2024 February Patch Tuesday2024 February Patch Tuesday
2024 February Patch Tuesday
 
5 Things You Shouldn’t Do at Salesforce World Tour Sydney 2024!
5 Things You Shouldn’t Do at Salesforce World Tour Sydney 2024!5 Things You Shouldn’t Do at Salesforce World Tour Sydney 2024!
5 Things You Shouldn’t Do at Salesforce World Tour Sydney 2024!
 
Enhancing SaaS Performance: A Hands-on Workshop for Partners
Enhancing SaaS Performance: A Hands-on Workshop for PartnersEnhancing SaaS Performance: A Hands-on Workshop for Partners
Enhancing SaaS Performance: A Hands-on Workshop for Partners
 
The Future of Product, by Founder & CEO, Product School
The Future of Product, by Founder & CEO, Product SchoolThe Future of Product, by Founder & CEO, Product School
The Future of Product, by Founder & CEO, Product School
 
Q1 Memory Fabric Forum: Intel Enabling Compute Express Link (CXL)
Q1 Memory Fabric Forum: Intel Enabling Compute Express Link (CXL)Q1 Memory Fabric Forum: Intel Enabling Compute Express Link (CXL)
Q1 Memory Fabric Forum: Intel Enabling Compute Express Link (CXL)
 
My self introduction to know others abut me
My self  introduction to know others abut meMy self  introduction to know others abut me
My self introduction to know others abut me
 
Early Tech Adoption: Foolish or Pragmatic? - 17th ISACA South Florida WOW Con...
Early Tech Adoption: Foolish or Pragmatic? - 17th ISACA South Florida WOW Con...Early Tech Adoption: Foolish or Pragmatic? - 17th ISACA South Florida WOW Con...
Early Tech Adoption: Foolish or Pragmatic? - 17th ISACA South Florida WOW Con...
 
LF Energy Webinar: Introduction to TROLIE
LF Energy Webinar: Introduction to TROLIELF Energy Webinar: Introduction to TROLIE
LF Energy Webinar: Introduction to TROLIE
 
Breaking Barriers & Leveraging the Latest Developments in AI Technology
Breaking Barriers & Leveraging the Latest Developments in AI TechnologyBreaking Barriers & Leveraging the Latest Developments in AI Technology
Breaking Barriers & Leveraging the Latest Developments in AI Technology
 
Introduction to Multimodal LLMs with LLaVA
Introduction to Multimodal LLMs with LLaVAIntroduction to Multimodal LLMs with LLaVA
Introduction to Multimodal LLMs with LLaVA
 
Q1 Memory Fabric Forum: Memory Processor Interface 2023, Focus on CXL
Q1 Memory Fabric Forum: Memory Processor Interface 2023, Focus on CXLQ1 Memory Fabric Forum: Memory Processor Interface 2023, Focus on CXL
Q1 Memory Fabric Forum: Memory Processor Interface 2023, Focus on CXL
 
H3 Platform CXL Solution_Memory Fabric Forum.pptx
H3 Platform CXL Solution_Memory Fabric Forum.pptxH3 Platform CXL Solution_Memory Fabric Forum.pptx
H3 Platform CXL Solution_Memory Fabric Forum.pptx
 
AI MODELS USAGE IN FINTECH PRODUCTS: PM APPROACH & BEST PRACTICES by Kasthuri...
AI MODELS USAGE IN FINTECH PRODUCTS: PM APPROACH & BEST PRACTICES by Kasthuri...AI MODELS USAGE IN FINTECH PRODUCTS: PM APPROACH & BEST PRACTICES by Kasthuri...
AI MODELS USAGE IN FINTECH PRODUCTS: PM APPROACH & BEST PRACTICES by Kasthuri...
 
LLMs, LMMs, their Improvement Suggestions and the Path towards AGI.pdf
LLMs, LMMs, their Improvement Suggestions and the Path towards AGI.pdfLLMs, LMMs, their Improvement Suggestions and the Path towards AGI.pdf
LLMs, LMMs, their Improvement Suggestions and the Path towards AGI.pdf
 
Building Products That Think- Bhaskaran Srinivasan & Ashish Gupta
Building Products That Think- Bhaskaran Srinivasan & Ashish GuptaBuilding Products That Think- Bhaskaran Srinivasan & Ashish Gupta
Building Products That Think- Bhaskaran Srinivasan & Ashish Gupta
 
How we think about an advisor tech stack
How we think about an advisor tech stackHow we think about an advisor tech stack
How we think about an advisor tech stack
 
DNA LIGASE BIOTECHNOLOGY BIOLOGY STUDY OF LIFE
DNA LIGASE BIOTECHNOLOGY BIOLOGY STUDY OF LIFEDNA LIGASE BIOTECHNOLOGY BIOLOGY STUDY OF LIFE
DNA LIGASE BIOTECHNOLOGY BIOLOGY STUDY OF LIFE
 
Zi-Stick UBS Dongle ZIgbee from Aeotec manual
Zi-Stick UBS Dongle ZIgbee from  Aeotec manualZi-Stick UBS Dongle ZIgbee from  Aeotec manual
Zi-Stick UBS Dongle ZIgbee from Aeotec manual
 
5 Tech Trend to Notice in ESG Landscape- 47Billion
5 Tech Trend to Notice in ESG Landscape- 47Billion5 Tech Trend to Notice in ESG Landscape- 47Billion
5 Tech Trend to Notice in ESG Landscape- 47Billion
 

Simplifying Your Admin Experience - FLDC 2023.pptx

  • 1. Simplifying Your Admin Experience Make Drupal easy for the people who use it most
  • 3. DRUPAL HAS A REPUTATION OF BEING Hard to Learn Photo: https://unsplash.com/@brucemars
  • 4. We have the power to make it easier. What follow are some ideas on how site builders and developers can help Photo: https://unsplash.com/@brucemars
  • 5. Photo: https://unsplash.com/@brucemars Develop the skill of observation “Question the obvious and you will discover many hidden insights. What seems to be obvious often is not.”
  • 8. Demo 1 A stock install of Drupal 10
  • 9. Don’t Make Your Editors Think ● Every page should be self-evident, or at least self-explanatory ● Make it obvious how to perform a task ● Standard UX principles apply ○ Use a visual hierarchy ○ Consistent use of link colours Photo: https://unsplash.com/@brucemars
  • 10. Be Descriptive ● Provide help text (field descriptions) wherever possible ● Label icons, at least on hover ● Where validation constraints exist, state them in the help text ○ Including expected input patterns, e.g. Sku: XXXX-###### ○ Characters not permitted or required Photo: https://unsplash.com/@brucemars
  • 11. Watch Your Language ● Avoid Drupalisms ○ Nodes, entities, media, etc ● Use familiar, relevant, and meaningful labels ○ Alerts, events, images, etc Photo: https://unsplash.com/@brucemars
  • 12. Appropriate Complexity ● Have roles configured with a simplified editor experience, for less technical users ● Balance power and configurability with simplified, single- purpose tasks ● The right answer will be different from site to site, and change over time ● Default to Basic HTML with a simpler set of WYSIWYG options Photo: https://unsplash.com/@brucemars
  • 13. Reduce Friction ● Make every click count ○ Admin Toolbar and Coffee modules can help users get where they need to go faster ● Think about where you take a user when a task is completed ○ Login And Logout Redirect Per Role can allow you to a user somewhere useful after login Photo: https://unsplash.com/@brucemars
  • 14. Staying In Context ● Provide obvious prompts on listing pages to manage the content ○ for editors only ● For simple tasks, keep in context when possible ● For more complex tasks, return when finished ● Add Content By Bundle and Display Link Plus help to add links for editors only Photo: https://unsplash.com/@brucemars
  • 19. Provide Immediate Feedback ● Provide tools to give immediate feedback on any additional work that may be needed ● Accessibility: Editoria11y ● Responsive: Responsive Preview ● SEO: Real-time SEO (yoast_seo) ● Image previews: use a thumbnail image format cropped to the same proportions as when viewed full size Photo: https://unsplash.com/@brucemars
  • 20. Good Form Principles for making your forms intuitive
  • 21. Field Usability ● Clearly mark required fields ● Provide sensible defaults when possible ● Avoid placeholder text ● If more than one “action” button, clearly indicate primary ○ Never a “Clear” or “Reset” button Photo: https://unsplash.com/@brucemars
  • 22. Field Usability Radios, Checkboxes ● Options obvious without clicking ● Select with a single click Photo: https://unsplash.com/@brucemars Select dropdown ● Better if many options (>5) ● Add Select2 or Chosen to provide search
  • 23. Remove Elements That Aren’t Needed ● “Promote to Front” and “Sticky” for content types where these values won’t be used ● Simplify module allows base fields to be hidden from forms ● Use Field Permissions to hide fields only needed by high-level admins Photo: https://unsplash.com/@brucemars
  • 24. Reference Field Usability ● Inline Entity Form to allow creating new, related content ○ Allows custom labels e.g. “Image” or “Contact” ● Tagify for an interactive reference field Photo: https://unsplash.com/@brucemars
  • 25. Jakob’s Law ● Leverage conventions and mental models editors bring to your site ● Mimic the way similar applications work whenever possible ● Keysave module allows Drupal forms to save via keyboard Photo: https://unsplash.com/@brucemars Users spend most of their time on other sites. This means that users prefer your site to work the same way as all the other sites they already know.
  • 26. Specialized Fields ● Leverage fields meant to replicate common patterns of data entry ○ Address module provides a set of fields for capturing location information ■ Integration for geocoding, mapping ○ Smart Date for app-like date and time entry, including recurring events ■ Integration for calendar displays Photo: https://unsplash.com/@brucemars
  • 27. Organize Your Form ● Sequence forms logically with most important fields first ○ Required fields high up too ● Visually group related fields and labels ○ Field Group module ● Single column is better Photo: https://unsplash.com/@brucemars
  • 28. Consistency ● Try to have edit forms follow the same structure as the entity view ● Try to use the same widgets and naming across different entities and bundles Photo: https://unsplash.com/@brucemars
  • 29. Design for the Typical Use Case ● If an entity has numerous fields to handle edge cases, collapse them into a fieldset or tab ● If various WYSIWYG plugins are needed for edge cases, put them into a separate text format, not default ● Form Mode Control can help using different form configurations based on use case Photo: https://unsplash.com/@brucemars
  • 30. When Things Go Wrong ● Alerts should be descriptive enough to communicate the fix required ● Don’t show errors in a modal or popup that has to be dismissed ● Show errors inline on the form element or at least highlight the field with the error ○ Inline Form Errors module (core) puts error messages next to each element and outputs a summary Photo: https://unsplash.com/@brucemars
  • 31. Demo 2 An optimized Drupal site
  • 32. Dynamic Layouts Giving editors control over the output structure
  • 33. Layout Builder ● Core’s visual, accessible solution for laying out: ○ The default layout of a content type ○ Each node of one or more content types ● Only enable when necessary, possibly only on a single content type Photo: https://unsplash.com/@brucemars
  • 34. Layout Builder ● Can expose a bewildering list of options ○ Layout Builder Restrictions allows for a smaller list ● Possible to make bad decisions ○ Layout Builder Lock can help prevent some ● Use Layout Builder Library to allow editors to choose from predefined layouts Photo: https://unsplash.com/@brucemars
  • 35. Paragraphs ● Less visual, but harder to break ● Possible to nest for complex layouts ● Can also be used for field collections ● Some use paragraphs with Layout Builder ● Paragraphs Edit gives authors a quick way to edit a single component Photo: https://unsplash.com/@brucemars
  • 37. Clone and Edit ● For complex content types, sometimes easier to clone and edit than build from scratch ○ Entity Clone module provides an operation for this Photo: https://unsplash.com/@brucemars
  • 38. Content View As A Dashboard ● Customize the filters ● Consider making the moderated content view an attachment or block ● Content Planner module provides analytics and calendar views Photo: https://unsplash.com/@brucemars
  • 39. Documentation ● Make scannable, with steps clearly indicated ● Include screen captures ● Provide in a user-friendly format ○ Not everyone can use Google Docs ● Videos can also help show a process e.g. Loom screen recorder ● Try using Tour or Help Topics for embedded help Photo: https://unsplash.com/@brucemars
  • 40. Testing! ● Get feedback as early and often as you can ● It doesn’t have to be expensive Photo: https://unsplash.com/@brucemars
  • 41. Incremental Improvements ● Test as much as possible ● Get feedback and iterate ● Eat your own dog food Photo: https://unsplash.com/@brucemars
  • 42. Resources ● Laws of UX ● Form Design Best Practices ● Content Creation by Average People ● Website Forms Usability: Top 10 Recommendations ● UX Considerations for Building an Amazing CMS | UX Booth ● How to set up a CMS that will make non-technical users happy ● User Experience: The Single Most Important Element of a Web CMS Photo: https://unsplash.com/@brucemars

Editor's Notes

  1. Thinking about your sites as
  2. For example, here’s a site with a set of quick links on the home page
  3. When you log in as an admin, there are buttons to make it obvious how you would add to or manage the links
  4. For simple content like this, there’s no reason you couldn’t allow an editor to create content directly within the page, using the settings tray
  5. Or even be able to reorder the items via drag-and-drop using something like DraggableViews
  6. Thinking about your sites as
  7. In addition to keeping your site consistent with the rest of the web, it’s important to have internal consistency
  8. Thinking about your sites as
  9. Thinking about your sites as
  10. Thinking about your sites as
  11. Thinking about your sites as