SlideShare une entreprise Scribd logo
1  sur  51
Télécharger pour lire hors ligne
DESIGNING
DANIEL EIZANS         FOR DISTRIBUTED
WIAD2013 | 2.9.2013   CONTENT MODELS




                             @danieleizans | #WIADA2
Let’s talk about patterns




http://www.flickr.com/photos/ryanprince1974/7417131586/
http://www.flickr.com/photos/ryanprince1974/7417131586/   @danieleizans | #WIADA2
We look for clarity in patterns


                 =


                           @danieleizans | #WIADA2
But we’re increasingly distracted




                            @danieleizans | #WIADA2
And Mobile Isn’t Going Away




                        @danieleizans | #WIADA2
And oh, that *$#@&! context thing ...




                             @danieleizans | #WIADA2
What’s a UX pro to do?
             RESPONSIVE DESIGN?!
    UNIFY CODEBASES?

     DEVICE SPECIFIC STRATEGY?
                       PROTOTYPE?

         MOBILE FIRST?!
          ESCHEW WIREFRAMES?
                        @danieleizans | #WIADA2
What (many of us) DO

                 @danieleizans | #WIADA2
We create hierarchy.
                                                                Home         Ford Social          Support          LAD             En Esp.   More Ford   Search




                              Crossovers             Hybrids           Comm                                              Shopping
                    Cars                   Trucks                                          All          Tech Hub
                               & SUVS                and EVs           Truck                                              Tools




                                C-Max      C-Max     Fusion            Fusion          Focus
                                                                                                                         Build/Price
                                Hybrid     Energi   Hybrid SE          Energi          Electric




Hybrid
         Gallery   Features     Specs      Models   Accesories         Pricing                                              Etc.
Games




                                                                                                                                   @danieleizans | #WIADA2
We catalogue and audit pages.




                                @danieleizans | #WIADA2
We devise a strategy.




                        @danieleizans | #WIADA2
We produce wireframes.




                         @danieleizans | #WIADA2
Then we think about design and content.




                                     @danieleizans | #WIADA2
And then things like this happen.




                                    @danieleizans | #WIADA2
And happen....




                 @danieleizans | #WIADA2
And happen....




                 @danieleizans | #WIADA2
And happen....




                 @danieleizans | #WIADA2
And happen....




                 @danieleizans | #WIADA2
And happen....




                 @danieleizans | #WIADA2
And happen.... (for lots and lots of pixels)




                                          @danieleizans | #WIADA2
Taking 25 seconds to load




                            @danieleizans | #WIADA2
Foundational workflows (and patterns) are failing us.




                                        @danieleizans | #WIADA2
These are problems we can solve




http://www.rexfeatures.com/search/?kw=lego+italy&iso=GBR&lkw=lego&viah=Y&stk=N&sft=&search_action=#   @danieleizans | #WIADA2
Design from the content out!
                               A Call To Arms




                                     @danieleizans | #WIADA2
We must look beyond the page.



                        @danieleizans | #WIADA2
Prepare for new devices and contexts.



                             @danieleizans | #WIADA2
Prepare for distribution.



                        @danieleizans | #WIADA2
Designing for Portability



                            @danieleizans | #WIADA2
Content is messy.
•   PURPOSE
    What’s the content supposed to accomplish?
•   MESSAGE
    What’s it saying? How is it saying it?
•   RELATIONSHIPS
    What other content is conceptually
    connected?
•   PRIORITIES
    How important is it for the business? The
    user?
                                                  @danieleizans | #WIADA2
Making sense of the mess

1. Content types (inventory)
2. Content wireframes
3. Content structure (data model)
4. CMS Plan
5. UX/Design
6. Prototype


                                    @danieleizans | #WIADA2
Content Inventory
1. Content Type / Persona
2. Production Source / Author / Owner
3. Original Intent (aka why was it made)
4. Content Quality / Score
5. Length / Word Count /
File Size
6. Rights


                                           @danieleizans | #WIADA2
Goal: Understand the whys

Content purpose

Content quality

Content reach

                           @danieleizans | #WIADA2
