104
Things to use, find and share. Christian Heilmann | http://icant.co.uk | http://wait-till-i.com Yahoo7 Open Session, Sydney, Australia April 2009

Things to use, find and share

Embed Size (px)

DESCRIPTION

My talk at the inaugural Yahoo7 open sessions talking about all the developer helpers Yahoo offers.

Citation preview

Page 1: Things to use, find and share

Things to use, find

and share.

Christian Heilmann | http://icant.co.uk | http://wait-till-i.com

Yahoo7 Open Session, Sydney, Australia April 2009

Page 2: Things to use, find and share

Hi there, I am Chris.

Page 3: Things to use, find and share

I am right now on a pretty mental schedule giving talks down south.

Page 4: Things to use, find and share

Last week I flew from home (London, UK) to Hong Kong, Taipei, drove to Hsinchu, back to Taipei, onwards to Sydney via Hong Kong, then to Melbourne and now back to Sydney.

Page 5: Things to use, find and share

All with the mission to share good info to make web development easier.

Page 6: Things to use, find and share

Doing that and not sleeping much does things to you.

Page 7: Things to use, find and share

You see hidden messages.

Page 8: Things to use, find and share

...and you misinterpret others.

Page 9: Things to use, find and share

I live in London, England

Page 10: Things to use, find and share

Spring Summer

AutumnSummer

Winter

*

The snow flake that spells the end of public transport

Page 11: Things to use, find and share

Originally I am German

Page 12: Things to use, find and share

FIRST!

Page 13: Things to use, find and share

Humour.

Page 14: Things to use, find and share

I ♥ building great interfaces to access and find data.

Page 15: Things to use, find and share

And I love making them work for everybody.

Page 16: Things to use, find and share

The problem is that for years it was quite a job to make this is a reality.

Page 17: Things to use, find and share

Nowadays we are very lucky as developers.

Page 18: Things to use, find and share

It is increasingly easy to develop great products.

Page 19: Things to use, find and share

The trick is to build them with parts that are proven to work.

Page 20: Things to use, find and share

And these parts are readily available for us.

Page 21: Things to use, find and share

Over the last years a revolution happened.

Page 22: Things to use, find and share

Companies and individuals started realizing the power of giving things out to the public.

Page 23: Things to use, find and share

By allowing people to use your products and keep an open ear you have a great opportunity to improve them.

Page 24: Things to use, find and share

And this is exactly what we do at the Yahoo Developer Network.

Page 25: Things to use, find and share
Page 26: Things to use, find and share

Basically almost everything you see in use on Yahoo’s sites is available to you to build your solutions on.

Page 27: Things to use, find and share

This starts with the thing great products are built on: user research.

Page 29: Things to use, find and share

The pattern library contains information on how users told us they reach their goals on our sites the easiest.

Page 30: Things to use, find and share

The information is licensed creative commons, which means you can use and alter it.

Page 31: Things to use, find and share

If you want to plan your interfaces based on these results, you even get them as stencils.

Page 33: Things to use, find and share

Once you planned your product, the next problem is ensuring it works.

Page 34: Things to use, find and share

For this, we need to somehow make sense of the crazy world of user agents (browsers, really).

Page 35: Things to use, find and share

Trying to build web products that look and work the same for every browser out there is not possible...

Page 36: Things to use, find and share

...unless you limit yourself to a terrible user experience.

Page 37: Things to use, find and share

As we didn’t want this, we came up with a methodology to define “support”.

Page 39: Things to use, find and share

Once this was done, we had a chance to fix problems and build a solid base to work on.

Page 41: Things to use, find and share

The Yahoo User Interface Library starts with making the creation of predictable designs easy.

Page 42: Things to use, find and share

CSS

Page 43: Things to use, find and share

CSS reset gets rid of browser differences.

Page 44: Things to use, find and share

CSS fonts allow you to create predictable and scalable typography across browsers.

Page 45: Things to use, find and share

And CSS grids allow you to create multi-column layouts.

Page 46: Things to use, find and share

http://developer.yahoo.com/yui/grids/builder/

Even for *very* lazy developers:

Page 47: Things to use, find and share

Once the CSS was less confusing, we tackled JavaScript and browser confusions.

Page 48: Things to use, find and share
Page 49: Things to use, find and share

And with this arsenal we built reusable widgets to mix and match.

Page 50: Things to use, find and share

http://ui.jquery.com/

http://ui.jquery.com

Page 51: Things to use, find and share

All of the widgets can be extended and styled the way you want them to.

Page 53: Things to use, find and share

You can extend the widgets by listening for events that happen to them.

Page 55: Things to use, find and share

They are built with ideas I very much subscribe to, like progressive enhancement.

