SlideShare a Scribd company logo
Bank of England & FCA
June 2023
Digital for people and planet:
an intersectional design approach
Matt Gibson
Chief Commercial Officer
Hi, I’m Matt
@duckymatt
Cyber-Duck leverages UX,
Service Design, and open
source technology to deliver
transformation beyond digital
@cyberduck_uk
Human centred
designer
Designing for people
The role of UX design so far…
What good design should deliver
Meaningful
Pleasurable
Convenient
Usable
Reliable
Functional (Useful)
Inspiration: https://marvelapp.com/blog/introduction-user-experience-design/
Inaccessible
sites
Longer user
journeys/
dead ends
Frustration/
Rage clicking
Data
harvesting
Deceptive
UX
Slow-
moving
sites
Implicit
bias
What poor design can look like
Digital exclusion exacerbates
social/economic exclusion
Fraud/safety
Poor design has wider implications
Ableist barriers
Ageist barriers
Broken or inefficient
public services
Digital design - a missing component
Good
Design
Society
???
Economy
Across each level
Individual
Organisational
Systemic
Accessibility
Delight
Usability
Utility
Efficiency
Privacy
Safety
Digital design has far wider implications
1995
The average
webpage
weight was
15kb
2010
The average
webpage
weight was
702kb
2023
The average
webpage weight is
over 2MB
The largest page
found during one
study was 678MB
Digital has grown inexorably in size
Source: https://almanac.httparchive.org/en/2022/page-weight
1.98B
Websites in
existence,
56.5B pages
indexed by
Google. Only
200m sites are
active
56B
Hours spent
watching just
YouTube and
TikTok alone
5.7m
Apps on Google
Play, Apple App
Store & Amazon
alone with 285 bn
downloads
expected by 2023
m
4
Podcasts at an
absolute
minimum,
growing every
day
A vast bloated digital product ecosystem
Sources: The Podcast Index 4.2m podcasts in their index, Mar 2022 | Online Microtransaction Global Market Report 2022 - Reportlinker |
https://www.businessdit.com/average-time-spent-on-tiktok/ | https://www.globalmediainsight.com/blog/youtube-users-statistics/ |
https://www.statista.com/statistics/611707/online-video-time-spent/ | https://
fi
rstsiteguide.com/how-many-websites/
Computing power
demand now
doubles every two
months, compared
to every 24 months
before 2012
zetabytes
Stratospheric data growth
175
of data created,
captured, copied,
and consumed
worldwide every
year by 2025
=
Sources: US’ NDC | https://www.researchgate.net/publication/351221765_Brain-inspired_computing_We_need_a_master_plan
The result?
ICT’s GHG footprint already
outstrips the aviation industry,
equivalent to being the 5th
largest country carbon emitter,
and growing rapidly.
Sources: https://www.myclimate.org/information/faq/faq-detail/what-is-a-digital-carbon-footprint/ |
https://www.
fi
ftyshadesgreener.ie/blog/calculating-our-digital-carbon-footprint | https://www.atag.org/facts-
fi
gures/ |
https://www.europarl.europa.eu/doceo/document/E-9-2020-001324_EN.html
“The typical data centre uses
about 3-5 million gallons of
water per day - the same
amount of water as a city of
30,000 to 50,000 people”
Prof. Venkatesh Uddameri, Water Resources Center at Texas Tech University.
Digital design’s business as usual must change
Designing for planet
Bad design worsens digital’s environmental impact
Inaccessible sites
Longer user journeys/
dead ends
Frustration/
Rage clicking
Data harvesting
Deceptive UX
Slow-moving sites
Implicit bias
Wasted
energy,
water,
resources
Additional/replicated user journeys
Wasted user journeys
Wasted downloads
Failed user journeys
Unnecessary user sessions
Unnecessary page reloads
Unnecessary data capture/sharing
Unnecessary data storage
Inaccessible sites
Longer user journeys/
dead ends
Frustration/
Rage clicking
Data harvesting
Deceptive UX
Slow-moving sites
Implicit bias
Bad design worsens digital’s environmental impact
Good
Design
Society
Environment
Economy
Intersectional
design built on
sustainable
foundations
Accessibility
Delight
Usability
Utility
Efficiency
Privacy
Safety
Better digital design means intersectional design
What does it look like in practice?
INFRASTRUCTURE NET
ZERO
DESIGN FOR ‘LESS IS
MORE’
ARCHITECT FOR
HIERARCHY
The 10 foundations for
sustainable web design
CONTENT
FOOTPRINT
ACCESSIBILITY PLAN
LEAN DATA
COLLECTION
TECHNICAL /ASSET
OPTIMISATION
ITERATION, ITERATION,
ITERATION
ORGANISATIONAL
CHANGE
FOCUS ON FINDABILITY
& TASKS
Resource: https://www.cyber-duck.co.uk/insights/resources/sustainable-by-web-design
Content footprint
Site
Consolidation
User research
Content strategy
Site audit
Content
Consolidation
Content audit
Content strategy
Content governance
Image by Freepik
Accessibility plan, inclusive design
Design for ‘less is more’
Design for ‘less is more’
Total budget
<500Kb
Images/video
300Kb
25Kb
Fonts
HTML/CSS
40Kb
Javascript
50Kb
Inspiration: https://v3.danmall.com/articles/how-to-make-a-performance-budget/index.html
Design for ‘less is more’
Total budget
<500Kb
Images/video
180Kb
55Kb
Fonts
HTML/CSS
55Kb
Javascript
120Kb
Inspiration: https://v3.danmall.com/articles/how-to-make-a-performance-budget/index.html
Architect for hierarchy
H1 30px Bold
H2 25px Bold
H3 20px Medium
H3 16px Medium
BTN 16px Book
Focus on findability and tasks
Search
Lean data collection
Name:
Email:
Phone:
Address:
Previous address:
Job title:
Name:
Email:
Phone:
Register
Back
Inspiration: https://www.mightybytes.com/blog/design-a-sustainable-data-strategy/
Asset optimisation
</>
Reduce file size
Make the planet a persona?
Source: https://bootcamp.uxdesign.cc/8-steps-to-using-non-human-personas-in-digital-design-62aa02f8ae63
Realise there’s no silver bullet, only research and optimisation
Source: https://www.publicissapient.com/industries/energy-commodities/tech-awards
INFRASTRUCTURE NET
ZERO
DESIGN FOR ‘LESS IS
MORE’
ARCHITECT FOR
HIERARCHY
The 10 foundations for
sustainable web design
CONTENT
FOOTPRINT
ACCESSIBILITY PLAN
LEAN DATA
COLLECTION
TECHNICAL /ASSET
OPTIMISATION
ITERATION, ITERATION,
ITERATION
ORGANISATIONAL
CHANGE
FOCUS ON FINDABILITY
& TASKS
Resource: https://www.cyber-duck.co.uk/insights/resources/sustainable-by-web-design
Designing for people and planet
Designing for people and planet
THANK YOU
Matt Gibson, Cyber-Duck
matt@cyber-duck.co.uk
@cyberduck_uk
Useful resources and reading
- https://sustainablewebdesign.org/calculating-digital-emissions/
- https://bootcamp.uxdesign.cc/8-steps-to-using-non-human-personas-in-digital-
design-62aa02f8ae63
- https://v3.danmall.com/articles/how-to-make-a-performance-budget/index.html
- https://ecoping.earth/ / https://www.websitecarbon.com/
- https://www.cyber-duck.co.uk/insights/how-sustainable-design-can-help-climate-
change
- https://www.cyber-duck.co.uk/insights/how-to-drive-down-website-carbon-
emissions
- https://www.cyber-duck.co.uk/insights/resources/sustainable-by-web-design
- https://www.digital4planet.org/towards-sustainable-internet/

