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
2.1k

Other Decks in Technology

See All in Technology
KubeCon + CloudNativeCon Japan 2025 Recap
Avatar for Kazuki Obata donkomura
0
160
Agent Development Kitで始める生成 AI エージェント実践開発
Avatar for danishi danishi
0
120
Google Agentspaceを実際に導入した効果と今後の展望
Avatar for MIXI ENGINEERS mixi_engineers
PRO
3
330
リリース２ヶ月で収益化した話
Avatar for Ken.T kent_code3
1
190
LTに影響を受けてテンプレリポジトリを作った話
Avatar for Horikawa hol1kgmg
0
290
【CEDEC2025】現場を理解して実現！ゲーム開発を効率化するWebサービスの開発と、利用促進のための継続的な改善
Avatar for Cygames cygames
PRO
0
720
【CEDEC2025】『ウマ娘 プリティーダービー』における映像制作のさらなる高品質化へ！～ 豊富な素材出力と制作フローの改善を実現するツールについて～
Avatar for Cygames cygames
PRO
0
230
【CEDEC2025】大規模言語モデルを活用したゲーム内会話パートのスクリプト作成支援への取り組み
Avatar for Cygames cygames
PRO
2
770
Foundation Model × VisionKit で実現するローカル OCR
Avatar for SansanTech sansantech
PRO
0
290
Unson OS｜48時間で「売れるか」を判定する AI 市場検証プラットフォーム
Avatar for 佐藤圭吾 unson
0
170
バクラクによるコーポレート業務の自動運転 #BetAIDay
Avatar for LayerX layerx
PRO
1
830
ビジネス文書に特化した基盤モデル開発 / SaaSxML_Session_2
Avatar for Sansan R&D sansan_randd
0
260

Featured

See All Featured
GitHub's CSS Performance
Avatar for Jon Rohan jonrohan
1031
460k
XXLCSS - How to scale CSS and keep your sanity
Avatar for Zaharenia Atzitzikaki sugarenia
248
1.3M
Raft: Consensus for Rubyists
Avatar for Patrick Van Stee vanstee
140
7k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
Avatar for Rebecca Miller-Webster rmw
34
3.1k
Six Lessons from altMBA
Avatar for Skipper Chong Warson skipperchong
28
3.9k
The Straight Up "How To Draw Better" Workshop
Avatar for Dennis Kardys denniskardys
235
140k
Build your cross-platform service in a week with App Engine
Avatar for Jose L jlugia
231
18k
Side Projects
Avatar for Sacha Greif sachag
455
43k
Art, The Web, and Tiny UX
Avatar for Lynn Fisher lynnandtonic
301
21k
Fight the Zombie Pattern Library - RWD Summit 2016
Avatar for Marcelo Somers marcelosomers
234
17k
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
160
23k
Into the Great Unknown - MozCon
Avatar for Noah Learner thekraken
40
2k

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