A better Experience for Content Editors

Sascha Eggenberger Senior UX Designer @ Unic

@saschaeggi Follow me on Twitter

Agenda Interface Helpful Modules Quick wins What’s next Key takeaways

Interface

« Drupal looks & feels outdated » People on the internet

Claro to the rescue!

Gin Admin Theme a customizable experience

A new layout nice & sleek overview

A new layout vertical navigation

A new layout sticky call-to-actions

Node edit form improved editor experience

Node edit form sticky action bar

Node edit form focused content form

Node edit form new sidebar

Gin settings a lot of customization options

Toolbar modern, horizontal toolbar

Toolbar classic, “legacy” toolbar

Darkmode welcome to the dark side

User settings Users can customize their Drupal experience

Examples Branding examples

Download Gin drupal.org/project/gin

Support the development Contribute : drupal.org/project/issues/gin Buy me a : github.com/sponsors/saschaeggi

Paragraphs Drag handle issue fix is backported to Drupal 8.8+ No need to patch core anymore!

Helpful Modules

Admin toolbar dgo.to/admin_toolbar

Coffee dgo.to/coffee

Field group dgo.to/field_group

Media library in Drupal core

DropzoneJS dgo.to/dropzonejs

Layout Paragraphs dgo.to/layout_paragraphs

Inline Entity Form (IEF) dgo.to/inline_entity_form

Entity browser dgo.to/entity_browser

Gin Login dgo.to/gin_login

Gin Layout Builder dgo.to/gin_lb

More modules worth a look dgo.to/autosave_form dgo.to/content_lock dgo.to/responsive_preview dgo.to/paragraphs_ee dgo.to/gutenberg dgo.to/gin_gutenberg

Quick wins

Create custom admin views For different content types

Use AJAX for admin views It’s there you just need to enable it

Group elements That belog together on complex content types

Field descriptions Prefix, Suffix & Help texts

CKEditor styles [name_of_frontend_theme].info.yml

CSS Adjustments to Gin gin-custom.css (Since Alpha 31)

Use Paragraphs Icons For easier recognition

Paragraphs Use the EXPERIMENTAL field plugin widget

Paragraph previews Preview view mode

Layout Paragraph previews Paragraph rendering

Demo Repository

github.com/saschaeggi/ drupal9-gin Check it out for some reference

What’s next

Beta 1 Roadmap for Gin dgo.to/3203807

Getting Claro stable dgo.to/3066007

Content Editor role dgo.to/3059984

“Content creation” menu proposal dgo.to/3203618

Admin views should use AJAX as default dgo.to/3146544

Key takeaways

1 Site building is crucial the site builder has an important role

2 Don’t overdo it Always think if you would use it yourself

3 The experience is king A good UX will help with adoption

Thank you!