trend web 2008
DESCRIPTION
Ditodong jadi narasumber dadakan untuk acara Free Saturday Lesson ComLabs ITB.TRANSCRIPT
![Page 1: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/1.jpg)
WEB TREND 2008
Free Saturday Lesson ComLabs ITB
![Page 2: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/2.jpg)
contenttechnologyw e b . i n d o n e s i a2008design
{ }
![Page 3: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/3.jpg)
Content
![Page 4: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/4.jpg)
Konsep Web 2.0 : istilah yang muncul saat conference brainstorming session O'Reilly dengan MediaLive International pada tahun 2004. ”participatory websites, it's about people...”
lagilagiweb 2.0 !
![Page 5: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/5.jpg)
![Page 6: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/6.jpg)
![Page 7: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/7.jpg)
” social networking ”Add friendster gue dong!
![Page 8: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/8.jpg)
Dulu pergaulan atau aktivitas sosial online adalah irc, yahoo, icq dsb.Di era web 2.0 trendnya adalah web based social networking.Orangorang saling terkoneksi dalam jejaring pertemanan melalui hubungan kesamaan interest, hobby, topik, lokasi, sekolah dsb.
![Page 9: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/9.jpg)
[ facebook.com ]
[ myspace.com ]
+ : apps & API
+ : music demo
![Page 10: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/10.jpg)
[ multiply.com ]
[ friendster.com ]
+ : media sharing
+ : southeast asia
![Page 11: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/11.jpg)
[ last.fm ]
[ mixi.co.jp ]
+ : music profile+ : audio scrobble
+ : batara kesuma's
![Page 12: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/12.jpg)
[ akucintasekolah.com ]
+ : spesifik
[ fupei.com ]
![Page 13: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/13.jpg)
” user generated content ”We provides the bucket...
![Page 14: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/14.jpg)
[ flickr.com ]
[ youtube.com ]
+ : tags & community
+ : video
![Page 15: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/15.jpg)
[ layartancap.com ]
[ sharingfoto.com ][ fotoku.com ]
[ fotografer.net ]
![Page 16: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/16.jpg)
” multimedia & file sharing ”
Bandwidth bukan masalah...
![Page 17: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/17.jpg)
[ rapidshare.com ]
[ youtube.com ]+ : video
![Page 18: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/18.jpg)
[ imeem.com ]
[ multiply.com ]
![Page 19: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/19.jpg)
[ layartancap.com ]
[ gigeupload.com ][ indowebster.com ]
[ gudangupload.com ]
![Page 20: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/20.jpg)
” blog ”68% blogger positif :p
![Page 21: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/21.jpg)
[ priyadi.net ]
[ budi putra ]
![Page 22: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/22.jpg)
[ blogger.com ]
[ wordpress.com ]
![Page 23: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/23.jpg)
[ dagdigdug.com ]
[ blogdetik.com ]
![Page 24: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/24.jpg)
” microblogging ”Saat ini saya sedang di WC...
![Page 25: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/25.jpg)
[ twitter.com ]
[ plurk.com ]
![Page 26: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/26.jpg)
[ jaiku.com ]
[ pownce.com ]
![Page 27: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/27.jpg)
[ kronologger.com ]
[ moodmill.com ]
![Page 28: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/28.jpg)
” ecommerce ”Jualan online...
![Page 29: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/29.jpg)
[ ebay.com ]
[ amazon.com ]
![Page 30: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/30.jpg)
[ multiply.com ]
[ kutukutubuku.com ]
![Page 31: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/31.jpg)
[ FJB kaskus.us ]
[ bhinneka.com ]
![Page 32: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/32.jpg)
” social bookmarking ”Submit, rate... or dig.
![Page 33: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/33.jpg)
[ del.icio.us ]
[ digg.com ]
![Page 34: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/34.jpg)
[ lintasberita.com ][ republikblog.com ]
[ kilasan.com ]
![Page 35: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/35.jpg)
” knowledge sharing ”Wikinomics & open culture...
![Page 36: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/36.jpg)
[ id.wikipedia.org ]
[ ilmukomputer.com ]
![Page 37: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/37.jpg)
” microsite ”Product & event branding...
![Page 38: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/38.jpg)
[ Biore ]
[ Dove Moment of Truth ]
![Page 39: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/39.jpg)
” web 1.0 legacy ”We're still alive and upgraded !
![Page 40: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/40.jpg)
[ kaskus.us ]
[ detik.com ][ detikbandung.com ]
[ okezone.com ]
![Page 41: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/41.jpg)
[ portal & profile ]
[ layanan ]
![Page 42: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/42.jpg)
” legal issues ”My precious content...
![Page 43: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/43.jpg)
![Page 44: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/44.jpg)
UU ITEUndangUndang Informasi dan Transaksi Elektronik
( Pasal 25 )
![Page 45: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/45.jpg)
Desain
![Page 46: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/46.jpg)
” web 2.0 is not a design aesthetic ! ”Elliot Jay, FOWD Conference 2007
![Page 47: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/47.jpg)
# misconceptions, but...
“Recruiting: a good web 2.0 designer.”
“Our client wants web 2.0 looks website.”
“This web design was great and uptodate, it's sooo web 2.0ish.”
“Wah webnya web 2.0 banget!”
![Page 48: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/48.jpg)
samples[ sample: microblogging ]
![Page 49: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/49.jpg)
similarities[ design trend ~ web 2.0 looks ]
Web 2.0
Web 2.0
Web 2.0
functions, features
design trend
business process,user participatory,user interaction
![Page 50: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/50.jpg)
well... let's get cliché !( knowing the false understanding... adapt the current trends... trying to looking good! )
$ $ $
![Page 51: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/51.jpg)
become typical[ example: protolize.org ]
![Page 52: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/52.jpg)
become typical
vibrant,hicontrast
colors
mirror effect / reflection
Also: centered layout, oversize text, glossy icons,highlight area, screenshot reflection
round flashes
glossy/sheen,3D effect
roundedcorners
gradients
diagonallines
plenty ofspaces,
clear text
backgroundsolid?
gradient?clean white?
![Page 53: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/53.jpg)
” background ”
![Page 54: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/54.jpg)
Background: Solid + Dark
![Page 55: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/55.jpg)
Background: Gradient
![Page 56: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/56.jpg)
Background: Clean White
![Page 57: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/57.jpg)
Background: Floating Paper
![Page 58: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/58.jpg)
” glossy/sheen ”
![Page 59: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/59.jpg)
Glossy Navigation & Buttons
![Page 60: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/60.jpg)
” mirror effect ”
![Page 61: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/61.jpg)
Mirror Effects / Reflections
![Page 62: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/62.jpg)
” rounded corners ”
![Page 63: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/63.jpg)
Rounded Area / Box
![Page 64: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/64.jpg)
” clean, oversize & searchable text ”
![Page 65: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/65.jpg)
Clean Text
![Page 66: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/66.jpg)
” highlight area + teasing button”
![Page 67: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/67.jpg)
Highlight Area
![Page 68: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/68.jpg)
Highlight Area
![Page 69: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/69.jpg)
Highlight Area
![Page 70: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/70.jpg)
Technology
![Page 71: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/71.jpg)
” RIA & AJAX ”Javascript? Yukk...
![Page 72: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/72.jpg)
Rich Internet ApplicationsAsynchronous Javascript And XML
![Page 73: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/73.jpg)
” open API ”Let's mashup...
![Page 74: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/74.jpg)
Application Programming InterfaceGoogleMapsAPI – FacebookAPI – FlickrAPI – PayPal API etc.* Mashup
![Page 75: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/75.jpg)
” RSS ”E x t r a c t . . .
![Page 76: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/76.jpg)
Really Simple Syndicationfrequently publishing content summary – feeds
![Page 77: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/77.jpg)
” openID ”Single authentication...
![Page 78: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/78.jpg)
![Page 79: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/79.jpg)
” webstandard & usability ”
Yippe, my web is XHTML & CSS valid!
![Page 80: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/80.jpg)
DOMCSSsemantic webW3C
XHTML/HTML SVG
![Page 81: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/81.jpg)
” opensource ”Linux, Apache, MySQL, PHP, Ruby on Rails, you name it...
![Page 82: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/82.jpg)
![Page 83: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/83.jpg)
” framework ”Don't repeat yourself...
![Page 84: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/84.jpg)
![Page 85: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/85.jpg)
” mobile technology ”Devices, standard, lifestyle, infrastructure...
![Page 86: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/86.jpg)
GPRS3GminiBrowserBlackBerry
webstandardWAP
UMPC
notebookWiFi
![Page 87: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/87.jpg)
” microformat ”Toward web semantic, today...
![Page 88: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/88.jpg)
![Page 89: Trend Web 2008](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55516f05b4c9057e458b488e/html5/thumbnails/89.jpg)
http://slideshare.net/niwat0ri