Redesign of an established Open Source CMS

FOSDEM21 Open Source CMS R E D E S I G N O F A N E S TA B L I S H E D @saschaeggi #FOSDEM21

Introduction Sascha Eggenberger Senior UX Designer @Unic @saschaeggi #FOSDEM21

Introduction One of the Lead Designers of the Drupal Design System @saschaeggi #FOSDEM21

Follow me @saschaeggi on Twitter, Drupal.org etc. @saschaeggi #FOSDEM21

Agenda 01 02 03 04 Drupal Redesign Takeaways Questions @saschaeggi #FOSDEM21

01 Drupal @saschaeggi #FOSDEM21

Drupal Drupal is an Open Source CMS/CMF first released 20 years ago @saschaeggi #FOSDEM21

Drupal Latest major release is Drupal 9 @saschaeggi #FOSDEM21

Drupal The Drupal community counts 1.39 million members Source: Wikipedia @saschaeggi #FOSDEM21

Drupal 117,000 active contributors Source: Wikipedia @saschaeggi #FOSDEM21

Drupal UI History @saschaeggi #FOSDEM21

Drupal Drupal 7 Source: http://general-guide.howtodrupal.easternstandard.com/content-management-createmanage-content-how-manage-existing-content/managingexisting-content @saschaeggi #FOSDEM21

Drupal Drupal 8 @saschaeggi #FOSDEM21

Drupal Drupal 9 @saschaeggi #FOSDEM21

Drupal Drupal 9 @saschaeggi #FOSDEM21

Drupal Drupal 9 @saschaeggi #FOSDEM21

Drupal Drupal 9 @saschaeggi #FOSDEM21

Drupal Drupal didn’t had a design refresh in recent years @saschaeggi #FOSDEM21

Drupal “The Drupal Admin UI looks outdated” basically everyone on the internet @saschaeggi #FOSDEM21

02 Redesign @saschaeggi #FOSDEM21

Design System Principles @saschaeggi #FOSDEM21

Design System powerful empathetic clear accessible respectful @saschaeggi #FOSDEM21

Design System Accessibility @saschaeggi #FOSDEM21

Design System @saschaeggi #FOSDEM21

Design System Typography @saschaeggi #FOSDEM21

Design System Modular scale @saschaeggi #FOSDEM21

Design System Colors @saschaeggi #FOSDEM21

Design System @saschaeggi #FOSDEM21

Design System drupal.org/docs/8/core/ themes/claro-theme/design @saschaeggi #FOSDEM21

Redesign Claro @saschaeggi #FOSDEM21

Claro Included in Drupal Core since Drupal 8.8 as an experimental theme @saschaeggi #FOSDEM21

Claro Stable release of Claro is planned for Drupal 9.2 @saschaeggi #FOSDEM21

Claro drupal.org/slack #admin-ui #admin-ui-design @saschaeggi #FOSDEM21

Redesign Gin Future UI @saschaeggi #FOSDEM21

Future UI Started last year as a customization layer for Claro @saschaeggi #FOSDEM21

Future UI Serves as an ideation for Claro @saschaeggi #FOSDEM21

Future UI Major Drupal Distributions are using Gin already as their default Admin UI @saschaeggi #FOSDEM21

Future UI Is available as a contrib theme drupal.org/project/gin @saschaeggi #FOSDEM21

03 Takeaways @saschaeggi #FOSDEM21

Takeaways 1 We have a heavy focus on accessbility @saschaeggi #FOSDEM21

Takeaways 2 Claro is on track to get stable with Drupal 9.2 @saschaeggi #FOSDEM21

Takeaways 3 Gin further improves the overall experience @saschaeggi #FOSDEM21

Wrap-up You’ll find more in-depth talks about the Drupal Admin UI online @saschaeggi #FOSDEM21

Design System It’s a community (team) effort Thanks to all contributors! @saschaeggi #FOSDEM21

The end Thank you. https://media.giphy.com/media/nEMmyUp4hl1QOzovKh/giphy.gif

FOSDEM21 Open Source CMS R E D E S I G N O F A N E S TA B L I S H E D @saschaeggi #FOSDEM21