More Related Content

DIGITAL FOR PEOPLE AND PLANET – AN INTERSECTIONAL DESIGN APPROACH

  • 1. Bank of England & FCA June 2023 Digital for people and planet: an intersectional design approach Matt Gibson Chief Commercial Officer
  • 3. Cyber-Duck leverages UX, Service Design, and open source technology to deliver transformation beyond digital @cyberduck_uk
  • 6. The role of UX design so far…
  • 7. What good design should deliver Meaningful Pleasurable Convenient Usable Reliable Functional (Useful) Inspiration: https://marvelapp.com/blog/introduction-user-experience-design/
  • 8. Inaccessible sites Longer user journeys/ dead ends Frustration/ Rage clicking Data harvesting Deceptive UX Slow- moving sites Implicit bias What poor design can look like
  • 9. Digital exclusion exacerbates social/economic exclusion Fraud/safety Poor design has wider implications Ableist barriers Ageist barriers Broken or inefficient public services
  • 10. Digital design - a missing component Good Design Society ??? Economy Across each level Individual Organisational Systemic Accessibility Delight Usability Utility Efficiency Privacy Safety
  • 11. Digital design has far wider implications
  • 12. 1995 The average webpage weight was 15kb 2010 The average webpage weight was 702kb 2023 The average webpage weight is over 2MB The largest page found during one study was 678MB Digital has grown inexorably in size Source: https://almanac.httparchive.org/en/2022/page-weight
  • 13. 1.98B Websites in existence, 56.5B pages indexed by Google. Only 200m sites are active 56B Hours spent watching just YouTube and TikTok alone 5.7m Apps on Google Play, Apple App Store & Amazon alone with 285 bn downloads expected by 2023 m 4 Podcasts at an absolute minimum, growing every day A vast bloated digital product ecosystem Sources: The Podcast Index 4.2m podcasts in their index, Mar 2022 | Online Microtransaction Global Market Report 2022 - Reportlinker | https://www.businessdit.com/average-time-spent-on-tiktok/ | https://www.globalmediainsight.com/blog/youtube-users-statistics/ | https://www.statista.com/statistics/611707/online-video-time-spent/ | https:// fi rstsiteguide.com/how-many-websites/
  • 14. Computing power demand now doubles every two months, compared to every 24 months before 2012 zetabytes Stratospheric data growth 175 of data created, captured, copied, and consumed worldwide every year by 2025 = Sources: US’ NDC | https://www.researchgate.net/publication/351221765_Brain-inspired_computing_We_need_a_master_plan
  • 15. The result? ICT’s GHG footprint already outstrips the aviation industry, equivalent to being the 5th largest country carbon emitter, and growing rapidly. Sources: https://www.myclimate.org/information/faq/faq-detail/what-is-a-digital-carbon-footprint/ | https://www. fi ftyshadesgreener.ie/blog/calculating-our-digital-carbon-footprint | https://www.atag.org/facts- fi gures/ | https://www.europarl.europa.eu/doceo/document/E-9-2020-001324_EN.html
  • 16. “The typical data centre uses about 3-5 million gallons of water per day - the same amount of water as a city of 30,000 to 50,000 people” Prof. Venkatesh Uddameri, Water Resources Center at Texas Tech University.
  • 17. Digital design’s business as usual must change
  • 19. Bad design worsens digital’s environmental impact Inaccessible sites Longer user journeys/ dead ends Frustration/ Rage clicking Data harvesting Deceptive UX Slow-moving sites Implicit bias
  • 20. Wasted energy, water, resources Additional/replicated user journeys Wasted user journeys Wasted downloads Failed user journeys Unnecessary user sessions Unnecessary page reloads Unnecessary data capture/sharing Unnecessary data storage Inaccessible sites Longer user journeys/ dead ends Frustration/ Rage clicking Data harvesting Deceptive UX Slow-moving sites Implicit bias Bad design worsens digital’s environmental impact
  • 22. What does it look like in practice?
  • 23. INFRASTRUCTURE NET ZERO DESIGN FOR ‘LESS IS MORE’ ARCHITECT FOR HIERARCHY The 10 foundations for sustainable web design CONTENT FOOTPRINT ACCESSIBILITY PLAN LEAN DATA COLLECTION TECHNICAL /ASSET OPTIMISATION ITERATION, ITERATION, ITERATION ORGANISATIONAL CHANGE FOCUS ON FINDABILITY & TASKS Resource: https://www.cyber-duck.co.uk/insights/resources/sustainable-by-web-design
  • 24. Content footprint Site Consolidation User research Content strategy Site audit Content Consolidation Content audit Content strategy Content governance Image by Freepik
  • 26. Design for ‘less is more’
  • 27. Design for ‘less is more’ Total budget <500Kb Images/video 300Kb 25Kb Fonts HTML/CSS 40Kb Javascript 50Kb Inspiration: https://v3.danmall.com/articles/how-to-make-a-performance-budget/index.html
  • 28. Design for ‘less is more’ Total budget <500Kb Images/video 180Kb 55Kb Fonts HTML/CSS 55Kb Javascript 120Kb Inspiration: https://v3.danmall.com/articles/how-to-make-a-performance-budget/index.html
  • 29. Architect for hierarchy H1 30px Bold H2 25px Bold H3 20px Medium H3 16px Medium BTN 16px Book
  • 30. Focus on findability and tasks Search
  • 31. Lean data collection Name: Email: Phone: Address: Previous address: Job title: Name: Email: Phone: Register Back Inspiration: https://www.mightybytes.com/blog/design-a-sustainable-data-strategy/
  • 33. Make the planet a persona? Source: https://bootcamp.uxdesign.cc/8-steps-to-using-non-human-personas-in-digital-design-62aa02f8ae63
  • 34. Realise there’s no silver bullet, only research and optimisation Source: https://www.publicissapient.com/industries/energy-commodities/tech-awards
  • 35. INFRASTRUCTURE NET ZERO DESIGN FOR ‘LESS IS MORE’ ARCHITECT FOR HIERARCHY The 10 foundations for sustainable web design CONTENT FOOTPRINT ACCESSIBILITY PLAN LEAN DATA COLLECTION TECHNICAL /ASSET OPTIMISATION ITERATION, ITERATION, ITERATION ORGANISATIONAL CHANGE FOCUS ON FINDABILITY & TASKS Resource: https://www.cyber-duck.co.uk/insights/resources/sustainable-by-web-design
  • 36. Designing for people and planet
  • 37. Designing for people and planet
  • 38. THANK YOU Matt Gibson, Cyber-Duck matt@cyber-duck.co.uk @cyberduck_uk
  • 39. Useful resources and reading - https://sustainablewebdesign.org/calculating-digital-emissions/ - https://bootcamp.uxdesign.cc/8-steps-to-using-non-human-personas-in-digital- design-62aa02f8ae63 - https://v3.danmall.com/articles/how-to-make-a-performance-budget/index.html - https://ecoping.earth/ / https://www.websitecarbon.com/ - https://www.cyber-duck.co.uk/insights/how-sustainable-design-can-help-climate- change - https://www.cyber-duck.co.uk/insights/how-to-drive-down-website-carbon- emissions - https://www.cyber-duck.co.uk/insights/resources/sustainable-by-web-design - https://www.digital4planet.org/towards-sustainable-internet/