Your SlideShare is downloading. ×
  • Like
Improving the web experience through biomimetics
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Now you can save presentations on your phone or tablet

Available for both IPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Improving the web experience through biomimetics

  • 545 views
Published

Slides from my talk at What Do You Know hosted by Web Directions - August 2012, Sydney.

Slides from my talk at What Do You Know hosted by Web Directions - August 2012, Sydney.

Published in Business , Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
No Downloads

Views

Total Views
545
On SlideShare
0
From Embeds
0
Number of Embeds
2

Actions

Shares
Downloads
9
Comments
1
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. Improving the webexperience throughbiomimeticsMartin TomitschDesign Lab / University of Sydney
  • 2. BiomimeticsDesigning with 3.8 billion years of fieldtesting done for you
  • 3. biome.comTin Sheds gallery,until 6th September
  • 4. How does nature solve this?More intelligent and sustainable designthrough the emulation of nature
  • 5. Devine proportionThe rule of thirds
  • 6. 1 Decide on a width – eg 960px2 Divide your width by Phi – eg 960/1.62 =593px = width of main column3 Subtract main column width from total width– eg 960-593 = 367px = second column width
  • 7. http://www.thismanslife.co.uk/projects/phiculator/
  • 8. ColoursInspired by nature
  • 9. http://colorhunter.com/
  • 10. AnimationFlocking birds
  • 11. 1 Consider the divine proportion for your layout2 Use nature as source for your colour palette3 This is not a call for skeuomorphic design4 Don’t replicate nature – use it as inspiration
  • 12. 1 Consider the divine proportion for your layout2 Use nature as source for your colour palette3 This is not a call for skeuomorphic design4 Don’t replicate nature – use it as inspiration5 Visit the zoo before your next webdesign project
  • 13. Jason Beaird – The Principles of Beautiful Web Design
  • 14. Images sources and referencesJason Beaird – The Principles of Beautiful Web DesignLotus effect http://www.flickr.com/photos/ubookworm/396913158/sizes/o/in/photostream/Biomimetics examples http://www.designboom.com/contemporary/biomimicry.htmlKingfisher http://www.flickr.com/photos/oldbilluk/6058706620/Honeycomb image http://www.flickr.com/photos/trblmkr/317526681/Honeycomb chair http://www.neublack.com/art-design/biomimicry-in-design/Logo and credit card examples: http://www.designerfreelance.net/golden-ratio-in-design/Twitter redesign: http://www.flickr.com/photos/twitteroffice/5034817688/Nature inspired web design: http://www.weberica.net/web-design-en.htmlNature inspired web design: https://www.mint.com/Nature inspired web design: http://www.adventuredrop.com/Color from photographs http://studio7designs.com/create-color-palette-from-photographs/Gradient http://www.flickr.com/photos/jonwiley/2952276218/sizes/l/in/photostream/Boids http://www.flickr.com/photos/bennettklein/4707452705/http://www.smashingmagazine.com/2008/05/29/applying-divine-proportion-to-web-design/Book cover http://unmatchedstyle.com/news/book-review-principals-of-beautiful-web-design.php
  • 15. #nature #ixd
  • 16. Improving the webexperience throughbiomimetics@martintom#nature #ixd