Content Wireframe
1. Logo
2. Navigation
3. Headline
4. Author
5. Date
6. Related Assets
7. Related Badge
8. Comments
9. Related Articles
10. Social Links
                                   @danieleizans | #WIADA2
Content Wireframe
                      1
1. Logo
                      2
2. Navigation
                      4                           3
3. Headline
4. Author             5        6                      7

5. Date
6. Related Assets
7. Related Badge                   10                 8

8. Comments                                           9
9. Related Articles
10. Social Links
                                    @danieleizans | #WIADA2
Goal: Understand Hierarchy and
                            Relationships                                                              Links to
                                                                                                       Related

                                                            Links to            Feature             Links to
                                Business                                                                                  Author Bio
                                                            Related              Article            Related


                                              Tagged
                                                by
                                                                                Tagged
                                                                                  by




                              Landmark             Tagged
                                                     by
                                                                                  City                         Links to
                                                                                                               Related



                                                                       Tagged              Tagged                          Blog Post
                                                                         by                  by

                                                                                                                            Links to
                                                                                                                            Related
                                    Related
                                      to
                                                               Deal                                   Event
From Sara Wachter-Boettcher
“Building Bendable Content”                                                                                                  @danieleizans | #WIADA2
Focus on Structure


       By focusing on parts instead of
       pages, data is portable and able
       to shift when needed or seen as
       a competitive advantage.



                           @danieleizans | #WIADA2
Goal: Create relationships in data




                 Chunking data appropriately
                 allows it to be nimble and
                 repurposed quickly.
                                 @danieleizans | #WIADA2
CMS and Data Modeling

              What you see may be
              what you get, but what
              you get isnʼt good for
              content portability.




                        @danieleizans | #WIADA2
CMS and Data Modeling
          Fields are your friends.
          They create relationships
          in the data and allow for
          scalability and meaning.




                            @danieleizans | #WIADA2
So this will be
  like wearing
handcuffs right?

                   @danieleizans | #WIADA2
Models are like
 rails for each
new experience

                  @danieleizans | #WIADA2
We can’t manage
how every bit of
 content looks

                   @danieleizans | #WIADA2
Content Item                                                                          Content Item


   But we can                 Attributes:
                               ⁃ Title
                               ⁃ Date
                               ⁃ Author
                               ⁃ Abstract
                                                                         Relation
                                                                          -ship
                                                                                                                    Attributes:
                                                                                                                     ⁃ Title
                                                                                                                     ⁃ Date
                                                                                                                     ⁃ Location
                                                                                                                     ⁃ Teaser



  define rules
                               ⁃ Detailed                                                                            ⁃ Detailed
                                  Content                                                                               Content
                                                                            Content Item
                                                   Relation                 Attributes:
                                                    -ship                    ⁃ Title



       and
                                                                             ⁃ Date                      Relation
                                                                             ⁃ Author                     -ship
                                                                             ⁃ Abstract
                                                                             ⁃ Detailed
                              Content Item                                      Content



   encourage
                              Attributes:
                               ⁃ Title                                                                       Relation
                                                Relation                                                      -ship
                               ⁃ Address
                                                 -ship
                               ⁃ Short
                                  Description



  relationships                                               Relation
                                                                                           Content Item
                                                                                           Attributes:
                                                                                            ⁃ Title
                                                                                            ⁃ Date
                                                               -ship                        ⁃ Author
                                                                                            ⁃ Abstract
                                                                                            ⁃ Detailed
                                                                                               Content



From Sara Wachter-Boettcher
“Building Bendable Content”                                                                @danieleizans | #WIADA2
Clean, purposeful content flows




                         @danieleizans | #WIADA2
And when content flows via
systems, we can scale


COPE
Create Once Publish Everywhere
And we can design responsively




                         @danieleizans | #WIADA2
And we can deploy




                    @danieleizans | #WIADA2
Assured that our system is good
    for humans and robots




                          @danieleizans | #WIADA2
“Content and form are lovers, their
love-child is design”
                            - Stephen Hay

                                 @danieleizans | #WIADA2
Hug it out. Get to work.




                       @danieleizans | #WIADA2
