My Name is E & Open Standards

Andreas Creten

My Name is E & Open Standards

Wednesday 27 May 2009Noordelijke Hogeschool Leeuwarden

Hi, I’m Andreas

Lead Development at

Andreas Creten

My Name is E & Open Standards

Wednesday 27 May 2009Noordelijke Hogeschool Leeuwarden

Social Networks

Online Service

Card sharing on any mobile phone.

All you need is an internet connection.

E for iPhone

Available for free.

Connector

Status

Launched last month.

Winners of the Next Web Award.

E’s Architecture.

PHP 5MySQLjQueryPongoArtoo

E’s Architecture.

PHP 5MySQLjQueryPongoArtoo

Pongo

Model-View-Controller Framework

Artoo

Sync Service app for pushing and pulling social network contact information.

Artoo

Loadbalancer

Amazon EC2

Webserver 1Amazon EC2E • Mobile 1E • Desktop 1Artoo

Webserver 2Amazon EC2E • Mobile 2E • Desktop 2Artoo

Static StorageAmazon S3

Profile imagesUI customization images

Database ServerAmazon EC2

Database EBS AccessMySQL

EBS VolumeAmazon EBS

MySQL Data

Server Setup

E is about bridging the gap between the virtual and physical.

Sharing cards is the first step.

E knows who you are and what’s around you.

You decide how you connect and what you share.

Andreas Creten

My Name is E & Open Standards

Wednesday 27 May 2009Noordelijke Hogeschool Leeuwarden

Do you use open standards?

Friday, May 15, 2009

I’ve shown applications and uses of the iPhone, but it itself is the benefactor of years of open standards development.

International Mobile Telecommunications-2000 (IMT-2000)IEEE 802.11 (WiFi)

JPEG

Short Message Service (SMS)

MPEG-4 Part 14, ISO/IEC 14496-14:2003 (MP4)

MPEG-1 Audio Layer 3 (MP3)

vCal

Bluetooth

HTTP, CSS, JS, etc

vCard, etc

SMTP, IMAP

SQLite, TXT

Friday, May 15, 2009

I’ve shown applications and uses of the iPhone, but it itself is the benefactor of years of open standards development.

Image credits: Chris Messina

“Standards change competition for a market to competition within a market”

Hall Varian - Information Rules, 1998

Data Portability

RSSReally Simple Syndication

APMLAttention Profile Markup Language

RDFResource Description Framework

<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:foaf="http://xmlns.com/foaf/0.1/" xmlns:dc="http://purl.org/dc/elements/1.1/"> <rdf:Description rdf:about="http://en.wikipedia.org/wiki/Tony_Benn"> <dc:title>Tony Benn</dc:title> <dc:publisher>Wikipedia</dc:publisher> <foaf:primaryTopic> <foaf:Person> <foaf:name>Tony Benn</foaf:name> </foaf:Person> </foaf:primaryTopic> </rdf:Description> </rdf:RDF>

XMPPExtensible Messaging and Presence Protocol

OpenSocial

opensocial.org - OpenSocial Foundation

A common API for social applications across multiple websites

Image credits: Patrick Chanezon, Kevin Marks & Christian Schalk

Image credits: Patrick Chanezon, Kevin Marks & Christian Schalk

Image credits: Patrick Chanezon, Kevin Marks & Christian Schalk

Image credits: Patrick Chanezon, Kevin Marks & Christian Schalk

OpenSocial applications

Based on standards:

HTML, Javascript, REST, oAuth

Access to:

People, friends, Activities, ...

REST endpoints:/people/{uid}/@friends

/people/{uid}/@self

/activities/{uid}/@friends

/activities/{uid}/@self

Additional parameters:format={format}format desired - options: atom, json (default)

fields={field+}List of fields to include in request

count={number}Set number of items/page

startPage={startPage}Select a page from a paged collection

OpenSocial containers

Microformats

