Uploaded on

 

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
167
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
1
Comments
0
Likes
1

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide
  • Primary Application bar drives which application the user works inAll application use the same conceptual frameworkRecent activity/ Favorites starting pageWorking pageActions toolarSettings panels
  • Primary Application bar drives which application the user works inAll application use the same conceptual frameworkRecent activity/ Favorites starting pageWorking pageActions toolarSettings panels
  • In-line visual editingNodes, assets, and actions on the left accordion
  • Assets created within a show context or independentlyUseful for event micro-site creation and hosted formsToolbarsPalettesDetachable docking palettesIn-line editingWYSIWYG elements
  • Assets created within a show context or independentlyUseful for event micro-site creation and hosted formsToolbarsPalettesDetachable docking palettesIn-line editingWYSIWYG elements
  • Assets created within a show context or independentlyUseful for event micro-site creation and hosted formsForms can use elements from pre-defined or configured collectionsCustom create fields for each client
  • Assets created within a show context or independentlyUseful for event micro-site creation and hosted formsForms can use elements from pre-defined or configured collectionsCustom create fields for each client
  • Goal oriented instructionsSplit pane workflow useful for person/user managementIn-line search and filtering over drill-down browsing
  • Story with photoStory with media playerStory with media play + playlistBlogShort forms:QuoteStatsPhoto w/ textphoto
  • Aggregated contentUser defined listList byTag authoractivityPhoto calendarPhoto gallery
  • Npr widgetsTwitter widgetsFb widgetsSunlight foundation

Transcript

  • 1. Web 3.0 UX PatternsEmerging Application and Content Patterns NYC Ext JS Meetup 9/27/2010
  • 2. Pat Sheridan • NoVa:JSMeetup • Product Strategy, Three Pillar • www.patsheridan.com • www.threepillarglobal.com • @sheridap©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 3. ©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 4. ©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 5. Application Suite User Experience • Activity based references over hierarchical lookups • Federated searches • Workflow Elements • Visual Asset creation • Form Asset creation • Multi-faceted data/ User Management • Nested Task Workflows – Task within a task©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 6. ©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 7. Application Suite©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 8. Federated Search©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 9. ©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 10. Workflow Applications©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 11. ©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 12. Asset Creation/ Management©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 13. Visual Asset Creation©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 14. ©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 15. Form Asset Creation©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 16. ©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 17. Multi-faceted Data©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 18. Mobile UX©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 19. Mobile UX©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 20. Mobile UX • Branded vs. unbranded UI elements • Native VS. Web feel • Localization • Device Orientation • Device Integration • Transitions • Application ‘Aspects’ – Evernote – Twitter – Facebook©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 21. Digital Content Lifecycle©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 22. ©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 23. Under-the-waterline Integration Points • CMS • CDN • Ad server • Analytics • Video Formats • Metadata©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 24. Feature List: Features UX Patterns • Intuitive user experience • Watch Video • Support Social • Search, Browse / Find Engagement – By Program • Engaging (and – By Schedule appropriate ) promo • Recommend (inbound) material – (inbound) (Activity)Popularity • Monetization platform – (inbound) Featured (PBS) • eCommerce/ Buy Now from iTunes • Engage (outbound) – Share/ Social media • Localization Support – Local Station Links • Customize – Local TV schedules – Playlist – Favorite • Metrics and reporting©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 25. Conceptual Planning©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 26. Wireframes©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 27. Design Comps©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 28. Editorial Content + Social Engagement Facebook Twitter©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 29. Digital Content types©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 30. Design Patterns • Search / find • Huffington Post • Browse • BBC • Recommend • CNN • Related stories • Rate • Economist • Comment • WSJ • Discuss • Fox News • Engage • Google News • Share • USA Today • Update Activity/ Real time • Subscribe/ Follow / Join • Ad Placement©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 31. Tone, Voice, Form Pattern Relationships • Story Form & Ad Placement • Anything & Ad Placement • Engage & Join • Activity & Transition©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 32. Search©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 33. Search©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 34. Search/Find Results •RED: ads •BLUE: web Paginate •Grey: results Sort filter Groupings: Search within •Top stories Search archives •Popular Sponsored links •Featured Subscribe RSS •News/web©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 35. Browse • Category • Source • Location – Author • Top stories – Columnist – Blogger • Viewer segment – College • Story form – affinity • Media type • Popularity – Video – By # comments – Photo essay – Most shared©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 36. Browse + Customize©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 37. Recommend©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 38. Recommend©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 39. Rate / Share©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 40. Rate / Share©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 41. Comment / Discuss©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 42. Comment / Discuss©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 43. Share / Engage©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 44. Short Form Content©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 45. Aggregated Content©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 46. 3rd Party Content/Widgets NPR Twitter Facebook Onespot Sunlight Foundation Every …©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 47. Engage Content • Poll • Quiz©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 48. Story Forms: story©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 49. Story Forms: Blog©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 50. Story Forms: photo©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 51. Story Forms: photo©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 52. Story Forms: quote©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 53. Story Forms: statistic©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 54. Story Forms: story©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 55. Story Forms: story©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 56. Story Forms: story©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 57. Aggregated Content Blocks©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 58. Aggregated content: Photo player©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 59. Aggregated content: Lightbox Gallery©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 60. Aggregated content: Video Player©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 61. Aggregated content: Blogs©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 62. Aggregated content: Lists©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved
  • 63. Aggregated content:©COPYRIGHT 2009 Three Pillar Global, Inc., All Rights Reserved