SlideShare a Scribd company logo
1 of 46
Download to read offline
Designing physical and digital experience
             in social web




                                      Janet Huang
                                       2013.01.13
About me




                             Janet Huang
                           janetyc@gmail.com
                    http://twitter.com/janetyc
           http://www.facebook.com/janetyctp
http://www.openlabtaipei.org
?
                          ?
    ?                                                                     ?
                                                  ?                                   ?
                          ?       ?                               ?
                                      ?                                       ?
              ?                                           ?
        Designing physical and digital experience in social web
          ?                                   ?                           ?
                              ?                               ?
                                                      ?                           ?
                      ?
?                                         ?                           ?
                                                                                      ?
                  ?                                               ?
Social Web
  is about

People
So... we need to understand people!
We need to understand how people behave
Behavior Design
BJ Fogg




          Behavior Design
          Persuasive Technology Lab @ Stanford University
A Framework
3   things
B = Motivation
    Ability
    Trigger
Behavior Model
1   ability
Simplicity
Ability Factors
- Time
- Money
- Physical effort
- Brain cycles
- Social deviance
- Non-routine
Key question
      Are we asking for too much?
Too much money?
Too much text?
Too much information?
2   motivation
Core Motivator                         Emotion




Sensation         pleasure/pain
感覺

Anticipation      hope/fear
預期

Social Cohesion   social rejection/acceptance
社會凝聚力
3   trigger
Facilitator

Trigger   Spark

          Signal
Web design
- Off-site trigger   Email
- On-site trigger
Web design
- Off-site trigger
- On-site trigger    Call to action
ability
          motivation




ability
          motivation




          motivation
ability
Behavior Model                 The Order of Design
1. Ability                      1. Trigger
2. Motivation                   2. Ability
3. Trigger                      3. Motivation




           http://www.slideshare.net/hreha/applying-psychology-to-web-design
Understanding behavior model help you design
            better UI for people.
For web design, maybe we need
           Another solution
Crowd-based design
Crowdsourcing + Web design
Why?
How?
Divide and Conquer



                                      Macro task




                                                       Micro task
      iterative task


   Crowds can solve micro tasks with little effort in a short time
Integrate micro tasks


                          Micro task




                        Macro task
To be continued... :)
    Thanks

More Related Content

Viewers also liked

Does firefox matter?
Does firefox matter?Does firefox matter?
Does firefox matter?
Irvin Chen
 
TypeScript 開發實戰:開發即時互動的 html5 websocket 聊天室應用程式
TypeScript 開發實戰:開發即時互動的 html5 websocket 聊天室應用程式TypeScript 開發實戰:開發即時互動的 html5 websocket 聊天室應用程式
TypeScript 開發實戰:開發即時互動的 html5 websocket 聊天室應用程式
Will Huang
 
How the Digital and Physical worlds are merging.
How the Digital and Physical worlds are merging. How the Digital and Physical worlds are merging.
How the Digital and Physical worlds are merging.
Table19
 
A brief introduction to SPDY - 邁向 HTTP/2.0
A brief introduction to SPDY - 邁向 HTTP/2.0A brief introduction to SPDY - 邁向 HTTP/2.0
A brief introduction to SPDY - 邁向 HTTP/2.0
Wen-Tien Chang
 
使用Javascript及HTML5打造協同運作系統
使用Javascript及HTML5打造協同運作系統使用Javascript及HTML5打造協同運作系統
使用Javascript及HTML5打造協同運作系統
Hsu Ping Feng
 

Viewers also liked (18)

Does firefox matter?
Does firefox matter?Does firefox matter?
Does firefox matter?
 
2013 01 13 webconf milkmidi Flash
2013 01 13 webconf milkmidi Flash2013 01 13 webconf milkmidi Flash
2013 01 13 webconf milkmidi Flash
 
中文網路字型的現況與挑戰(Webconf 20130113)
中文網路字型的現況與挑戰(Webconf 20130113)中文網路字型的現況與挑戰(Webconf 20130113)
中文網路字型的現況與挑戰(Webconf 20130113)
 
BDD in .NET
BDD in .NETBDD in .NET
BDD in .NET
 
Gamification vs UX
Gamification vs UXGamification vs UX
Gamification vs UX
 
130113 why.&.how.smb.running.ux-light
130113 why.&.how.smb.running.ux-light130113 why.&.how.smb.running.ux-light
130113 why.&.how.smb.running.ux-light
 
Surfacing digital in physical - Dan Hill
Surfacing digital in physical - Dan HillSurfacing digital in physical - Dan Hill
Surfacing digital in physical - Dan Hill
 
