SlideShare una empresa de Scribd logo
1 de 20
Responsive design and
the content challenge
noz.urbina@mekon.com
@nozurbina
lessworkmoreflow.blogspot.com
Agenda
• Me
• Terms
– Adaptive/Responsive Design?
• Many challenges
– Content and UX
• Adaptive Content
• Collaboration to meet the challenge
Viva España!
Congility Events Chair
Content strategist
Consultant/trainer
Author
Noz Urbina (me)
Becoming a Content Strategist
Customer support for authoring tools
Presales support
Content solutions services and training
Consultant for content strategies
“Did you know you‟re called a „content strategist’
now?”
DEFINING OUR TERMS
Responsive Design
Adaptive Design
Content and UX
Adaptive Content
Responsive Design
All content is delivered. Appearance,
layouts and features are adjusted for
device client-side
Adaptive Design
Device and other context is
detected, then server-side logic
sends only appropriate layouts &
features
LinkedIn
App
Mobile Site
LinkedIn
THAT’S THE LEAST OF OUR
WORRIES
If only there were only desktop and mobile...
Beyond 24”
bit.ly/lwmf-taxDJp1
Multi-device
Google Glass
Vuzix M100
Recon JetEpson Moverio (on sale)
Telepathy One
BUT WHAT ABOUT THE
CONTENT?
The stuff that the people are actually looking for?
Content is the lens through which
users perceive the brand
http://commons.wikimedia.org/wiki/File:
Oakley_sunglasses.jpg
Lens and Frames Must Work
Together
Personal
Preference
Functional
Imperative
All images
http://commons.wikimedia.org
Content and User Experience
• Great design can‟t
save inappropriate
content
• The more diverse the
interaction contexts,
the more stretched
content will become
• Square peg, round
hole, bad experience
Adaptive Content
• Content designed to
adapt to multi-channel
multi-format and
progressive
enhancement /
disclosure situations
• Can be:
– Transformed
– Filtered
• Because it‟s got:
– No presentation
information!
– Structure
– Rich metadata
– Built-in, in-line
semantics
Adaptive Content
• Adaptive Content
Enables Contextually-
Appropriate
Experiences
Why Now?
• Multi-channel scenarios and
responsive and adaptive design are
raising the profile of Content
Strategy and Adaptive Content
• It forces people to confront real
optimisation of the content‟s role in
UX
Q&A
...and surprise book give-away!
noz.urbina@mekon.com
@nozurbina
http://lessworkmoreflow.blogspot.com
Please reach under your chairs
and look for a winning sticker!

Más contenido relacionado

Destacado

Operaciones aritmeticas utilizando_radio_button(1)_1
Operaciones aritmeticas utilizando_radio_button(1)_1Operaciones aritmeticas utilizando_radio_button(1)_1
Operaciones aritmeticas utilizando_radio_button(1)_1
Giezy Vera
 
محاضرةF 5 مهارات التعميمgeneralization- دكتور محمد جمعه
محاضرةF 5 مهارات التعميمgeneralization- دكتور محمد جمعهمحاضرةF 5 مهارات التعميمgeneralization- دكتور محمد جمعه
محاضرةF 5 مهارات التعميمgeneralization- دكتور محمد جمعه
Mohamad Gomaa
 

Destacado (16)

Atencion primaria en salud
Atencion primaria en saludAtencion primaria en salud
Atencion primaria en salud
 
Yammer can help with that!
Yammer can help with that!Yammer can help with that!
Yammer can help with that!
 
Direct Request Appointment Setting Model
Direct Request Appointment Setting ModelDirect Request Appointment Setting Model
Direct Request Appointment Setting Model
 
20 tips to be inCredible
20 tips to be inCredible20 tips to be inCredible
20 tips to be inCredible
 
Browne Jacobson LLP Annual Review 2013-14 - We’ve been busy...
Browne Jacobson LLP Annual Review 2013-14 - We’ve been busy...Browne Jacobson LLP Annual Review 2013-14 - We’ve been busy...
Browne Jacobson LLP Annual Review 2013-14 - We’ve been busy...
 
