email: mark@mclaughlin.me.uk
| Visitors | ||
|---|---|---|
| Mark McLaughlin | aim: markmkorn email: mark@mclaughlin.me.uk |
Wednesday, 8 February 2006
TITLE OF SESSION: Designing Web 2.0-native Products for Fun and Profit NUMBER OF SESSION: 3 PRESENTED BY: Tom Coates CONFERENCE: The Future Of Web Apps | Summit DATE: 8th February 2006 LOCATION: Kensington Town Hall, London ------------------------------------------------------------------------------- REAL-TIME NOTES: {If you've contributed, add your name, e-mail & URL at the bottom} INTRODUCTION this presentation will be online at --> http://www.plasticbag.org/ Design and Web 2.0 2 things... Rounded corners and gradients! Product design - high livel - fit and thrive in their environment web changing dramatically - what is it changing into what we should be building architecture A web of data Web 2.0 buzzword, conference, marketing, bubble etc. Tim O'Reilly - What is Web 2.0? Markus Angermeier --> web 2.0 diagram, representation web of connected stuff - how is it evolving - API's and data web forms with links to data sources with API's Data sources connected by API's An aggregated web of connected data sources and services. Mashups - a web of - is a bit of a dead end - but it is showing us you can do something with two bits of data Yahoo! Astronewsology demo... using one data source to navigate a second data source. leads to a 'network effect' of services every new service builds ontop of another - creating a true platform A Network Effect of services Creative possibilities, innovation, competition, componentization and specialisation. Money can be made - use APIs to drive traffic. Amazon is prime example of using API to make money use syndicated content as a platform - targeted ads via google maps. Turn your API into a pay-for service. (explosion of) Choosing what to Build What to build?? core question --> big shift - what can i build that will make the whole web better? (add value) How can I add value to the Aggregate Web? How to open data source? - open current one - add one - help users create one and expose it data is incredibly important --> core service, own it, get it out, explore it, manipulate it --> build something on top of navigation --> ability to get around that data - search - or to explore feed burner -- good example build service in this framework Architectural Principles Matt Biddulph - app od weblike Design to Data: Designing Data for Reuse -> good article Data sources standard representations identifiers mechanisms for distribution mechanisms for interaction/enhancement rights frameworks 1. Look to add value to Aggregate Value (1) see above improve - connect, find new ways of manipulating 2. Build for normal users, developers and machines. normal users - just browse developers - look for hook - how can they exploit machines = predictability 3. Start designing with data, not with pages. data is reusable asset - don't think about poages first, get data right navigable, explorable, reusable data - present it on web well 4. Identify your first order objects and make them addressable first order --> core things, the things people will refer to first, ie films, think films first not viewing times make it addressable, people on the internet can get to it - good URL search engines can find it - become more available del.icio.us --> one url, multiple tags - it can grow, others can see Events and people are good first order objects. 5. Use readable, reliable and hackable URLs. URL shouldn't change - address should represent the thing it's refering to URL can have directory structure if it reflects the idea or concept behing it Don't reflect the underlying technology - what if it changed? (i.e. hide .php, .html, .jsp etc.) Good URL's are beautiful - design quality (+1 up for rails!) 6. Correlate with external identifiers schemes (or coin a new standard) want to get the data - need to correlate - if other sites are referring to the same data, then refer to them all across the web id scheme's - like ESBN - ISBN for electronic resources 7. Build list views and batch manipulation Three core types of pages on the web: 1. Destination page (first order) 2. List-view (navigate between first order concepts) 3. Manipulation interface (batch manipulation of first-order concepts). biggest prob with manipulation - the interface is not that powerful (AJAX to the rescue/or flash) core thing with AJAX - don't break the web - addressable, linkable, don't go outside concept 8. Create parallel data representations Parallel data representations rep dat in parallel fashion Embed microformats in the page HTML code Represent pages in parallel XML Represent lists in parallel RSS RSS is the new UNIX pipe for the internet (del.icio.us is good example, every page uses RSS) look at microformats (see link below) 9. Make your data as discoverable as possible got unique id, good URL's, RSS, should be half way there *** pause *** Q&A ------------------------------------------------------------------------------- REFERENCES: {as documents / sites are referenced add them below} "What is Web 2.0" by Tim O'Reilly http://www.oreillynet.com/pub/a/oreilly/tim/news/2005/09/30/what-is-web-20.html Markus Angermeier Web 2.0 diagram http://flickr.com/photos/kosmar/62381076/ Integration of URL's into the user interface (example) http://newsvine.com/london Guilty of the rounded corners and gradients: All about. Chatsum http://chatsum.com Blinksale http://www.blinksale.com Rollyo http://www.rollyo.com Blogger http://www.blogger.com Odeo http://www.odeo.com Microformats http://www.microformats.org Matt Biddulph presentation: http://hackdiary.com/slides/xtech2005 Yahoo! Developer API http://developer.yahoo.net Slides available at: Tom Coates blog --> http://www.plasticbag.org/ Typeface for the presenation was Alega light (and very nice it is too.) ------------------------------------------------------------------------------- QUOTES: {collect nice quotes from this session's speaker} "What can i build to make the whole web better?" "The race is on to own certain classes of core data: location, identity, calendaring of public events, product identifiers and namespaces" ------------------------------------------------------------------------------- CONTRIBUTORS: {add your name, e-mail address and URL below} Mark McLaughlin, mark@mclaughlin.me.uk Julan Virtue, julian.v@virgin.net ------------------------------------------------------------------------------- E-MAIL BOUNCEBACK: {add your e-mail address separated by commas for easy mailing of this text} ------------------------------------------------------------------------------- NOTES ON / KEY TO THIS TEMPLATE: HEADLINES ... have to be CAPITALISED and stand alone in a line to be recognized This differentiates from the text that follows A _variable_ that you can change will be surrounded by _underscores_ Spaces in variables are also replaced with _under_scores_ This allows people to select the whole _variable_ with a simple double-click A {tool-tip} is lower case and surrounded by {curly brackets / parentheses} These supply helpful contextual information. References should be added as [1] [2] and so forth. An *emphasis* can be put on a word by adding *stars* around it ------------------------------------------------------------------------------- DISCLAIMER: Copyright shared between all the participants unless otherwise stated... Generic conference template copyright by Tom Coates, tom@plasticbag.org Additions and Conference.mode by Dominik Wagner, dom@codingmonkeys.de