Thanks.

 > Me (danieleizans.com)

 > Work (Team Detroit)

 > Passion (Contents Magazine)

 > Microthoughts (@danieleizans)




                                   @danieleizans | #WIADA2

Contenu connexe

Similaire à Designing For Distributed Content Models

iPad + Apps for Designers
iPad + Apps for DesignersiPad + Apps for Designers
iPad + Apps for DesignersMARKITECT.me
 
SketchUp for Design, Marketing and More
SketchUp for Design, Marketing and MoreSketchUp for Design, Marketing and More
SketchUp for Design, Marketing and MoreMARKITECT.me
 
Home Design in SketchUp Pro
Home Design in SketchUp ProHome Design in SketchUp Pro
Home Design in SketchUp ProMARKITECT.me
 
Yadget presentation 2
Yadget presentation 2Yadget presentation 2
Yadget presentation 2Mohamed Kash
 
CSPA 2012: Moving Online - Part 1
CSPA 2012: Moving Online - Part 1CSPA 2012: Moving Online - Part 1
CSPA 2012: Moving Online - Part 1Media Now STL
 
Responsive Web Design - Introduction & Workflow Overview
Responsive Web Design - Introduction & Workflow OverviewResponsive Web Design - Introduction & Workflow Overview
Responsive Web Design - Introduction & Workflow OverviewAidan Foster
 
04 user centered design
04 user centered design04 user centered design
04 user centered designRoberto Dadda
 
Measuring Customer Engagement on Facebook - Yves Baudechon, Page Karma
Measuring Customer Engagement on Facebook - Yves Baudechon, Page KarmaMeasuring Customer Engagement on Facebook - Yves Baudechon, Page Karma
Measuring Customer Engagement on Facebook - Yves Baudechon, Page KarmaOur Social Times
 
Local Digital Marketing - More Than A Pin - AMA Cincinnati - October 2017
Local Digital Marketing - More Than A Pin - AMA Cincinnati - October 2017Local Digital Marketing - More Than A Pin - AMA Cincinnati - October 2017
Local Digital Marketing - More Than A Pin - AMA Cincinnati - October 2017Mike Corak
 
How to Win SEO in Complex Web Migrations Scenarios #YoastCon
How to Win SEO in Complex Web Migrations Scenarios #YoastConHow to Win SEO in Complex Web Migrations Scenarios #YoastCon
How to Win SEO in Complex Web Migrations Scenarios #YoastConAleyda Solís
 
When Your Inventory Changes: SEO Tips For Changing Product Pages
When Your Inventory Changes: SEO Tips For Changing Product Pages       When Your Inventory Changes: SEO Tips For Changing Product Pages
When Your Inventory Changes: SEO Tips For Changing Product Pages Aleyda Solís
 
Setting Interface Foundations with IA
Setting Interface Foundations with IASetting Interface Foundations with IA
Setting Interface Foundations with IACarrie Hane
 
Josh Trent
Josh TrentJosh Trent
Josh TrentJosh
 
More CrowdSourcing with 
Pinterest + Twitter plus SlideShare PRO
More CrowdSourcing with 
Pinterest + Twitter plus SlideShare PRO More CrowdSourcing with 
Pinterest + Twitter plus SlideShare PRO
More CrowdSourcing with 
Pinterest + Twitter plus SlideShare PRO MARKITECT.me
 
Presentation to MS-HCI Program at Georgia Tech
Presentation to MS-HCI Program at Georgia TechPresentation to MS-HCI Program at Georgia Tech
Presentation to MS-HCI Program at Georgia TechMark Badger
 
Pundit @ amsterdam textual scholarship
Pundit @ amsterdam textual scholarshipPundit @ amsterdam textual scholarship
Pundit @ amsterdam textual scholarshipNet7
 
Sensus Uses Liferay to Strengthen Their Global Web Presence
Sensus Uses Liferay to Strengthen Their Global Web PresenceSensus Uses Liferay to Strengthen Their Global Web Presence
Sensus Uses Liferay to Strengthen Their Global Web Presencerivetlogic
 

Similaire à Designing For Distributed Content Models (20)