Debianでできる簡単監視システム。
Debianでできる簡単監視システム。Debianでできる簡単監視システム。
Debianでできる簡単監視システム。
 
Caso clinico de cefalea
Caso clinico de cefaleaCaso clinico de cefalea
Caso clinico de cefalea
 
Critical Outcome - September 2014
Critical Outcome - September 2014Critical Outcome - September 2014
Critical Outcome - September 2014
 
Media Kit 2009
Media Kit 2009Media Kit 2009
Media Kit 2009
 
Social Media Around Belgium (Presentation IAB Breakfast)
Social Media Around Belgium (Presentation IAB Breakfast)Social Media Around Belgium (Presentation IAB Breakfast)
Social Media Around Belgium (Presentation IAB Breakfast)
 
Operaciones aritmeticas utilizando_radio_button(1)_1
Operaciones aritmeticas utilizando_radio_button(1)_1Operaciones aritmeticas utilizando_radio_button(1)_1
Operaciones aritmeticas utilizando_radio_button(1)_1
 
Agile in the martix @RUAG Defence-Agile Prozesse in Unternehmen
Agile in the martix @RUAG Defence-Agile Prozesse in UnternehmenAgile in the martix @RUAG Defence-Agile Prozesse in Unternehmen
Agile in the martix @RUAG Defence-Agile Prozesse in Unternehmen
 
กริยา40
กริยา40กริยา40
กริยา40
 
Choroidal Angioma on Image
Choroidal Angioma on ImageChoroidal Angioma on Image
Choroidal Angioma on Image
 
محاضرةF 5 مهارات التعميمgeneralization- دكتور محمد جمعه
محاضرةF 5 مهارات التعميمgeneralization- دكتور محمد جمعهمحاضرةF 5 مهارات التعميمgeneralization- دكتور محمد جمعه
محاضرةF 5 مهارات التعميمgeneralization- دكتور محمد جمعه
 
Epilepsy in Preterm Neonate MRI
Epilepsy in Preterm Neonate MRIEpilepsy in Preterm Neonate MRI
Epilepsy in Preterm Neonate MRI
 

Similar a Responsive design and the content challenge

Dita and Information Architecture for Responsive Design
Dita and Information Architecture for Responsive DesignDita and Information Architecture for Responsive Design
Dita and Information Architecture for Responsive Design
Phil Kneer
 
UX Tools for Agile Teams – Design Mission
UX Tools for Agile Teams – Design MissionUX Tools for Agile Teams – Design Mission
UX Tools for Agile Teams – Design Mission
Marc-Oliver Gern
 
Responsive Design Talk @ Toronto Dev Derby March
Responsive Design Talk @ Toronto Dev Derby MarchResponsive Design Talk @ Toronto Dev Derby March
Responsive Design Talk @ Toronto Dev Derby March
themystic_ca
 
Content: a coming of age story
Content: a coming of age storyContent: a coming of age story
Content: a coming of age story
Maddie_heyday
 
PxS’12 - week 4 - UX design techniques
PxS’12 - week 4 - UX design techniquesPxS’12 - week 4 - UX design techniques
PxS’12 - week 4 - UX design techniques
hendrikknoche
 

Similar a Responsive design and the content challenge (20)

Strategy for a Responsive UX
Strategy for a Responsive UXStrategy for a Responsive UX
Strategy for a Responsive UX
 
Strategies for User Experience Design
Strategies for User Experience DesignStrategies for User Experience Design
Strategies for User Experience Design
 
Dita and Information Architecture for Responsive Design
Dita and Information Architecture for Responsive DesignDita and Information Architecture for Responsive Design
Dita and Information Architecture for Responsive Design
 
Adaptive Content & Responsive design: the content challenge
Adaptive Content & Responsive design: the content challengeAdaptive Content & Responsive design: the content challenge
Adaptive Content & Responsive design: the content challenge
 
