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
420

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
170
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
Gaze-LLE: Gaze Target Estimation via Large-Scale Learned Encoders
Avatar for Kazuyuki Miyazawa kzykmyzw
0
320
事業価値と Engineering
Avatar for Recruit recruitengineers
PRO
2
230
ソフトウェア エンジニアとしての 姿勢と心構え
Avatar for Recruit recruitengineers
PRO
4
770
Evolution on AI Agent and Beyond - AGI への道のりと、シンギュラリティの３つのシナリオ
Avatar for Masaya Mori (森正弥) / CAIO (Chief AI Officer) masayamoriofficial
0
180
LLMエージェント時代に適応した開発フロー
Avatar for Yuya Hirayama hiragram
1
410
JOAI発表資料 @ 関東kaggler会
Avatar for 日本人工知能オリンピック joai_committee
1
350
RAID6 を楔形文字で組んで現代人を怖がらせましょう（実装編）
Avatar for mimifuwacc mimifuwa
1
310
会社にデータエンジニアがいることでできるようになること
Avatar for 10xinc 10xinc
9
1.6k
認知戦の理解と、市民としての対抗策
Avatar for hogehuga hogehuga
0
370
Yahoo!ニュースにおけるソフトウェア開発
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
370
あとはAIに任せて人間は自由に生きる
Avatar for Kentaro Kuribayashi kentaro
3
1.1k
Product Management Conference -AI時代に進化するPdM-
Avatar for Yuta Kojima kojima111
0
220

Featured

See All Featured
Designing for humans not robots
Avatar for Tammie Lister tammielis
253
25k
GitHub's CSS Performance
Avatar for Jon Rohan jonrohan
1031
460k
The Cult of Friendly URLs
Avatar for Andy Hume andyhume
79
6.5k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
Avatar for Morgane Peng morganepeng
131
19k
Rebuilding a faster, lazier Slack
Avatar for samanthasiow samanthasiow
83
9.1k
Producing Creativity
Avatar for Steve Smith orderedlist
PRO
347
40k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
Avatar for Tammy Everts tammyeverts
8
480
Practical Tips for Bootstrapping Information Extraction Pipelines
Avatar for Matthew Honnibal honnibal
PRO
23
1.4k
Gamification - CAS2011
Avatar for David Bonilla davidbonilla
81
5.4k
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
790
250k
The World Runs on Bad Software
Avatar for Brandon Keepers bkeepers
PRO
70
11k
How to train your dragon (web standard)
Avatar for Monica Dinculescu notwaldorf
96
6.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