WebConf 2013「Best Practices - The Upload」
WebConf 2013「Best Practices - The Upload」WebConf 2013「Best Practices - The Upload」
WebConf 2013「Best Practices - The Upload」
 
20130112用原型驅動設計@webconf
20130112用原型驅動設計@webconf20130112用原型驅動設計@webconf
20130112用原型驅動設計@webconf
 
那些mockup沒告訴你的事@WebConf.tw 2013
那些mockup沒告訴你的事@WebConf.tw 2013那些mockup沒告訴你的事@WebConf.tw 2013
那些mockup沒告訴你的事@WebConf.tw 2013
 
超理性使用者介面設計 - Data-driven A/B Testing
超理性使用者介面設計 - Data-driven A/B Testing超理性使用者介面設計 - Data-driven A/B Testing
超理性使用者介面設計 - Data-driven A/B Testing
 
TypeScript 開發實戰:開發即時互動的 html5 websocket 聊天室應用程式
TypeScript 開發實戰:開發即時互動的 html5 websocket 聊天室應用程式TypeScript 開發實戰:開發即時互動的 html5 websocket 聊天室應用程式
TypeScript 開發實戰:開發即時互動的 html5 websocket 聊天室應用程式
 
How the Digital and Physical worlds are merging.
How the Digital and Physical worlds are merging. How the Digital and Physical worlds are merging.
How the Digital and Physical worlds are merging.
 
A brief introduction to SPDY - 邁向 HTTP/2.0
A brief introduction to SPDY - 邁向 HTTP/2.0A brief introduction to SPDY - 邁向 HTTP/2.0
A brief introduction to SPDY - 邁向 HTTP/2.0
 
Bridging the Physical-Digital Divide: For UX
Bridging the Physical-Digital Divide: For UXBridging the Physical-Digital Divide: For UX
Bridging the Physical-Digital Divide: For UX
 
使用Javascript及HTML5打造協同運作系統
使用Javascript及HTML5打造協同運作系統使用Javascript及HTML5打造協同運作系統
使用Javascript及HTML5打造協同運作系統
 
借力使力的乾坤挪移大法-以使用者為中心的設計決策奧妙
借力使力的乾坤挪移大法-以使用者為中心的設計決策奧妙 借力使力的乾坤挪移大法-以使用者為中心的設計決策奧妙
借力使力的乾坤挪移大法-以使用者為中心的設計決策奧妙
 
Webconf2013-非典型貧窮網站維運經驗分享
Webconf2013-非典型貧窮網站維運經驗分享Webconf2013-非典型貧窮網站維運經驗分享
Webconf2013-非典型貧窮網站維運經驗分享
 

Similar to Designing physical and digital experience in social web

MPI Sweden Student Club: How Can I Be Social - a Social Media Checklist for m...
MPI Sweden Student Club: How Can I Be Social - a Social Media Checklist for m...MPI Sweden Student Club: How Can I Be Social - a Social Media Checklist for m...
MPI Sweden Student Club: How Can I Be Social - a Social Media Checklist for m...
Gerrit Heijkoop
 
Theoretical framework of network-Based language teaching
Theoretical framework of network-Based language teachingTheoretical framework of network-Based language teaching
Theoretical framework of network-Based language teaching
Best UPC code
 

Similar to Designing physical and digital experience in social web (20)

Winning Websites 2013
Winning Websites 2013Winning Websites 2013
Winning Websites 2013
 
Social Media for B2B - Social3i - School of Visual Concepts Dec 7 2011
Social Media for B2B - Social3i - School of Visual Concepts Dec 7 2011Social Media for B2B - Social3i - School of Visual Concepts Dec 7 2011
Social Media for B2B - Social3i - School of Visual Concepts Dec 7 2011
 
Techsquad Wiki Presentation
Techsquad Wiki PresentationTechsquad Wiki Presentation
Techsquad Wiki Presentation
 
Web content [Thai language]
Web content [Thai language]Web content [Thai language]
Web content [Thai language]
 
iCrossing – Antony Mayfield, You and Your Web Shadow. 5th March 2010, Royal ...
iCrossing – Antony Mayfield, You and Your Web Shadow.  5th March 2010, Royal ...iCrossing – Antony Mayfield, You and Your Web Shadow.  5th March 2010, Royal ...
iCrossing – Antony Mayfield, You and Your Web Shadow. 5th March 2010, Royal ...
 
Understanding Content: The Stuff We Design For
Understanding Content: The Stuff We Design ForUnderstanding Content: The Stuff We Design For
Understanding Content: The Stuff We Design For
 