iPad + Apps for Designers
iPad + Apps for DesignersiPad + Apps for Designers
iPad + Apps for Designers
 
SketchUp for Design, Marketing and More
SketchUp for Design, Marketing and MoreSketchUp for Design, Marketing and More
SketchUp for Design, Marketing and More
 
Home Design in SketchUp Pro
Home Design in SketchUp ProHome Design in SketchUp Pro
Home Design in SketchUp Pro
 
Yadget presentation 2
Yadget presentation 2Yadget presentation 2
Yadget presentation 2
 
CSPA 2012: Moving Online - Part 1
CSPA 2012: Moving Online - Part 1CSPA 2012: Moving Online - Part 1
CSPA 2012: Moving Online - Part 1
 
Responsive Web Design - Introduction & Workflow Overview
Responsive Web Design - Introduction & Workflow OverviewResponsive Web Design - Introduction & Workflow Overview
Responsive Web Design - Introduction & Workflow Overview
 
04 user centered design
04 user centered design04 user centered design
04 user centered design
 
Measuring Customer Engagement on Facebook - Yves Baudechon, Page Karma
Measuring Customer Engagement on Facebook - Yves Baudechon, Page KarmaMeasuring Customer Engagement on Facebook - Yves Baudechon, Page Karma
Measuring Customer Engagement on Facebook - Yves Baudechon, Page Karma
 
Local Digital Marketing - More Than A Pin - AMA Cincinnati - October 2017
Local Digital Marketing - More Than A Pin - AMA Cincinnati - October 2017Local Digital Marketing - More Than A Pin - AMA Cincinnati - October 2017
Local Digital Marketing - More Than A Pin - AMA Cincinnati - October 2017
 
How to Win SEO in Complex Web Migrations Scenarios #YoastCon
How to Win SEO in Complex Web Migrations Scenarios #YoastConHow to Win SEO in Complex Web Migrations Scenarios #YoastCon
How to Win SEO in Complex Web Migrations Scenarios #YoastCon
 
When Your Inventory Changes: SEO Tips For Changing Product Pages
When Your Inventory Changes: SEO Tips For Changing Product Pages       When Your Inventory Changes: SEO Tips For Changing Product Pages
When Your Inventory Changes: SEO Tips For Changing Product Pages
 
Setting Interface Foundations with IA
Setting Interface Foundations with IASetting Interface Foundations with IA
Setting Interface Foundations with IA
 
Social Commerce
Social CommerceSocial Commerce
Social Commerce
 
Josh Trent
Josh TrentJosh Trent
Josh Trent
 
More CrowdSourcing with 
Pinterest + Twitter plus SlideShare PRO
More CrowdSourcing with 
Pinterest + Twitter plus SlideShare PRO More CrowdSourcing with 
Pinterest + Twitter plus SlideShare PRO
More CrowdSourcing with 
Pinterest + Twitter plus SlideShare PRO
 
Presentation to MS-HCI Program at Georgia Tech
Presentation to MS-HCI Program at Georgia TechPresentation to MS-HCI Program at Georgia Tech
Presentation to MS-HCI Program at Georgia Tech
 
Pundit @ amsterdam textual scholarship
Pundit @ amsterdam textual scholarshipPundit @ amsterdam textual scholarship
Pundit @ amsterdam textual scholarship
 
Content Everywhere - WebVisions PDX
Content Everywhere - WebVisions PDXContent Everywhere - WebVisions PDX
Content Everywhere - WebVisions PDX
 
Sensus Uses Liferay to Strengthen Their Global Web Presence
Sensus Uses Liferay to Strengthen Their Global Web PresenceSensus Uses Liferay to Strengthen Their Global Web Presence
Sensus Uses Liferay to Strengthen Their Global Web Presence
 
Yadget
YadgetYadget
Yadget
 

Plus de Daniel Eizans

Mental Modeling For Content Work: Contextual Inquiry, Personas and Planning
Mental Modeling For Content Work: Contextual Inquiry, Personas and PlanningMental Modeling For Content Work: Contextual Inquiry, Personas and Planning
Mental Modeling For Content Work: Contextual Inquiry, Personas and PlanningDaniel Eizans
 