Responsive Design and Joomla!
Responsive Design and Joomla!Responsive Design and Joomla!
Responsive Design and Joomla!
 
UX Tools for Agile Teams – Design Mission
UX Tools for Agile Teams – Design MissionUX Tools for Agile Teams – Design Mission
UX Tools for Agile Teams – Design Mission
 
Responsive Design Talk @ Toronto Dev Derby March
Responsive Design Talk @ Toronto Dev Derby MarchResponsive Design Talk @ Toronto Dev Derby March
Responsive Design Talk @ Toronto Dev Derby March
 
Responsive Design & Prototyping -- An Agency Model (Part 3/3)
Responsive Design & Prototyping -- An Agency Model (Part 3/3)Responsive Design & Prototyping -- An Agency Model (Part 3/3)
Responsive Design & Prototyping -- An Agency Model (Part 3/3)
 
Guidelines for Responsive UX Design 11/16/19
Guidelines for Responsive UX Design 11/16/19Guidelines for Responsive UX Design 11/16/19
Guidelines for Responsive UX Design 11/16/19
 
Guidelines for Responsive UX Design 07/20/19
Guidelines for Responsive UX Design 07/20/19Guidelines for Responsive UX Design 07/20/19
Guidelines for Responsive UX Design 07/20/19
 
Touch Screens | The very expensive mistake
Touch Screens | The very expensive mistakeTouch Screens | The very expensive mistake
Touch Screens | The very expensive mistake
 
Content First, Designing in the Browser - UX camp CPH
Content First, Designing in the Browser -  UX camp CPHContent First, Designing in the Browser -  UX camp CPH
Content First, Designing in the Browser - UX camp CPH
 
Guidelines for Responsive UX Design 12/12/20
Guidelines for Responsive UX Design 12/12/20Guidelines for Responsive UX Design 12/12/20
Guidelines for Responsive UX Design 12/12/20
 
Content: a coming of age story
Content: a coming of age storyContent: a coming of age story
Content: a coming of age story
 
PxS’12 - week 4 - UX design techniques
PxS’12 - week 4 - UX design techniquesPxS’12 - week 4 - UX design techniques
PxS’12 - week 4 - UX design techniques
 
Responsive Web Design
Responsive Web DesignResponsive Web Design
Responsive Web Design
 
How Do I UX?
How Do I UX?How Do I UX?
How Do I UX?
 
Content is Design, Design is Content – How To Design For User Experience
Content is Design, Design is Content – How To Design For User ExperienceContent is Design, Design is Content – How To Design For User Experience
Content is Design, Design is Content – How To Design For User Experience
 
Touch Screens | The Very Expensive Mistake
Touch Screens | The Very Expensive MistakeTouch Screens | The Very Expensive Mistake
Touch Screens | The Very Expensive Mistake
 
Guidelines for Responsive UX Design 11/15/2018
Guidelines for Responsive UX Design 11/15/2018Guidelines for Responsive UX Design 11/15/2018
Guidelines for Responsive UX Design 11/15/2018
 

Más de UXPA UK

How can we design drones for 7 year olds by Pae Natwilai
How can we design drones for 7 year olds by Pae NatwilaiHow can we design drones for 7 year olds by Pae Natwilai
How can we design drones for 7 year olds by Pae Natwilai
UXPA UK
 
Food Cloud - Fiona Kelly
Food Cloud - Fiona KellyFood Cloud - Fiona Kelly
Food Cloud - Fiona Kelly
UXPA UK
 

Más de UXPA UK (20)

Design for menaing
Design for menaingDesign for menaing
Design for menaing
 
Having a halibut good time with service deisgn
Having a halibut good time with service deisgnHaving a halibut good time with service deisgn
Having a halibut good time with service deisgn
 
The Ethics of Design
The Ethics of DesignThe Ethics of Design
The Ethics of Design
 