Page 56: Things to use, find and share

Without JavaScript With JavaScript

http://developer.yahoo.com/yui/examples/autocomplete/ac_basic_array_clean.html

Page 57: Things to use, find and share

Without JavaScript

With JavaScript

http://developer.yahoo.com/yui/examples/datatable/dt_enhanced.html

Page 58: Things to use, find and share

We provide the bricks, you build the product.

http://www.flickr.com/photos/seven13avenue/2080281038/

Page 59: Things to use, find and share

All of this is open source, fully documented and you can either host it yourself or get it from a high speed distributed network (even Google’s).

Page 60: Things to use, find and share

Another thing to consider is how your products perform.

Page 61: Things to use, find and share

Fast and smooth products make users happy.

Page 63: Things to use, find and share

You can test your products easily with YSlow.

http://developer.yahoo.com/yslow/

Page 64: Things to use, find and share

This solves most of our issues these days.

Page 65: Things to use, find and share

And allows you to quickly create products that work.

Page 66: Things to use, find and share

This solves most of our issues these days.

http://tweeteffect.com/

Page 67: Things to use, find and share

How about reaching out and finding data in other resources?

Page 69: Things to use, find and share

Using Yahoo BOSS you can build own search engines based on Yahoo’s search index.

Page 70: Things to use, find and share

Results include news, images or web results.

Page 71: Things to use, find and share

Including keywords, microformats, RDF, social bookmarking data, incoming links...

Page 72: Things to use, find and share

Thus you can create niche search products.

Page 73: Things to use, find and share

Thus you can create niche search products.

http://keywordfinder.org/

Page 74: Things to use, find and share

Thus you can create niche search products.

http://icant.co.uk/sandbox/unsafe.html

Page 75: Things to use, find and share

What if you want to reach even further?

Page 76: Things to use, find and share

I personally have this crazy idea of the web.

Page 77: Things to use, find and share

Users see the web as an interface.

Page 78: Things to use, find and share

Developers have x-ray vision and see code

Page 79: Things to use, find and share

I see something different.

Page 80: Things to use, find and share

Sweet data to pick and mix.

*

http://www.flickr.com/photos/25802865@N08/3195857208/

Page 81: Things to use, find and share

We’ve provided a way to access this data for quite a while now.

Page 83: Things to use, find and share

However, this was all visual.

Page 84: Things to use, find and share

How about doing this on a language basis?

Page 85: Things to use, find and share

Say you want to get photos of Sydney that you are allowed to show in your own products.

Page 86: Things to use, find and share

You need to define Sydney, Australia without a doubt.

select woeid from geo.places where text='sydney,au'

Page 87: Things to use, find and share

Then find photos that were taken there.

select id from flickr.photos.search where woe_id in (select woeid from geo.places where text='sydney,au')

Page 88: Things to use, find and share

Check that they have the right license.

select id from flickr.photos.search where woe_id in (select woeid from geo.places where text='sydney,au')

and license=4

Page 89: Things to use, find and share

And get all the information about them.

select * from flickr.photos.info where photo_id in (select id from

flickr.photos.search where woe_id in (select woeid from geo.places where text='sydney,au') and license=4)

Page 90: Things to use, find and share

http://developer.yahoo.com/yqlhttp://developer.yahoo.com/yql/console/?q=select%20*%20from

%20flickr.photos.info%20where%20photo_id%20in%20(select%20id%20from%20flickr.photos.search%20where%20woe_id%20in%20(select%20woeid

%20from%20geo.places%20where%20text%3D%27sydney%2Cau%27)%20and%20license%3D4)

Page 91: Things to use, find and share

YQL gets the data, caches it and gives you information about the retrieval time.

Page 92: Things to use, find and share

The results are available in XML or JSON and can be filtered down to the bare necessities.

Page 93: Things to use, find and share

Using this you can get all the data you spread on the web...

Page 94: Things to use, find and share

...and collate it in a single interface.

Page 95: Things to use, find and share
Page 96: Things to use, find and share
Page 97: Things to use, find and share

You can also use YQL to help people like me to get and use data provided by you using this interface.

Page 98: Things to use, find and share

The trick is to tell us with a schema where your data is.

Page 99: Things to use, find and share

And then use the schema in a query inside YQL as an “open table”

Page 100: Things to use, find and share

use 'http://eatyourgreens.org.uk/yql/nmm-search.xml' as nmm;select * from nmm where category = 'art' and searchterm = '"tower bridge"'

Page 101: Things to use, find and share

A lot of companies already start doing that.

Page 103: Things to use, find and share

So, go and grab and use and give back and we’ll all make the web the best it can be.