Understanding the Business Value of Content Strategy (TUG Open House)
Understanding the Business Value of Content Strategy (TUG Open House)Understanding the Business Value of Content Strategy (TUG Open House)
Understanding the Business Value of Content Strategy (TUG Open House)Daniel Eizans
 
Making Places with Information Architecture & Content Strategy
Making Places with Information Architecture & Content StrategyMaking Places with Information Architecture & Content Strategy
Making Places with Information Architecture & Content StrategyDaniel Eizans
 
Patching Our Crumbling Foundations Through Information Architecture
Patching Our Crumbling Foundations Through Information ArchitecturePatching Our Crumbling Foundations Through Information Architecture
Patching Our Crumbling Foundations Through Information ArchitectureDaniel Eizans
 
Mental Modelling For Content Work (Confab London 2013)
Mental Modelling For Content Work (Confab London 2013)Mental Modelling For Content Work (Confab London 2013)
Mental Modelling For Content Work (Confab London 2013)Daniel Eizans
 
Conquering The Context Conundrum
Conquering The Context ConundrumConquering The Context Conundrum
Conquering The Context ConundrumDaniel Eizans
 
Context Modeling For Web Development
Context Modeling For Web DevelopmentContext Modeling For Web Development
Context Modeling For Web DevelopmentDaniel Eizans
 
Contextually Relevant Content Strategy
Contextually Relevant Content StrategyContextually Relevant Content Strategy
Contextually Relevant Content StrategyDaniel Eizans
 
Bringing Game Models To The Workplace
Bringing Game Models To The WorkplaceBringing Game Models To The Workplace
Bringing Game Models To The WorkplaceDaniel Eizans
 
Context As A Content Strategy: Creating More Meaningful Web Experiences Throu...
Context As A Content Strategy: Creating More Meaningful Web Experiences Throu...Context As A Content Strategy: Creating More Meaningful Web Experiences Throu...
Context As A Content Strategy: Creating More Meaningful Web Experiences Throu...Daniel Eizans
 

Plus de Daniel Eizans (10)

Mental Modeling For Content Work: Contextual Inquiry, Personas and Planning
Mental Modeling For Content Work: Contextual Inquiry, Personas and PlanningMental Modeling For Content Work: Contextual Inquiry, Personas and Planning
Mental Modeling For Content Work: Contextual Inquiry, Personas and Planning
 
Understanding the Business Value of Content Strategy (TUG Open House)
Understanding the Business Value of Content Strategy (TUG Open House)Understanding the Business Value of Content Strategy (TUG Open House)
Understanding the Business Value of Content Strategy (TUG Open House)
 
Making Places with Information Architecture & Content Strategy
Making Places with Information Architecture & Content StrategyMaking Places with Information Architecture & Content Strategy
Making Places with Information Architecture & Content Strategy
 
Patching Our Crumbling Foundations Through Information Architecture
Patching Our Crumbling Foundations Through Information ArchitecturePatching Our Crumbling Foundations Through Information Architecture
Patching Our Crumbling Foundations Through Information Architecture
 
Mental Modelling For Content Work (Confab London 2013)
Mental Modelling For Content Work (Confab London 2013)Mental Modelling For Content Work (Confab London 2013)
Mental Modelling For Content Work (Confab London 2013)
 
Conquering The Context Conundrum
Conquering The Context ConundrumConquering The Context Conundrum
Conquering The Context Conundrum
 
Context Modeling For Web Development
Context Modeling For Web DevelopmentContext Modeling For Web Development
Context Modeling For Web Development
 
Contextually Relevant Content Strategy
Contextually Relevant Content StrategyContextually Relevant Content Strategy
Contextually Relevant Content Strategy
 
Bringing Game Models To The Workplace
Bringing Game Models To The WorkplaceBringing Game Models To The Workplace
Bringing Game Models To The Workplace
 
Context As A Content Strategy: Creating More Meaningful Web Experiences Throu...
Context As A Content Strategy: Creating More Meaningful Web Experiences Throu...Context As A Content Strategy: Creating More Meaningful Web Experiences Throu...
Context As A Content Strategy: Creating More Meaningful Web Experiences Throu...
 

