
Salah satu kelebihan yang dimiliki Facebook sebagai situs social network terbesar di dunia adalah user interface-nya yang sangat interaktif dan menarik. UI yang penuh dengan efek animasi ini pastinya didukung oleh teknologi AJAX yang memanfaatkan JavaScript.
Banyak pengembang telah membuat JavaScript tiruan yang mirip dengan antarmuka Facebook—yang memanfaatkan framework atau JavaScript library terkenal seperti jQuery dan MooTools. Berikut ini adalah daftar script-script temuan saya via Google yang bisa digunakan untuk membuat tampilan blog atau website kita semenarik Facebook ↓
1 – Facebox (jQuery)

Facebox adalah sebuah plugin untuk jQuery untuk menampilkan overlay window dalam bentuk seperti Lightbox, dengan label “close” di bagian bawah. Facebox cukup menarik digunakan untuk preview gambar, galeri, pesan error dan konfirmasi, dan sebagainya—sebagai alternatif Thickbox yang sangat populer itu.
Demo bisa dilihat di FamSpam.
2 – Facebox (MooTools)

Sama seperti plugin Facebox untuk jQuery, tetapi yang ini berbasis MooTools. Fungsinya sama, bisa menampilkan overlay window seperti pop-up yang berisi gambar, flash, dan sebagainya.
Lihat demo dan download Facebox untuk MooTools di MooLabs.
3 – Boxy

Boxy merupakan plugin jQuery untuk menampilkan kotak dialog seperti Facebook yang dapat diseret (drag). Kotak dialog ini bisa dimanfaatkan untuk form, jendela konfirmasi, jendela pertanyaan, dan sebagainya. Lihat demo di onehackoranother.com.
4 – Facebook-like Registration Form
Halaman form registrasi menggunakan AJAX seperti Facebook bisa dibuat menggunakan jQuery. Tutorialzine memberikan tutorial langkah demi langkah bagaimana membuat form seperti itu mulai dari menyusun markup form, desain CSS, PHP, dan terakhir memanfaatkan metode AJAX jQuery untuk mengirimkan data pendaftaran hanya melalui backend, jadi tidak mempengaruhi halaman registrasi yang sedang dibuka.
5 – Elastic – Textareas grow

Sesuai namanya, plugin jQuery Elastic ini berfungsi untuk membuat ukuran form textarea menjadi “elastis” (dapat meluas sesuai banyaknya teks yang ditulis). Plugin ini terinspirasi dari auto-growing textarea yang terdapat pada Facebook. Silakan dicoba di Unwrongest.
6 – Facebook Autosuggestion

Autosuggestion merupakan salah satu fitur pencarian Facebook yang sangat membantu untuk mencari profil teman berdasarkan namanya. Srinivas Tamada dari 9Lessons memberikan skrip gratis beserta tutorialnya bagaimana cara mengimplementasikan auto-suggestion ini dengan menggunakan AJAX, jQuery, dan PHP.
7 – Facebook Searchengine

Fungsinya sama dengan Facebook Autosuggestion ↑, tetapi yang ini menggunakan autocomplete library.
8 – TextboxList
Texboxlist berfungsi mengubah input teks di dalam texbox menjadi sebuah list yang bisa dihapus dengan mudah hanya dengan klik mouse.

TextboxList asli berbasis MooTools, tapi ada juga yang menggunakan Prototype buatan InteRiders. Cek demonya di Devthought untuk TextboxList MooTools dan InteRiders untuk TextboxList Prototype.
9 – Tipsy

Tipsy sebenarnya cuma tooltips biasa—sama seperti tooltips lain yang menggunakan JavaScript. Tipsy didesain mirip dengan tooltips Facebook pada photo/image tagger—walaupun tidak menutup kemungkinan menggunakan tooltips lain atau bahkan hanya mengandalkan CSS tanpa JavaScript.
10 – Facebook Bottomless Pagination

Sistem halaman Facebook sangat menarik karena setiap arsip lama tidak dibuka di halaman lain, melainkan ditambahkan di halaman yang sedang dibuka, jadi seolah-olah bisa dibuka sepanjang-panjangnya tanpa batas. David Parker menulis plugin untuk membuat pagination system seperti itu.
Selamat mencoba!
As usual, superb post fan! Kalau ada button like-nya sudah saya like nih
Thanks man. Kalau ada like-nya komentarmu juga saya like karena selalu pertamax hehe
kalau mo ngomen pertamax di blog skeren gini kok rasanya seakan menjatuhkan diri sendiri
sipp bang … semoga makin bnyak dev facebook indonesia ,.. syukur ada web apps karya anak bangsa yg setenar fb
Kalo yang udah jadi satu, menjadi theme gratis wordpress ada nggak sie?
@Ai: mungkin theme Smells like Facebook bikinan Nazieb, efek AJAX-nya banyak yang mirip Facebook walaupun tidak semuanya.
@Fanari: udah di suspend mas…
Mungkin, Smell Like Facebooknya nazieb di gabungkan dengan beberapa plugin ini pasti cukup kompak ya. Tapi, terkait dengan penggunaan ajax dan kebutuhannya terhadap Javascript, sebaiknya kita menyediakan 2 buah versi, yakni versi ajax dan versi non ajax bukan? Terkait masalah aksesibilitas.
Terkait Ajax juga, saya masih berharap apakah HTML 5 bisa menggantikan fungsi Ajax? Sehingga tidak perlu lagi takut masalah cross compability dan javascript accessibility bukan? Mengingat sebagian fasilitas Javascript, sudah di support di HTML 5, seperti Drag n Drop.
wah, terima kasih banyak atas informasinya, saya bookmark dulu halaman ini
I’m confusing.. Tak bookmarks dulu mas..
pemahaman yang mendalam,g ngerti deh mslh bginian
Menarik banget nih.
Perlu dicoba.
Btw, met idul fitri
Minal aidin wal faizin.
wah bisa dicoba nih…….
thanks tas infonya…
@Edi Psw: sama-sama pak, maaf lahir batin
walah… ternyata tanpa disadari Facebook itu web yang pake AJAX yah…
Jquery memang universal ya, informasinya sangat menarik dan patut dicoba.
Nih,.. Plugin WordPressnya mas…
Tertarik sama facebox…
lam knal sebelumnya
wah perlu di bookmark neh…bacanya harus pelan-pelan soale saya agak dodol…
maknyus rek, emang ajax ajax cinta ngak ada duanya
gmn mas download source code nya ????????????????
maklum baru bisa maen internet
keren mas…. tak bookmark yo..
punya ide nyaingi Fb nie
coba gabung di http://grou.ps/facebookwidia, dan rasakan bedanya