When Cambridge Analytica Met Facebook: A story of dark UX and shitty business...
When Cambridge Analytica Met Facebook: A story of dark UX and shitty business...When Cambridge Analytica Met Facebook: A story of dark UX and shitty business...
When Cambridge Analytica Met Facebook: A story of dark UX and shitty business...
 
Designing for Persuasion, Emotion, and Trust
Designing for Persuasion, Emotion, and TrustDesigning for Persuasion, Emotion, and Trust
Designing for Persuasion, Emotion, and Trust
 
Going End to End with Lovehoney
Going End to End with LovehoneyGoing End to End with Lovehoney
Going End to End with Lovehoney
 
Design, death and sex (workers)
Design, death and sex (workers)Design, death and sex (workers)
Design, death and sex (workers)
 
The role of UX design in AI by Tom Woodel
The role of UX design in AI by Tom WoodelThe role of UX design in AI by Tom Woodel
The role of UX design in AI by Tom Woodel
 
How can we design drones for 7 year olds by Pae Natwilai
How can we design drones for 7 year olds by Pae NatwilaiHow can we design drones for 7 year olds by Pae Natwilai
How can we design drones for 7 year olds by Pae Natwilai
 
What AI means for UX by James Clemoes
What AI means for UX by James ClemoesWhat AI means for UX by James Clemoes
What AI means for UX by James Clemoes
 
"Making Accessibility Accessible" by Kirtika Bhuva
"Making Accessibility Accessible" by Kirtika Bhuva"Making Accessibility Accessible" by Kirtika Bhuva
"Making Accessibility Accessible" by Kirtika Bhuva
 
"Designing a Product with Mental Health in Mind" by Zander Brade
"Designing a Product with Mental Health in Mind" by Zander Brade"Designing a Product with Mental Health in Mind" by Zander Brade
"Designing a Product with Mental Health in Mind" by Zander Brade
 
"Real Life Accessibility" by Gavin Evans
"Real Life Accessibility" by Gavin Evans"Real Life Accessibility" by Gavin Evans
"Real Life Accessibility" by Gavin Evans
 
"How to tie your customer design work into the enabling organisation" - by Jo...
"How to tie your customer design work into the enabling organisation" - by Jo..."How to tie your customer design work into the enabling organisation" - by Jo...
"How to tie your customer design work into the enabling organisation" - by Jo...
 
'Mainstream' UX and Games UX - Alistair Greo, Player Research
'Mainstream' UX and Games UX - Alistair Greo, Player Research'Mainstream' UX and Games UX - Alistair Greo, Player Research
'Mainstream' UX and Games UX - Alistair Greo, Player Research
 
Food Cloud - Fiona Kelly
Food Cloud - Fiona KellyFood Cloud - Fiona Kelly
Food Cloud - Fiona Kelly
 
Conservation & The Knowledge Chain - Paul-Jervis Heath, Modern Human
Conservation & The Knowledge Chain - Paul-Jervis Heath, Modern HumanConservation & The Knowledge Chain - Paul-Jervis Heath, Modern Human
Conservation & The Knowledge Chain - Paul-Jervis Heath, Modern Human
 
Finding Kakuma - Mike Gatman, Thoughtworks
Finding Kakuma - Mike Gatman, ThoughtworksFinding Kakuma - Mike Gatman, Thoughtworks
Finding Kakuma - Mike Gatman, Thoughtworks
 
Smart UX - Giles Colborne, cxpartners
Smart UX - Giles Colborne, cxpartners Smart UX - Giles Colborne, cxpartners
Smart UX - Giles Colborne, cxpartners
 
Fjord Trends 2016 - Seema Jain and Celia Romaniuk, Fjord
Fjord Trends 2016 - Seema Jain and Celia Romaniuk, Fjord Fjord Trends 2016 - Seema Jain and Celia Romaniuk, Fjord
Fjord Trends 2016 - Seema Jain and Celia Romaniuk, Fjord
 

Último

Último (20)

Extensible Python: Robustness through Addition - PyCon 2024
Extensible Python: Robustness through Addition - PyCon 2024Extensible Python: Robustness through Addition - PyCon 2024
Extensible Python: Robustness through Addition - PyCon 2024
 