Dernier

The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024Alan Dix
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfHctorFranciscoSnchez1
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazineRivanEleraki
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxHasan S
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtTeeFusion
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLkenzukiri
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Amil baba
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024mikailaoh
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsBlock Party
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillCre8iveskill
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxb2kshani34
 
Create Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comCreate Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comjakyjhon00
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxSamKuruvilla5
 
Construction Documents Checklist before Construction
Construction Documents Checklist before ConstructionConstruction Documents Checklist before Construction
Construction Documents Checklist before ConstructionResDraft
 
How to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTHow to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTThink 360 Studio
 
Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...khushisharma298853
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Ted Drake
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfsaidbilgen
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Ed Orozco
 

Dernier (19)

The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdf
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazine
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy Shirt
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teams
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkill
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptx
 
Create Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comCreate Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.com
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptx
 
Construction Documents Checklist before Construction
Construction Documents Checklist before ConstructionConstruction Documents Checklist before Construction
Construction Documents Checklist before Construction
 
How to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTHow to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPT
 
Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
 

Designing For Distributed Content Models

  • 1. DESIGNING DANIEL EIZANS FOR DISTRIBUTED WIAD2013 | 2.9.2013 CONTENT MODELS @danieleizans | #WIADA2
  • 2. Let’s talk about patterns http://www.flickr.com/photos/ryanprince1974/7417131586/ http://www.flickr.com/photos/ryanprince1974/7417131586/ @danieleizans | #WIADA2
  • 3. We look for clarity in patterns = @danieleizans | #WIADA2
  • 4. But we’re increasingly distracted @danieleizans | #WIADA2
  • 5. And Mobile Isn’t Going Away @danieleizans | #WIADA2
  • 6. And oh, that *$#@&! context thing ... @danieleizans | #WIADA2
  • 7. What’s a UX pro to do? RESPONSIVE DESIGN?! UNIFY CODEBASES? DEVICE SPECIFIC STRATEGY? PROTOTYPE? MOBILE FIRST?! ESCHEW WIREFRAMES? @danieleizans | #WIADA2
  • 8. What (many of us) DO @danieleizans | #WIADA2
  • 9. We create hierarchy. Home Ford Social Support LAD En Esp. More Ford Search Crossovers Hybrids Comm Shopping Cars Trucks All Tech Hub & SUVS and EVs Truck Tools C-Max C-Max Fusion Fusion Focus Build/Price Hybrid Energi Hybrid SE Energi Electric Hybrid Gallery Features Specs Models Accesories Pricing Etc. Games @danieleizans | #WIADA2
  • 10. We catalogue and audit pages. @danieleizans | #WIADA2
  • 11. We devise a strategy. @danieleizans | #WIADA2
  • 12. We produce wireframes. @danieleizans | #WIADA2
  • 13. Then we think about design and content. @danieleizans | #WIADA2
  • 14. And then things like this happen. @danieleizans | #WIADA2
  • 15. And happen.... @danieleizans | #WIADA2
  • 16. And happen.... @danieleizans | #WIADA2
  • 17. And happen.... @danieleizans | #WIADA2
  • 18. And happen.... @danieleizans | #WIADA2
  • 19. And happen.... @danieleizans | #WIADA2
  • 20. And happen.... (for lots and lots of pixels) @danieleizans | #WIADA2
  • 21. Taking 25 seconds to load @danieleizans | #WIADA2
  • 22. Foundational workflows (and patterns) are failing us. @danieleizans | #WIADA2
  • 23. These are problems we can solve http://www.rexfeatures.com/search/?kw=lego+italy&iso=GBR&lkw=lego&viah=Y&stk=N&sft=&search_action=# @danieleizans | #WIADA2
  • 24. Design from the content out! A Call To Arms @danieleizans | #WIADA2
  • 25. We must look beyond the page. @danieleizans | #WIADA2
  • 26. Prepare for new devices and contexts. @danieleizans | #WIADA2
  • 27. Prepare for distribution. @danieleizans | #WIADA2
  • 28. Designing for Portability @danieleizans | #WIADA2
  • 29. Content is messy. • PURPOSE What’s the content supposed to accomplish? • MESSAGE What’s it saying? How is it saying it? • RELATIONSHIPS What other content is conceptually connected? • PRIORITIES How important is it for the business? The user? @danieleizans | #WIADA2
  • 30. Making sense of the mess 1. Content types (inventory) 2. Content wireframes 3. Content structure (data model) 4. CMS Plan 5. UX/Design 6. Prototype @danieleizans | #WIADA2
  • 31. Content Inventory 1. Content Type / Persona 2. Production Source / Author / Owner 3. Original Intent (aka why was it made) 4. Content Quality / Score 5. Length / Word Count / File Size 6. Rights @danieleizans | #WIADA2
  • 32. Goal: Understand the whys Content purpose Content quality Content reach @danieleizans | #WIADA2
  • 33. Content Wireframe 1. Logo 2. Navigation 3. Headline 4. Author 5. Date 6. Related Assets 7. Related Badge 8. Comments 9. Related Articles 10. Social Links @danieleizans | #WIADA2
  • 34. Content Wireframe 1 1. Logo 2 2. Navigation 4 3 3. Headline 4. Author 5 6 7 5. Date 6. Related Assets 7. Related Badge 10 8 8. Comments 9 9. Related Articles 10. Social Links @danieleizans | #WIADA2
  • 35. Goal: Understand Hierarchy and Relationships Links to Related Links to Feature Links to Business Author Bio Related Article Related Tagged by Tagged by Landmark Tagged by City Links to Related Tagged Tagged Blog Post by by Links to Related Related to Deal Event From Sara Wachter-Boettcher “Building Bendable Content” @danieleizans | #WIADA2
  • 36. Focus on Structure By focusing on parts instead of pages, data is portable and able to shift when needed or seen as a competitive advantage. @danieleizans | #WIADA2
  • 37. Goal: Create relationships in data Chunking data appropriately allows it to be nimble and repurposed quickly. @danieleizans | #WIADA2
  • 38. CMS and Data Modeling What you see may be what you get, but what you get isnʼt good for content portability. @danieleizans | #WIADA2
  • 39. CMS and Data Modeling Fields are your friends. They create relationships in the data and allow for scalability and meaning. @danieleizans | #WIADA2
  • 40. So this will be like wearing handcuffs right? @danieleizans | #WIADA2
  • 41. Models are like rails for each new experience @danieleizans | #WIADA2
  • 42. We can’t manage how every bit of content looks @danieleizans | #WIADA2
  • 43. Content Item Content Item But we can Attributes: ⁃ Title ⁃ Date ⁃ Author ⁃ Abstract Relation -ship Attributes: ⁃ Title ⁃ Date ⁃ Location ⁃ Teaser define rules ⁃ Detailed ⁃ Detailed Content Content Content Item Relation Attributes: -ship ⁃ Title and ⁃ Date Relation ⁃ Author -ship ⁃ Abstract ⁃ Detailed Content Item Content encourage Attributes: ⁃ Title Relation Relation -ship ⁃ Address -ship ⁃ Short Description relationships Relation Content Item Attributes: ⁃ Title ⁃ Date -ship ⁃ Author ⁃ Abstract ⁃ Detailed Content From Sara Wachter-Boettcher “Building Bendable Content” @danieleizans | #WIADA2
  • 44. Clean, purposeful content flows @danieleizans | #WIADA2
  • 45. And when content flows via systems, we can scale COPE Create Once Publish Everywhere
  • 46. And we can design responsively @danieleizans | #WIADA2
  • 47. And we can deploy @danieleizans | #WIADA2
  • 48. Assured that our system is good for humans and robots @danieleizans | #WIADA2
  • 49. “Content and form are lovers, their love-child is design” - Stephen Hay @danieleizans | #WIADA2
  • 50. Hug it out. Get to work. @danieleizans | #WIADA2
  • 51. Thanks. > Me (danieleizans.com) > Work (Team Detroit) > Passion (Contents Magazine) > Microthoughts (@danieleizans) @danieleizans | #WIADA2