Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

A Layout Customiser for The Sun

Avatar for John Blackbourn John Blackbourn
December 05, 2016
Technology
470
4

A Layout Customiser for The Sun

Presented at BigWP on 5th December 2016

Avatar for John Blackbourn

John Blackbourn

December 05, 2016

More Decks by John Blackbourn

See All by John Blackbourn
Investigating Regressions Quickly using Git Bisect
Avatar for John Blackbourn johnbillion
1
2.2k
WP CLI: An Intro and Interesting Use Cases
Avatar for John Blackbourn johnbillion
0
2k
Zen Mode: Developing While You're Offline
Avatar for John Blackbourn johnbillion
3
2.5k
An Explanation of HTTPS for the Inexperienced
Avatar for John Blackbourn johnbillion
0
1.7k
The A to Z of WordPress Multisite
Avatar for John Blackbourn johnbillion
3
2.2k
A Deep Dive into the Roles and Capabilities API
Avatar for John Blackbourn johnbillion
3
3k
Unit Testing: What? Why? How?
Avatar for John Blackbourn johnbillion
0
220
Debugging as a Key Skill - WCSOF - WCMIL
Avatar for John Blackbourn johnbillion
1
1.9k
An Introduction to Character Encoding - WCNO - WCNL
Avatar for John Blackbourn johnbillion
0
2.2k

Other Decks in Technology

See All in Technology
Code for Security プロジェクト紹介 2026年10月
Avatar for Yuki Kawabe yu23ki14
0
120
Gemini Intelligence 入門 ― AppFunctions と Gemini Nano
Avatar for takuro abe takuroabe
0
320
触りたくないデータに、どう触るか AI時代のRBACアクセスガバナンス
Avatar for 株式会社IVRy（社員登壇資料） ivry_presentationmaterials
0
300
React改造してみた
Avatar for Mooncake Sugar tsukina_7mochi
0
140
ストレスなくAIと付き合いたい！こんなときどうしてる？
Avatar for Nami Kimura namiki64
4
640
Refining Active Record
Avatar for Shugo Maeda shugo
0
180
PHPカンファレンス関西の招待状 / Invitation to PHP Conference Kansai
Avatar for Y-KANOH ykanoh
0
220
WasmをRustにする
Avatar for SansanTech sansantech
PRO
0
300
[JAWS-UG彩の国埼玉#12]そろそろ準備する？re:Invent2026をやさしく解説 / reinvent2026-sainokuni
Avatar for sh_fk2 sh_fk2
1
360
Local CI × GitHub Actions
Avatar for gogutan gogutan
3
230
hackers_champloo_2026_tidb
Avatar for makocchi makocchi
0
170
DBについての基礎説明（MySQL編） - コロプラ 2026年度 新卒研修
Avatar for COLOPL Inc. colopl
0
150

Featured

See All Featured
Avoiding the “Bad Training, Faster” Trap in the Age of AI
Avatar for Mike Taylor tmiket
0
270
Claude Code のすすめ
Avatar for schroneko schroneko
67
230k
Building a A Zero-Code AI SEO Workflow
Avatar for Ian Lurie portentint
PRO
0
790
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
Avatar for Akihiro Kokubo akihiro_kokubo
PRO
74
43k
The browser strikes back
Avatar for Jono Alderson jonoalderson
0
1.8k
Bioeconomy Workshop: Dr. Julius Ecuru, Opportunities for a Bioeconomy in West Africa
Avatar for AKADEMIYA2063 akademiya2063
PRO
1
410
Collaborative Software Design: How to facilitate domain modelling decisions
Avatar for Kenny Baas-Schwegler baasie
1
340
B2B Lead Gen: Tactics, Traps & Triumph
Avatar for Sophie Logan marketingsoph
1
280
The Curse of the Amulet
Avatar for Matthew Lei leimatthew05
3
16k
First, design no harm
Avatar for Per Axbom axbom
PRO
2
1.3k
HTML-Aware ERB: The Path to Reactive Rendering @ RubyCon 2026, Rimini, Italy
Avatar for Marco Roth marcoroth
5
830
StorybookのUI Testing Handbookを読んだ
Avatar for Shingo Yamazaki zakiyama
31
7k

Transcript

  1. A Layout Customiser for The Sun

  2. John Blackbourn @johnbillion | humanmade.co.uk

  3. Largest print newspaper by circulation Second largest newspaper website by

    viewers Migrated to WordPress.com VIP Go 400,000+ articles 1TB images Switched to HTTPS

  4. Building a Layout Customiser (not a Page Builder)

  5. None

  6. Editorial Requirements Quickly alter the content and layout of the

    home page and section pages

  7. Editorial Requirements Visually and technically accurate representation

  8. Editorial Requirements Editorially scalable to a large number of articles

  9. Editorial Requirements Well-formatted storage of the content and presentation data

  10. UX Workshops Identified the typical journey of a news story

  11. UX Workshops Free-form control over layout is overwhelming, slow, and

    unnecessary

  12. UX Workshops Editing content inline for: 1. Context 2. Expediency

  13. Solutions "The layout customiser"

  14. None
  15. None
  16. None

  17. Solutions "The cascade"

  18. None
  19. None
  20. None
  21. None
  22. None
  23. None
  24. None

  25. Solutions Maintaining accuracy of the preview

  26. None
  27. None

  28. Next Steps Scheduling layouts (for sections) Inline image editing REACT

    or ?...

  29. Want to see more? Come and see me

  30. John Blackbourn @johnbillion | humanmade.co.uk