Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Harmonising content and code
Search
Richard Saunders
November 09, 2017
Technology
0
89
Harmonising content and code
Richard Saunders
November 09, 2017
Tweet
Share
More Decks by Richard Saunders
See All by Richard Saunders
Content modelling workshop: Brighton University
rdsaunders
0
260
Contensis User Group - Spring 2019
rdsaunders
0
140
Rocket Conf 2018 - Contensis update
rdsaunders
0
110
Contensis User Group 2017 - Product update
rdsaunders
0
160
Rocket 2017 - Contensis Product Update
rdsaunders
0
270
Rocket 2017 - Future of Contensis
rdsaunders
0
96
Contensis User Group 2016 - Product Update
rdsaunders
0
180
The Future of Contensis - 2016
rdsaunders
0
140
Contensis Product Update 2016
rdsaunders
0
250
Other Decks in Technology
See All in Technology
Cross Data Platforms Meetup LT 20250422
tarotaro0129
1
770
C++26アップデート 2025-03
faithandbrave
0
1.1k
AWSのマルチアカウント管理 ベストプラクティス最新版 2025 / Multi-Account management on AWS best practice 2025
ohmura
4
320
AIにおけるソフトウェアテスト_ver1.00
fumisuke
1
220
新卒エンジニアがCICDをモダナイズしてみた話
akashi_sn
2
260
サーバレス、コンテナ、データベース特化型機能をご紹介。CloudWatch をもっと使いこなそう!
o11yfes2023
0
190
JPOUG Tech Talk #12 UNDO Tablespace Reintroduction
nori_shinoda
2
160
SnowflakeとDatabricks両方でRAGを構築してみた
kameitomohiro
1
470
グループ ポリシー再確認 (2)
murachiakira
0
120
Winning at PHP in Production in 2025
beberlei
1
200
アジャイル脅威モデリング#1(脅威モデリングナイト#8)
masakane55
3
230
От ручной разметки к LLM: как мы создавали облако тегов в Lamoda. Анастасия Ангелова, Data Scientist, Lamoda Tech
lamodatech
0
810
Featured
See All Featured
The World Runs on Bad Software
bkeepers
PRO
68
11k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
13
790
How to train your dragon (web standard)
notwaldorf
90
6k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
60k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
13
1.4k
Why Our Code Smells
bkeepers
PRO
336
57k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
227
22k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
45
7.2k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
129
19k
How to Ace a Technical Interview
jacobian
276
23k
It's Worth the Effort
3n
184
28k
Transcript
content & code harmonising
Design systems
A set of connected patterns and shared practices, coherently organised
to serve the purposes of a digital product. – Alla Kholmatova “
– Alla Kholmatova Design Systems A practical guide to creating
design languages for digital products
None
None
None
None
None
– Brad Frost Atomic Design Creating and maintaining robust design
systems http://atomicdesign.bradfrost.com/
– Richard Saunders, Zengenti Design systems in websites and apps
https://www.youtube.com/watch?v=z_ZLkEZtwLk
– Louis Rosenfeld Every large website is a complex adaptive
system “
?
100
100000
1000 - 5000
Static content
Dynamic content
Curated content
Personalised content
French German Multilingual content
None
– Louis Rosenfeld Every large website is a complex adaptive
system “
Modelling Create better content
None
None
None
None
None
None
Components Grouping small pieces of content
Components are groups of fields you can use in your
content types. – Richard Saunders “
Allow you to group unique chunks of content together that
do not make sense on their own. – Richard Saunders “
SEO Address Opening hours Video banner Image carousel Social open
graph Feature areas Small stories Course module Blood results
None
None
None
None
None
None
None
Interface inventory An audit of the elements of your website
None
None
Content + Code = Delivery Component
Video banner
Logo block
Feature block
Hero feature
Summary - centred
DEMO Component builder
Componentise content delivery
Video banner { "type": "videoHeroBlock", "value": { "title": "Work for
us", "subtitle": null, "callToAction": "https://www.zengenti.com/jobs”, "videoURL": "https://www.youtube.com/watch? v=04cANjthus0" } }
None
None
None
Brings consistency
None
Simpler testing
Monitor and improve performance
– Airbnb Airbnb Design Painting with code https://airbnb.design/painting-with-code/
None
None
None
None
Summary
Work towards establishing a design system
– Alla Kholmatova Design Systems A practical guide to creating
design languages for digital products
Focus on your content
Content first
Define common reusable components
This process takes time
But establishes a foundation for the future
Thank you