microformats.org

How do we extract content?

Travel Network User Experience | sabreux.com 16

<h1>Canon EOS 5D 12.8 MP Digital SLR Camera</h1><p> <strong>overage rating:</strong> <img src="5stars.jpg" alt="5 stars" /></p><img src="canon5d.jpg" alt="camera body" /><p>The 12.8 megapixel Canon EOS 5d ... alloy body.</p><ul> <li>35.8 x 23.9-millimeter CMOS sensor</li> <li>3 frame-per-second burst</li> <li>0.2 second start-up time operation</li></ul>

Title <h1>Canon EOS 5D 12.8 MP Digital SLR Camera</h1>

<p> <strong>overage rating:</strong> <img src="5stars.jpg" alt="5 stars" /></p><img src="canon5d.jpg" alt="camera body" /><p>The 12.8 megapixel Canon EOS 5d ... alloy body.</p><ul> <li>35.8 x 23.9-millimeter CMOS sensor</li> <li>3 frame-per-second burst</li> <li>0.2 second start-up time operation</li></ul>

Paragraph

<h1>Canon EOS 5D 12.8 MP Digital SLR Camera</h1><p> <strong>overage rating:</strong> <img src="5stars.jpg" alt="5 stars" /></p><img src="canon5d.jpg" alt="camera body" />

<p>The 12.8 megapixel Canon EOS 5d ... alloy body.</p>

<ul> <li>35.8 x 23.9-millimeter CMOS sensor</li> <li>3 frame-per-second burst</li> <li>0.2 second start-up time operation</li></ul>

List

<h1>Canon EOS 5D 12.8 MP Digital SLR Camera</h1><p> <strong>overage rating:</strong> <img src="5stars.jpg" alt="5 stars" /></p><img src="canon5d.jpg" alt="camera body" /><p>The 12.8 megapixel Canon EOS 5d ... alloy body.</p>

<ul> <li>35.8 x 23.9-millimeter CMOS sensor</li> <li>3 frame-per-second burst</li> <li>0.2 second start-up time operation</li></ul>

Useless

Must be split into:

Title, Rating, Image, Description, Features

<div class="hreview"> <h1 class="item fn">Canon EOS 5D 12.8 MP Digital SLR Camera</h1> <p> <strong>overage rating:</strong> <span class="rating" title="5"> <img src="5stars.jpg" alt="5 stars" /> </span> </p> <img src="canon5d.jpg" alt="camera body" /> <p class="description"> The 12.8 megapixel Canon EOS 5d ... alloy body. <ul> <li>35.8 x 23.9-millimeter CMOS sensor</li> <li>3 frame-per-second burst</li> <li>0.2 second start-up time operation</li> </ul> </p></div>

Compound microformats

hReview, hCalendar, hCard, hListing, hAtom, hResume

Element microformats

defining the relation of an object with the page

hCalendar: http://microformats.org/code/hcalendar/creator

hCard: http://microformats.org/code/hcard/creator

hReview:http://microformats.org/code/hreview/creator

hResume: http://hresume.weblogswork.com/hresumecreator/

hAtom:http://dichotomize.com/uf/hatom/creator.html

Demo time: Examples

Firefox plugin: Operator

openid.net - OpenID foundation

Images source: http://konstruktors.com/blog/understanding-web/259-how-to-be-your-own-openid-provider-and-use-your-blogs-url-for-identification/

oauth.net

access token

RequestExchange token

Second consumer

RequestExchange token

First consumer

GrantExchange token

Service provider

PassesExchange token

RequestAccess token

GrantAccess token

Access ProtectedResources

oAuthX Flow

JS-Kit

JS-KitExchange token

JS-KitExchange token

JS-KitExchange token

Data Portability

are the tools to make

the internet more like real life

We are looking for interns

In Amsterdam And Antwerp

Questions?

andreascreten.be@andreascreten

mynameise.com/andreas