In this session from DrupalCon Nashville, Director of Development Kevin Basarab & Engineering Manager at Group Nine Media Mike Priscella explore how Group Nine Media (parent company of Thrillist.com, TheDodo.com, and others) are evolving the Drupal 8 editorial user experience and contributing that back to the community. They not only look into their use case but also explore what modules and options are out there for improving editorial UX without custom development work.

1. UX Editorial Shift
April 9 - 13, 2018
DrupalCon
NASHVILLE 2018
Mediacurrent

2. | 2
Watch the presentation
recording

3. | 3
Kevin Basarab
Director of Development
Mediacurrent
●●●●●●
Today’s Team
Mike Priscella
Engineering Manager
Group Nine Media

4. | 4●●●●●●
About Mediacurrent

5. | 5●●●●●●
Mediacurrent is a full-service digital agency that
implements world class open source software
development, strategy and design to achieve defined
goals for enterprise organizations seeking a better
return on investment.

6. | 6●●●●●●
About Group Nine Media

7. | 7●●●●●●
Group Nine Media is the partnership of four
mission-driven, category-leading brands: Thrillist (food,
drink & travel), NowThis, (news & entertainment), The
Dodo (animals) and Seeker (science, tech & exploration)

8. | 8
Today’s Agenda
I. Understanding the shift
II. Why does this matter?
III. Contrib to the rescue
IV. Custom Considerations
V. Future Thinking
VI. How do I do this?

9. | 9
Alternatives

10. | 10

11. | 11
Why Does This Matter?

12. 12
Content Management,
not Website Management

13. | 13
WYSIWYG

14. | 14
Showing scale of number of editors and content publishing per day
Graphical circles of data points or abstract crazy newsroom photo

15. | 15

16. | 16
Why Does this matter?
● Your CMS shouldn’t be rebuilt every 2 years
● User facing is replaceable but the CMS isn’t
● JS Frameworks are debuting often

17. | 17
Pre Drupal
DeveloperTime
EditorialTime
DeveloperTime
Editorial
Time
Developer
Time
Editorial
Time
Drupal 6 Drupal 8

18. | 18
Keep the Tools Out of the Way of the Editor
Pre Editorial Tool
DeveloperTime
EditorialTime
DeveloperTime
Editorial
Time
Post Tool (Pre Drupal)

19. 19

20. | 20
Contrib to the Rescue

21. | 21
Plugin Field Widgets
● Autocomplete deluxe
● Inline entity form
● Entity Browser

22. | 22
Media
● Entity browser
● Focal point
● Multi upload (DropZoneJS)
● Distributions:
○ Acquia Lightning
○ Thunder

23. | 23
Forms/General Organization
● Override node options
● Menu Per Role/Admin Toolbar
● Dashboards (Total Control)
● Field group

24. | 24
Customizing Architecture

25. 25
What did we do? Paragraphs

26. 26
What did we do? Paragraphs

27. | 27
Content Caricature

28. | 28
Custom Considerations
● Make editors remember fallbacks
● Make editors think of how the
content is going to be displayed
DON'T DO
● Think in terms of what the best
content is for this field
● Eliminate unnecessary actions

29. | 29
Custom Paragraphs
● Entity Clone for content type templates
● Sane paragraph structures
● Parameterized content vs free form.
● Class variation (Classy paragraphs)
● Paragraph Variations

30. | 30
Future Thinking

31. | 31
Future
● Preview in context vs In Context editing
● Decoupled Editing (CardStack, Contena, etc) (React Initiative)
● Layout initiative
● Lightweight mobile first editing
● How can I utilize phone’s camera for my media

32. | 32
Future
- ?

33. | 33

34. | 34
Future

35. | 35
Where do we start?

36. | 36
TALK TO
YOUR EDITORS

37. | 37
How do I propose this to my Boss?

38. | 38

39. Thank you!
@Mediacurrent Mediacurrent.comfacebook.com/mediacurrent