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
430

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.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.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
2.1k
A Deep Dive into the Roles and Capabilities API
Avatar for John Blackbourn johnbillion
3
2.7k
Unit Testing: What? Why? How?
Avatar for John Blackbourn johnbillion
0
190
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.1k

Other Decks in Technology

See All in Technology
re:Invent2025 セッションレポ ～Spec-driven development with Kiro～
Avatar for NRI Netcom nrinetcom
PRO
1
120
テストセンター受験、オンライン受験、どっちなんだい？
Avatar for Yuuki Yamashita yama3133
0
190
AI との良い付き合い方を僕らは誰も知らない
Avatar for Asei Sugiyama asei
0
290
Redshift認可、アップデートでどう変わった？
Avatar for daiki.handa handy
1
110
まだ間に合う！ Agentic AI on AWSの現在地をやさしく一挙おさらい
Avatar for みのるん minorun365
19
3.1k
Snowflake Industry Days 2025 Nowcast
Avatar for tak takumimukaiyama
0
140
Bedrock AgentCore Evaluationsで学ぶLLM as a judge入門
Avatar for ShichijoYuhi shichijoyuhi
2
290
AIBuildersDay_track_A_iidaxs
Avatar for iidaxs iidaxs
4
1.5k
小さく、早く、可能性を多産する。生成AIプロジェクト / prAIrie-dog
Avatar for Visional Engineering ＆ Design visional_engineering_and_design
0
150
半年で、AIゼロ知識から AI中心開発組織の変革担当に至るまで
Avatar for ryu rfdnxbro
0
150
Agent Skillsがハーネスの垣根を超える日
Avatar for Gota gotalab555
6
4.7k
ソフトウェアエンジニアとAIエンジニアの役割分担についてのある事例
Avatar for KNOWLEDGE WORK / 株式会社ナレッジワーク kworkdev
PRO
0
320

Featured

See All Featured
Let's Do A Bunch of Simple Stuff to Make Websites Faster
Avatar for Chris Coyier chriscoyier
508
140k
Lessons Learnt from Crawling 1000+ Websites
Avatar for Charles Meaden charlesmeaden
PRO
0
970
Color Theory Basics | Prateek | Gurzu
Avatar for Gurzu gurzu
0
160
Building Experiences: Design Systems, User Experience, and Full Site Editing
Avatar for Michelle Schulp Hunt marktimemedia
0
350
A Modern Web Designer's Workflow
Avatar for Chris Coyier chriscoyier
698
190k
How to Think Like a Performance Engineer
Avatar for Harry Roberts csswizardry
28
2.4k
The World Runs on Bad Software
Avatar for Brandon Keepers bkeepers
PRO
72
12k
Mobile First: as difficult as doing things right
Avatar for Swwweet swwweet
225
10k
Ethics towards AI in product and experience design
Avatar for Skipper Chong Warson skipperchong
1
140
Tell your own story through comics
Avatar for letsgokoyo letsgokoyo
0
770
Skip the Path - Find Your Career Trail
Avatar for Mark Kilby mkilby
0
28
Un-Boring Meetings
Avatar for Sebastian Deterding codingconduct
0
170

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