Content Strategy: The Missing Piece of the UX Puzzle
Content Strategy: The Missing Piece of the UX PuzzleContent Strategy: The Missing Piece of the UX Puzzle
Content Strategy: The Missing Piece of the UX Puzzle
 
MPI Sweden Student Club: How Can I Be Social - a Social Media Checklist for m...
MPI Sweden Student Club: How Can I Be Social - a Social Media Checklist for m...MPI Sweden Student Club: How Can I Be Social - a Social Media Checklist for m...
MPI Sweden Student Club: How Can I Be Social - a Social Media Checklist for m...
 
Google Devfest Bangkok - OpenSocial
Google Devfest Bangkok - OpenSocialGoogle Devfest Bangkok - OpenSocial
Google Devfest Bangkok - OpenSocial
 
Off The Map
Off The MapOff The Map
Off The Map
 
The Perfect Local Media Company Sebastien Provencher Lss 09 Presentation ...
The Perfect Local Media Company   Sebastien Provencher   Lss 09 Presentation ...The Perfect Local Media Company   Sebastien Provencher   Lss 09 Presentation ...
The Perfect Local Media Company Sebastien Provencher Lss 09 Presentation ...
 
Service Design at the Hogeschool Rotterdam
Service Design at the Hogeschool RotterdamService Design at the Hogeschool Rotterdam
Service Design at the Hogeschool Rotterdam
 
Delight by Motion: Investigating the Role of Animation in Microinteractions
Delight by Motion: Investigating the Role of Animation in MicrointeractionsDelight by Motion: Investigating the Role of Animation in Microinteractions
Delight by Motion: Investigating the Role of Animation in Microinteractions
 
Theoretical framework of network-Based language teaching
Theoretical framework of network-Based language teachingTheoretical framework of network-Based language teaching
Theoretical framework of network-Based language teaching
 
Innotech2008
Innotech2008Innotech2008
Innotech2008
 
Innotech2008
Innotech2008Innotech2008
Innotech2008
 
CWC Social Story Business & You Web 2.0
CWC Social Story Business & You Web 2.0CWC Social Story Business & You Web 2.0
CWC Social Story Business & You Web 2.0
 
Digital Scholarship
Digital ScholarshipDigital Scholarship
Digital Scholarship
 
UX Mind Games - Jared Schwartz, Beaconfire RedEngine
UX Mind Games - Jared Schwartz, Beaconfire RedEngineUX Mind Games - Jared Schwartz, Beaconfire RedEngine
UX Mind Games - Jared Schwartz, Beaconfire RedEngine
 
Friendsters At Work: Displaying Social Media Streams in the Workplace
Friendsters At Work: Displaying Social Media Streams in the WorkplaceFriendsters At Work: Displaying Social Media Streams in the Workplace
Friendsters At Work: Displaying Social Media Streams in the Workplace
 

More from Janet Huang (13)

Transferring Sensing to a Mixed Virtual and Physical Experience
Transferring Sensing to a Mixed Virtual and Physical ExperienceTransferring Sensing to a Mixed Virtual and Physical Experience
Transferring Sensing to a Mixed Virtual and Physical Experience
 
Collecting a Image Label from Crowds Using Amazon Mechanical Turk
Collecting a Image Label from Crowds Using Amazon Mechanical TurkCollecting a Image Label from Crowds Using Amazon Mechanical Turk
Collecting a Image Label from Crowds Using Amazon Mechanical Turk
 
Art in the Crowd
Art in the CrowdArt in the Crowd
Art in the Crowd
 
How to Program SmartThings
How to Program SmartThingsHow to Program SmartThings
How to Program SmartThings
 
Of class3
Of class3Of class3
Of class3
 
Of class2
Of class2Of class2
Of class2
 
Of class1
Of class1Of class1
Of class1
 
Iphone course 3
Iphone course 3Iphone course 3
Iphone course 3
 
Iphone course 2
Iphone course 2Iphone course 2
Iphone course 2
 
Iphone course 1
Iphone course 1Iphone course 1
Iphone course 1
 
The power of example
The power of exampleThe power of example
The power of example
 
Responsive web design
Responsive web designResponsive web design
Responsive web design
 
Openframworks x Mobile
Openframworks x MobileOpenframworks x Mobile
Openframworks x Mobile
 

Recently uploaded

Top profile Call Girls In fatehgarh [ 7014168258 ] Call Me For Genuine Models...
Top profile Call Girls In fatehgarh [ 7014168258 ] Call Me For Genuine Models...Top profile Call Girls In fatehgarh [ 7014168258 ] Call Me For Genuine Models...
Top profile Call Girls In fatehgarh [ 7014168258 ] Call Me For Genuine Models...
gajnagarg
 
Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...
Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...
Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...
Nitya salvi
 
Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...
Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...
Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...
drmarathore
 
Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...
Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...
Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...
HyderabadDolls
 
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...
gajnagarg
 
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
eqaqen
 
Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...
gajnagarg
 
Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...
Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...
Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...
nirzagarg
 
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
eeanqy
 
