Upgrade to Pro — share decks privately, control downloads, hide ads and more …

A Layout Customiser for The Sun

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

A Layout Customiser for The Sun

Presented at BigWP on 5th December 2016
Avatar for John Blackbourn

John Blackbourn

December 05, 2016
Tweet

More Decks by John Blackbourn

See All by John Blackbourn
Investigating Regressions Quickly using Git Bisect
Avatar for John Blackbourn johnbillion
1
2.1k
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.3k
An Explanation of HTTPS for the Inexperienced
Avatar for John Blackbourn johnbillion
0
1.6k
The A to Z of WordPress Multisite
Avatar for John Blackbourn johnbillion
3
2k
A Deep Dive into the Roles and Capabilities API
Avatar for John Blackbourn johnbillion
3
2.6k
Unit Testing: What? Why? How?
Avatar for John Blackbourn johnbillion
0
160
Debugging as a Key Skill - WCSOF - WCMIL
Avatar for John Blackbourn johnbillion
1
1.8k
An Introduction to Character Encoding - WCNO - WCNL
Avatar for John Blackbourn johnbillion
0
2k

Other Decks in Technology

See All in Technology
rubygem開発で鍛える設計力
Avatar for Tomohiro Hashidate joker1007
2
270
Geminiとv0による高速プロトタイピング
Avatar for Shinya Masadome（東京AI祭） shinya337
0
200
ネットワーク保護はどう変わるのか？re:Inforce 2025最新アップデート解説
Avatar for Shun Tokuyama tokushun
0
150
【５分でわかる】セーフィー エンジニア向け会社紹介
Avatar for Safie safie_recruit
0
26k
生成AI活用の組織格差を解消する 〜ビジネス職のCursor導入が開発効率に与えた好循環〜 / Closing the Organizational Gap in AI Adoption
Avatar for upamune / Yu SERIZAWA upamune
5
4.5k
プロダクトエンジニアリング組織への歩み、その現在地 / Our journey to becoming a product engineering organization
Avatar for hiro-torii hiro_torii
0
140
20250625 Snowflake Summit 2025活用事例 レポート / Nowcast Snowflake Summit 2025 Case Study Report
Avatar for K.Osawa kkuv
1
370
React開発にStorybookとCopilotを導入して、爆速でUIを編集・確認する方法
Avatar for yut yu_kod
1
100
ビズリーチが挑む メトリクスを活用した技術的負債の解消 / dev-productivity-con2025
Avatar for Visional Engineering ＆ Design visional_engineering_and_design
0
130
作曲家がボカロを使うようにPdMはAIを使え
Avatar for Takuya Ito itotaxi
0
390
Connect 100+を支える技術
Avatar for Yamakan kanyamaguc
0
150
Github Copilot エージェントモードで試してみた
Avatar for Ochtum ochtum
0
130

Featured

See All Featured
What's in a price? How to price your products and services
Avatar for Michael Herold michaelherold
246
12k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
Avatar for Kevin Liebholz kevinliebholz
34
5.9k
Practical Orchestrator
Avatar for Shlomi Noach shlominoach
188
11k
Docker and Python
Avatar for Tania Allard trallard
44
3.5k
10 Git Anti Patterns You Should be Aware of
Avatar for Lemi Orhan Ergin lemiorhan
PRO
657
60k
The Psychology of Web Performance [Beyond Tellerrand 2023]
Avatar for Tammy Everts tammyeverts
48
2.9k
Designing for Performance
Avatar for Lara Hogan lara
609
69k
Designing for humans not robots
Avatar for Tammie Lister tammielis
253
25k
Visualization
Avatar for Eitan Lees eitanlees
146
16k
The Art of Programming - Codeland 2020
Avatar for Erika Heidi erikaheidi
54
13k
Adopting Sorbet at Scale
Avatar for Ufuk Kayserilioglu ufuk
77
9.4k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
Avatar for Sam Stephenson sstephenson
161
15k

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