Introduction to FIDO Authentication and Passkeys.pptx
Introduction to FIDO Authentication and Passkeys.pptxIntroduction to FIDO Authentication and Passkeys.pptx
Introduction to FIDO Authentication and Passkeys.pptx
 
FDO for Camera, Sensor and Networking Device – Commercial Solutions from VinC...
FDO for Camera, Sensor and Networking Device – Commercial Solutions from VinC...FDO for Camera, Sensor and Networking Device – Commercial Solutions from VinC...
FDO for Camera, Sensor and Networking Device – Commercial Solutions from VinC...
 
Microsoft CSP Briefing Pre-Engagement - Questionnaire
Microsoft CSP Briefing Pre-Engagement - QuestionnaireMicrosoft CSP Briefing Pre-Engagement - Questionnaire
Microsoft CSP Briefing Pre-Engagement - Questionnaire
 
Secure Zero Touch enabled Edge compute with Dell NativeEdge via FDO _ Brad at...
Secure Zero Touch enabled Edge compute with Dell NativeEdge via FDO _ Brad at...Secure Zero Touch enabled Edge compute with Dell NativeEdge via FDO _ Brad at...
Secure Zero Touch enabled Edge compute with Dell NativeEdge via FDO _ Brad at...
 
Intro in Product Management - Коротко про професію продакт менеджера
Intro in Product Management - Коротко про професію продакт менеджераIntro in Product Management - Коротко про професію продакт менеджера
Intro in Product Management - Коротко про професію продакт менеджера
 
2024 May Patch Tuesday
2024 May Patch Tuesday2024 May Patch Tuesday
2024 May Patch Tuesday
 
Using IESVE for Room Loads Analysis - UK & Ireland
Using IESVE for Room Loads Analysis - UK & IrelandUsing IESVE for Room Loads Analysis - UK & Ireland
Using IESVE for Room Loads Analysis - UK & Ireland
 
(Explainable) Data-Centric AI: what are you explaininhg, and to whom?
(Explainable) Data-Centric AI: what are you explaininhg, and to whom?(Explainable) Data-Centric AI: what are you explaininhg, and to whom?
(Explainable) Data-Centric AI: what are you explaininhg, and to whom?
 
Human Expert Website Manual WCAG 2.0 2.1 2.2 Audit - Digital Accessibility Au...
Human Expert Website Manual WCAG 2.0 2.1 2.2 Audit - Digital Accessibility Au...Human Expert Website Manual WCAG 2.0 2.1 2.2 Audit - Digital Accessibility Au...
Human Expert Website Manual WCAG 2.0 2.1 2.2 Audit - Digital Accessibility Au...
 
WebAssembly is Key to Better LLM Performance
WebAssembly is Key to Better LLM PerformanceWebAssembly is Key to Better LLM Performance
WebAssembly is Key to Better LLM Performance
 
Portal Kombat : extension du réseau de propagande russe
Portal Kombat : extension du réseau de propagande russePortal Kombat : extension du réseau de propagande russe
Portal Kombat : extension du réseau de propagande russe
 
Event-Driven Architecture Masterclass: Engineering a Robust, High-performance...
Event-Driven Architecture Masterclass: Engineering a Robust, High-performance...Event-Driven Architecture Masterclass: Engineering a Robust, High-performance...
Event-Driven Architecture Masterclass: Engineering a Robust, High-performance...
 
Design Guidelines for Passkeys 2024.pptx
Design Guidelines for Passkeys 2024.pptxDesign Guidelines for Passkeys 2024.pptx
Design Guidelines for Passkeys 2024.pptx
 
Long journey of Ruby Standard library at RubyKaigi 2024
Long journey of Ruby Standard library at RubyKaigi 2024Long journey of Ruby Standard library at RubyKaigi 2024
Long journey of Ruby Standard library at RubyKaigi 2024
 