Simple Conference Style Presentation by Slidesgo.pptx
Simple Conference Style Presentation by Slidesgo.pptxSimple Conference Style Presentation by Slidesgo.pptx
Simple Conference Style Presentation by Slidesgo.pptx
balqisyamutia
 
怎样办理莫纳什大学毕业证(Monash毕业证书)成绩单留信认证
怎样办理莫纳什大学毕业证(Monash毕业证书)成绩单留信认证怎样办理莫纳什大学毕业证(Monash毕业证书)成绩单留信认证
怎样办理莫纳什大学毕业证(Monash毕业证书)成绩单留信认证
ehyxf
 
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
CristineGraceAcuyan
 

Recently uploaded (20)

Top profile Call Girls In fatehgarh [ 7014168258 ] Call Me For Genuine Models...
Top profile Call Girls In fatehgarh [ 7014168258 ] Call Me For Genuine Models...Top profile Call Girls In fatehgarh [ 7014168258 ] Call Me For Genuine Models...
Top profile Call Girls In fatehgarh [ 7014168258 ] Call Me For Genuine Models...
 
Call Girls Jalaun Just Call 8617370543 Top Class Call Girl Service Available
Call Girls Jalaun Just Call 8617370543 Top Class Call Girl Service AvailableCall Girls Jalaun Just Call 8617370543 Top Class Call Girl Service Available
Call Girls Jalaun Just Call 8617370543 Top Class Call Girl Service Available
 
Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...
Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...
Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...
 
Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...
Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...
Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...
 
The hottest UI and UX Design Trends 2024
The hottest UI and UX Design Trends 2024The hottest UI and UX Design Trends 2024
The hottest UI and UX Design Trends 2024
 
Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...
Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...
Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...
 
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...
 
LANDSCAPE ARCHITECTURE PORTFOLIO - MAREK MITACEK
LANDSCAPE ARCHITECTURE PORTFOLIO - MAREK MITACEKLANDSCAPE ARCHITECTURE PORTFOLIO - MAREK MITACEK
LANDSCAPE ARCHITECTURE PORTFOLIO - MAREK MITACEK
 
Abortion pills in Riyadh +966572737505 <> buy cytotec <> unwanted kit Saudi A...
Abortion pills in Riyadh +966572737505 <> buy cytotec <> unwanted kit Saudi A...Abortion pills in Riyadh +966572737505 <> buy cytotec <> unwanted kit Saudi A...
Abortion pills in Riyadh +966572737505 <> buy cytotec <> unwanted kit Saudi A...
 
Mohanlalganj ! Call Girls in Lucknow - 450+ Call Girl Cash Payment 9548273370...
Mohanlalganj ! Call Girls in Lucknow - 450+ Call Girl Cash Payment 9548273370...Mohanlalganj ! Call Girls in Lucknow - 450+ Call Girl Cash Payment 9548273370...
Mohanlalganj ! Call Girls in Lucknow - 450+ Call Girl Cash Payment 9548273370...
 
Hackathon evaluation template_latest_uploadpdf
Hackathon evaluation template_latest_uploadpdfHackathon evaluation template_latest_uploadpdf
Hackathon evaluation template_latest_uploadpdf
 
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
 
Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...
 
Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...
Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...
Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...
 
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
 
Furniture & Joinery Details_Designs.pptx
Furniture & Joinery Details_Designs.pptxFurniture & Joinery Details_Designs.pptx
Furniture & Joinery Details_Designs.pptx
 
High Profile Escorts Nerul WhatsApp +91-9930687706, Best Service
High Profile Escorts Nerul WhatsApp +91-9930687706, Best ServiceHigh Profile Escorts Nerul WhatsApp +91-9930687706, Best Service
High Profile Escorts Nerul WhatsApp +91-9930687706, Best Service
 
Simple Conference Style Presentation by Slidesgo.pptx
Simple Conference Style Presentation by Slidesgo.pptxSimple Conference Style Presentation by Slidesgo.pptx
Simple Conference Style Presentation by Slidesgo.pptx
 
怎样办理莫纳什大学毕业证(Monash毕业证书)成绩单留信认证
怎样办理莫纳什大学毕业证(Monash毕业证书)成绩单留信认证怎样办理莫纳什大学毕业证(Monash毕业证书)成绩单留信认证
怎样办理莫纳什大学毕业证(Monash毕业证书)成绩单留信认证
 
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
 

Designing physical and digital experience in social web