Your SlideShare is downloading. ×
0
Widgets are fun! sometimes..
Widgets are fun! sometimes..
Widgets are fun! sometimes..
Widgets are fun! sometimes..
Widgets are fun! sometimes..
Widgets are fun! sometimes..
Widgets are fun! sometimes..
Widgets are fun! sometimes..
Widgets are fun! sometimes..
Widgets are fun! sometimes..
Widgets are fun! sometimes..
Widgets are fun! sometimes..
Widgets are fun! sometimes..
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Widgets are fun! sometimes..

1,089

Published on

my presentation for Widgetdevcamp

my presentation for Widgetdevcamp

Published in: Technology, Sports
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,089
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
3
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

Transcript

  • 1. a love and hate tale of widgets design centric thinking in a world of clutter
  • 2. Websites are your house <ul><li>I am an architect </li></ul><ul><ul><li>Some are crazier than others? </li></ul></ul><ul><li>He is a construction foreman </li></ul><ul><li>WebPages are like your desk? </li></ul>
  • 3. What I love about widgets <ul><li>They usually care some form of useful information </li></ul><ul><li>Sometimes they can be “hacked” </li></ul><ul><ul><li>And this is what we are going to talk about </li></ul></ul>
  • 4. What I hate about widgets <ul><li>Widgets in theory add to clutter </li></ul><ul><li>They are usually smuggling ads </li></ul><ul><li>What I want is just the data and no strings attached </li></ul>
  • 5. ads <ul><li>Random content survives on novelty </li></ul><ul><ul><li>Ads support most widgets </li></ul></ul><ul><ul><ul><li>Unless you make your own! </li></ul></ul></ul>
  • 6. most widgets add to lifes chaos!
  • 7. An easy challenge <ul><li>Flickr feed display </li></ul><ul><ul><li>Ad free (LESS CLUTTER) </li></ul></ul>
  • 8. Flickr <ul><li>/ tools </li></ul><ul><ul><li>“ Create your own Flickr badge” </li></ul></ul><ul><ul><li>An HTML badge </li></ul></ul><ul><li>Would you like to include a link to Flickr? </li></ul><ul><ul><li>Hmm? </li></ul></ul><ul><li>No back ground </li></ul><ul><li>No Border </li></ul><ul><ul><li>This is the code you need: </li></ul></ul><ul><ul><ul><li>All you need to do is copy and paste this chunk of code into your website where you'd like your “widget” to appear. </li></ul></ul></ul>
  • 9. <ul><li><!-- Start of Flickr Badge --> </li></ul><ul><li><style type=&quot;text/css&quot;> </li></ul><ul><li>#flickr_badge_source_txt {padding:0; font: 11px Arial, Helvetica, Sans serif; color:#666666;} </li></ul><ul><li>#flickr_badge_icon {display:block !important; margin:0 !important; border: 1px solid rgb(0, 0, 0) !important;} </li></ul><ul><li>#flickr_icon_td {padding:0 5px 0 0 !important;} </li></ul><ul><li>.flickr_badge_image {text-align:center !important;} </li></ul><ul><li>.flickr_badge_image img {border: 1px solid black !important;} </li></ul><ul><li>#flickr_www {display:block; padding:0 10px 0 10px !important; font: 11px Arial, Helvetica, Sans serif !important; color:#3993ff !important;} </li></ul><ul><li>#flickr_badge_uber_wrapper a:hover, </li></ul><ul><li>#flickr_badge_uber_wrapper a:link, </li></ul><ul><li>#flickr_badge_uber_wrapper a:active, </li></ul><ul><li>#flickr_badge_uber_wrapper a:visited {text-decoration:none !important; background:inherit !important;color:#3993ff;} </li></ul><ul><li>#flickr_badge_wrapper {} </li></ul><ul><li>#flickr_badge_source {padding:0 !important; font: 11px Arial, Helvetica, Sans serif !important; color:#666666 !important;} </li></ul><ul><li></style> </li></ul><ul><li><table id=&quot;flickr_badge_uber_wrapper&quot; cellpadding=&quot;0&quot; cellspacing=&quot;10&quot; border=&quot;0&quot;><tr><td><a href=&quot;http://www.flickr.com&quot; id=&quot;flickr_www&quot;>www.<strong style=&quot;color:#3993ff&quot;>flick<span style=&quot;color:#ff1c92&quot;>r</span></strong>.com</a><table cellpadding=&quot;0&quot; cellspacing=&quot;10&quot; border=&quot;0&quot; id=&quot;flickr_badge_wrapper&quot;> </li></ul><ul><li><script type=&quot;text/javascript&quot; src=&quot;http://www.flickr.com/badge_code_v2.gne?count=3&display=latest&size=s&layout=v&source=all_tag&tag=barcampdc&quot;></script> </li></ul><ul><li></table> </li></ul><ul><li></td></tr></table> </li></ul><ul><li><!-- End of Flickr Badge --> </li></ul><ul><li>This is what flickr gives you </li></ul>
  • 10. 3 vs 3000 <ul><li><script type=&quot;text/javascript&quot; src=&quot;http://www.flickr.com/badge_code_v2.gne?count=3&display=random&size=o&layout=v&source=all_tag&tag=barcampdc&quot;></script> </li></ul><ul><li><br /> </li></ul><ul><li><script type=&quot;text/javascript&quot; src=&quot;http://www.flickr.com/badge_code_v2.gne?count=3000&display=random&size=s&layout=v&source=all_tag&tag=jess3&quot;></script> </li></ul><ul><li>This is all you need </li></ul><ul><ul><li>Why don’t they just give you access to the feed? </li></ul></ul><ul><ul><ul><li>advertising </li></ul></ul></ul><ul><ul><ul><li>clutter </li></ul></ul></ul>
  • 11. All Sizes for all pics <ul><li>s small square 75x75 </li></ul><ul><li>t thumbnail, 100 on longest side </li></ul><ul><li>m small, 240 on longest side </li></ul><ul><li>[none] medium, 500 on longest side </li></ul><ul><li>b large, 1024 on longest side (only exists for very large original images that were resized during upload) </li></ul><ul><li>o original image, either a jpg, gif or png, depending on source format </li></ul>
  • 12. 75x75 <ul><li>Reliability </li></ul><ul><li>Flexibility </li></ul><ul><ul><li>Squares are easy </li></ul></ul>
  • 13. Cheers <ul><li>Jess3.com </li></ul><ul><li>Jess3.com/blog </li></ul>

×