ASRock Industrial FDO Solutions in Action for Industrial Edge AI _ Kenny at A...
ASRock Industrial FDO Solutions in Action for Industrial Edge AI _ Kenny at A...ASRock Industrial FDO Solutions in Action for Industrial Edge AI _ Kenny at A...
ASRock Industrial FDO Solutions in Action for Industrial Edge AI _ Kenny at A...
 
Where to Learn More About FDO _ Richard at FIDO Alliance.pdf
Where to Learn More About FDO _ Richard at FIDO Alliance.pdfWhere to Learn More About FDO _ Richard at FIDO Alliance.pdf
Where to Learn More About FDO _ Richard at FIDO Alliance.pdf
 
1111 ChatGPT Prompts PDF Free Download - Prompts for ChatGPT
1111 ChatGPT Prompts PDF Free Download - Prompts for ChatGPT1111 ChatGPT Prompts PDF Free Download - Prompts for ChatGPT
1111 ChatGPT Prompts PDF Free Download - Prompts for ChatGPT
 
Continuing Bonds Through AI: A Hermeneutic Reflection on Thanabots
Continuing Bonds Through AI: A Hermeneutic Reflection on ThanabotsContinuing Bonds Through AI: A Hermeneutic Reflection on Thanabots
Continuing Bonds Through AI: A Hermeneutic Reflection on Thanabots
 
Overview of Hyperledger Foundation
Overview of Hyperledger FoundationOverview of Hyperledger Foundation
Overview of Hyperledger Foundation
 

Responsive design and the content challenge

  • 1. Responsive design and the content challenge noz.urbina@mekon.com @nozurbina lessworkmoreflow.blogspot.com
  • 2. Agenda • Me • Terms – Adaptive/Responsive Design? • Many challenges – Content and UX • Adaptive Content • Collaboration to meet the challenge
  • 3. Viva España! Congility Events Chair Content strategist Consultant/trainer Author Noz Urbina (me)
  • 4. Becoming a Content Strategist Customer support for authoring tools Presales support Content solutions services and training Consultant for content strategies “Did you know you‟re called a „content strategist’ now?”
  • 5. DEFINING OUR TERMS Responsive Design Adaptive Design Content and UX Adaptive Content
  • 6. Responsive Design All content is delivered. Appearance, layouts and features are adjusted for device client-side
  • 7. Adaptive Design Device and other context is detected, then server-side logic sends only appropriate layouts & features LinkedIn
  • 9. THAT’S THE LEAST OF OUR WORRIES If only there were only desktop and mobile...
  • 12. Google Glass Vuzix M100 Recon JetEpson Moverio (on sale) Telepathy One
  • 13. BUT WHAT ABOUT THE CONTENT? The stuff that the people are actually looking for?
  • 14. Content is the lens through which users perceive the brand http://commons.wikimedia.org/wiki/File: Oakley_sunglasses.jpg
  • 15. Lens and Frames Must Work Together Personal Preference Functional Imperative All images http://commons.wikimedia.org
  • 16. Content and User Experience • Great design can‟t save inappropriate content • The more diverse the interaction contexts, the more stretched content will become • Square peg, round hole, bad experience
  • 17. Adaptive Content • Content designed to adapt to multi-channel multi-format and progressive enhancement / disclosure situations • Can be: – Transformed – Filtered • Because it‟s got: – No presentation information! – Structure – Rich metadata – Built-in, in-line semantics
  • 18. Adaptive Content • Adaptive Content Enables Contextually- Appropriate Experiences
  • 19. Why Now? • Multi-channel scenarios and responsive and adaptive design are raising the profile of Content Strategy and Adaptive Content • It forces people to confront real optimisation of the content‟s role in UX
  • 20. Q&A ...and surprise book give-away! noz.urbina@mekon.com @nozurbina http://lessworkmoreflow.blogspot.com Please reach under your chairs and look for a winning sticker!

Notas del editor

  1. People run So many
  2. http://commons.wikimedia.org/wiki/File:Oakley_sunglasses.jpg