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.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
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
180
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
巨大モノリスのリプレイス──機能整理とハイブリッドアーキテクチャで挑んだ再構築戦略
Avatar for ZOZO Developers zozotech
PRO
0
290
組織の“見えない壁”を越えよ！エンタープライズシフトに必須な3つのPMの「在り方」変革 #pmconf2025
Avatar for Masakazu Inaba masakazu178
1
830
自然言語でAPI作業を片付ける！「Postman Agent Mode」
Avatar for 草薙昭彦 nagix
0
130
Pandocでmd→pptx便利すぎワロタwww
Avatar for meow meow_noisy
2
910
FFMとJVMの実装から学ぶJavaのインテグリティ
Avatar for Kenji Kazumura kazumura
0
160
AI × クラウドで シイタケの収穫時期を判定してみた
Avatar for Lamaglama39 lamaglama39
1
390
ECS組み込みのBlue/Greenデプロイを動かしてELB側の動きを観察してみる
Avatar for 矢儀丈博 yuki_ink
3
410
TypeScript×CASLでつくるSaaSの認可 / Authz with CASL
Avatar for Jumpei Sakatsu saka2jp
2
120
AS59105におけるFreeBSD EtherIPの運用と課題
Avatar for t-umeda x86taka
0
270
Greenは本当にGreenか？ - B/GデプロイとAPI自動テストで安心デプロイ
Avatar for Kaz Watanabe kaz29
0
130
レガシーで硬直したテーブル設計から変更容易で柔軟なテーブル設計にする
Avatar for Red Frasco red_frasco
4
570
未回答質問の回答一覧 / 開発をリードする品質保証 QAエンジニアと開発者の未来を考える-Findy Online Conference -
Avatar for ファインディ株式会社（イベント資料アップ用） findy_eventslides
0
410

Featured

See All Featured
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
33
1.2k
Context Engineering - Making Every Token Count
Avatar for Addy Osmani addyosmani
9
410
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Avatar for Marc Duiker marcduiker
34
2.3k
Designing for humans not robots
Avatar for Tammie Lister tammielis
254
26k
Building Applications with DynamoDB
Avatar for Matt Wood mza
96
6.8k
Making the Leap to Tech Lead
Avatar for Ryan Cromwell cromwellryan
135
9.6k
Side Projects
Avatar for Sacha Greif sachag
455
43k
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
791
250k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
666
130k
Product Roadmaps are Hard
Avatar for C. Todd Lombardo iamctodd
PRO
55
12k
Done Done
Avatar for chrislema chrislema
186
16k
Facilitating Awesome Meetings
Avatar for Lara Hogan lara
57
6.6k

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