Web design, dunia yang baru saya kenal di semester pertama kuliah, ketika mengikuti mata kuliah Pemrograman Web. Dan sejak itu, saya langsung jatuh hati ;). Kalau sudah ‘bergumul’ dengan HTML, CSS, Javascript, atau PHP, dan tentu saja.. digital image editor favorit saya, Photoshop, rasanya sulit untuk berhenti. Biasanya sih ga akan berhenti sampai saya cukup puas dengan hasilnya, walaupun bisa menghabiskan waktu berjam-jam di depan monitor dan keyboard.

Hasrat mendesain web ini dulu saya salurkan lewat proyek dan tugas di beberapa mata kuliah. Lalu setelah bekerja saya iseng membeli domain dan hosting, dan menyalurkan hobi saya di situ. Kalau sudah bosan dengan desainnya, dan punya waktu luang plus ide, pasti saya sempatkan untuk mendesain ulang. Just for fun :D

Dimulai secara tak sengaja oleh permintaan seorang teman untuk membuatkan wedding website, dan pesanan-pesanan selanjutnya yang menyusul, saya mulai ‘menjual’ hobi saya. Getting paid while having fun? Why not? ;)

Sejauh ini, baru 3 website yang saya kerjakan. Masih amatir, ehem ;p. Dua di antaranya wedding website, jokomirawedding.com dan reishafatoni.com *kalau sudah tidak bisa dibuka berarti domainnya expired, maklum, wedding website ;p*. Sedangkan yang terakhir (masih belum selesai), dokteranakku.net, sejenis blog berisi artikel tentang kesehatan anak.

Semuanya punya ciri khas desain yang sama, gambar ruangan dengan detail sesuai dengan isinya. Dan semuanya mengandalkan keingintahuan user untuk menemukan link menuju ‘sesuatu’ jika diklik. Mulai bosan sih dengan ide ini, ingin mendesain sesuatu yang lain, tapi nanti dulu deh ^^;

Nah sekarang… yiuks ah, lanjut ke bagian curcol-nya ;p

Yang namanya hobi, sesuatu yang membuat kita senang kalau dilakukan *bikin hidup jadi lebih hidup… tsahh! ;p*, kalau dijadikan pekerjaan tentu saja kadar kesenangannya jadi berkurang. Misalnya, secinta apapun seseorang dengan programming, kalau sudah dikejar deadline atau dicereweti klien, siapa sih yang gak stress? ;)

“Your wishes are my commands” *wink*

Adalah moto yang selalu saya pegang selama proses penggarapan website. Karena setahu saya, dalam bisnis apapun, kepuasan pelanggan adalah yang utama. Tapi, dalam pelaksanaannya, moto ini susaaaaaaah sekali diterapkan. Menerjemahkan keinginan klien dan menggabungkannya dengan ‘selera’ diri sendiri, bukan hal yang mudah. Apalagi kalau tiba-tiba, dua keinginan ini bentrok. Harus dipertimbangkan baik-baik keinginan mana yang didahulukan, lebih baik lagi kalau bisa dicari ‘win-win solution’-nya.

Lalu, terkadang ‘wishes’ dari klien juga butuh untuk dikerjakan segera. Yah, kalau soal ini sih memang sudah kewajiban saya, jadi ga bisa mengelak dan mengeluh. Kalau sudah deadline ya mau bagaimana lagi, bukan begitu? ;)

Terus belajar.. dan belajar lagi..

Salah satu manfaat yang saya dapatkan dari proyek-proyek ini, rasanya seperti diberi kesempatan untuk belajar dan mengeksplorasi hal-hal yang baru di dunia pemrograman web. Di setiap proyek saya pasti mendapat ilmu baru, that’s fun! ^^

Beberapa tools yang saya temukan dan saya gunakan:

• Floatbox, untuk efek membuka popup, picture slideshow, dan sebagainya.
• MegaZine3, flipbook gratis yang cukup mumpuni *support transparent pages*.
• Facebook Social Plugins, since almost everybody uses Facebook ;)
• Google Feed API, to fetch RSS Feed
• Yahoo! Smush.it!, optimizing images for web, supaya lebih ringkas begitu..

Tak lupa juga.. HTML5! Makes everything easier ;).

Blogspot, Migrasi? Tidak?

I’m so sorry, this will sound a bit technical, just skip it if you’re not interested ;).

Jadi begini, untuk proyek terakhir, tujuannya adalah supaya user bisa mengakses artikel yang sudah terkategorisasi, via halaman utama yang dibuat seperti ruang praktek dokter anak. Masalahnya, artikel-artikel itu bertempat di blogspot *kalau wordpress mungkin lebih gampang >.<*.

Dengan asumsi user bisa membaca artikel via domain dan hosting yang baru, bukan cuma nge-link ke blogspot, berdasarkan informasi yang saya kumpulkan, ada beberapa solusi:

1. Migrasi total ke self-hosted wordpress. Pertimbangannya, klien harus pindah environment dari blogspot ke wordpress.
2. Menggunakan plugin di wordpress supaya wordpress bisa berfungsi sebagai RSS fetcher. Klien bisa tetap posting blog via blogspot, tapi artikel bisa terambil dan tersimpan di self-hosted wordpress. Atau mungkin ga perlu install wordpress juga bisa, cukup membuat simple RSS fetcher code, server side scripting. Masalahnya, hosting gratis yang sekarang dipakai, tidak mengijinkan koneksi ke remote server. Jadi intinya, harus upgrade hosting, wajib bayar lah istilahnya.
3. Menggunakan Google Feed API. Sama seperti poin nomor 2, hanya saja karena Google Feed API ini menggunakan AJAX, client side scripting, tidak perlu meng-upgrade hosting. Bisa tetap menggunakan hosting gratisan. Kerugiannya, fungsi webnya jadi hanya sebatas RSS reader, ga akan bisa terindeks di search engine.

Hosting gratis yang sekarang digunakan adalah paket Chocolate di freehostia.com. Solusi terbaik sebenarnya solusi kedua, sayangnya harus bayar. Atau mungkin harus cari-cari hosting lain yang gratis dan tanpa batasan koneksi ke remote server kali ya. Untuk sementara sih masih menggunakan solusi ketiga, tanpa pindah tanpa bayar >.<.

Testing & Debugging

Di proyek apapun pasti perlu ya tahapan ini. Tester utama tentu saja sang klien. Tapi saya juga punya beberapa orang terdekat yang saya minta menjadi tester, untuk memberi masukan dan laporan bug yang kadang terlewat oleh klien.

Lalu, karena salah satu aspek penting dalam mendesain web adalah cross-browser, alias mampu tampil oke di semua browser, di laptop saya jadi lengkap.. semua browser ada dan selalu ter-update. I have to say that Internet Explorer becomes the source of the problems most of the time ^^;

Loading time juga penting, untungnya ada software untuk simulasi berbagai jenis kecepatan internet. Karena waktu di Nancy, kecepatan internetnya super dahsyat, perlu diturunkan untuk mensimulasikan loading time dengan koneksi internet di Indonesia ;p. Sekarang di Bolzano sih ga beda jauh -_-, bahkan kadang mungkin jauh lebih lambat, huks.

Web Designer = Web Developer = Web Consultant?

Yap, karena saya benar-benar baru dalam dunia ini (designing web commercially), saya masih belum mengerti definisi dan pembatasan secara jelas dari yang namanya ‘web designer’. I love to design, and to develop it *actually I’m kinda hooked on programming ;p*, but act as a consultant? Err… I’d rather avoid it.

Sayangnya, di proyek ketiga, klien saya bukan orang IT (dua klien sebelumnya teman seangkatan sejurusan di kampus ;p). Bisa dibilang.. proyek terakhir ini penuh tantangan. Saya harus bertindak sebagai konsultan, menjawab pertanyaan-pertanyaan klien dengan bahasa yang mudah dimengerti, memberi berbagai solusi dan pertimbangannya… professionally. And most likely… I failed ^^; Well, intinya saya masih harus banyak belajar untuk yang satu ini.

*******

“So, should I officially announce paramitopia inc.?”
“No, no, no! Finish your master study first, then after that.. you can do whatever you want with your time.”
“Uhm.. yeah, you’re right..”

Dua tahun yang lalu, tahun 2009 di bulan Oktober…

Saya ingat benar, waktu itu akhir minggu, dan saya mau berakhir pekan di rumah di Bogor (saya masih jadi karyawan dan masih berbasis di Cikarang). Dengan hati riang saya membawa pulang Nintendo Wii yang baru saja dibeli di Mangga Dua. Console game saya (dan adik) yang pertama! ^^

Setelah bongkar-bongkar pasang-pasang dan bisa menyala dengan sempurna (walaupun dengan instruction manual berbahasa Korea ^^;), dengan euphoria berlebih kami bermain semalaman, sampai pagi. Dan tragedi itu pun terjadi.

Dalam keadaan sedikit teler habis bergadang semalaman…

Saya & Adik: Waah, bisa internet.. Coba yuk, browsing!
Wii: Supaya bisa internet, software-nya harus di-update nih.. Update dong!
Adik (memegang controller): Gimana nih? Update?
Saya: Uhmm… Coba aja…
Wii: Bla bla bla… ‘Yes’ or ‘No’?
Adik: Yes?
Saya: Yes!

Tak berapa lama kemudian…

Wii: Mwahahahahaha… Selamat, Wii ini sudah terkena error 003!
Saya & Adik: Terdiam… Terpaku… Memandang layar hitam, bertuliskan ‘Error: 003 Unauthorized device has been detected’.

Yap, belum genap sehari umurnya, Wii kami terkena the infamous error 003 T__T. Kami berdua sama-sama salah, walaupun si adik eksekutornya, tapi saya yang memberi komando. Termasuk penjualnya juga salah karena dia tidak memberi peringatan untuk tidak meng-update via internet.

Kami langsung mencari-cari cara untuk menyembuhkannya, dengan bantuan Mbah Google tentu saja. Hasilnya, semua situs yang membahas error 003 ini memberikan pernyataan yang bernada sama: ucapkan selamat tinggal pada Wii anda, karena Wii anda.. sudah tak terselamatkan. Belum ada cara untuk bisa sembuh dari penyakit yang satu itu, kecuali.. ganti board (sama saja membeli baru). Dan kami pun menangis meraung-raung…

Sebenarnya sudah sejak lama saya ingin menulis tentang ini di blog, tapi apa daya, terlalu menyakitkan untuk diingat, hahah. Sekarang dengan hati lapang saya menuliskan kisah ini, karena… kisah ini ber-happy ending sodara-sodara! ^^

Dua tahun kemudian, sang Wii masih bersemayam dengan tenang di gudang. Saya dan adik iseng googling tentang perkembangan error 003 ini, dan hasilnya… jeng jerengjeng… error 003 sudah bisa disembuhkan! Walaupun di internet dijelaskan langkah penyembuhannya, tapi kami selaku gamer awam akhirnya memutuskan untuk membawanya kembali ke Mangga Dua, mencari toko yang bisa menghidupkan kembali Wii kami.

Dan akhirnya sejak kemarin, setelah seminggu menginap di Mangga Dua, Wii kami sudah kembali terpasang dengan manis di sebelah televisi ^^. Wiiii!!

Semua berawal dari… ketika saya membaca persyaratan untuk membuat visa, yang menyebutkan bahwa pas-foto harus berlatar belakang warna putih -_-. Sempat terpikir untuk foto ulang *toh sekarang beratnya menurun dibandingkan waktu bikin pas-foto terakhir :D*, tapi kok males ya. Akhirnya memutuskan… di-sotosop saja! ^^ *warna background-nya looh, bukan ‘berat badan’ nya*

Awalnya mau pake tool andalan: Eraser Tool dan Brush Tool *grin*. Ah, tapi… masa Photoshop-nya udah sampe CS5 *btw, saya dapet Photoshop CS5 dari sini*, caranya masih cupu aja. Akhirnya browsing-browsing, dan ketemu video tutorial di sini. Menggunakan fitur baru untuk mengatasi masalah masking yang ribet macam rambut manusia. Memang kalo mau sotosop-an, yang paling ribet memang ngurusin rambut ^^;

Dan hasilnya… *drum roll* benar-benar memuaskan!! Here, take a look…

Detail rambutnya dapet banget, keren! ^^ Bagi yang males nonton video tutorialnya *bagi yang kecepatan inetnya ga oke untuk streaming*, berikut saya berikan petunjuk step-by-step nya… Petunjuknya memang agak panjang, tapi prosesnya benar-benar mudah kok. Enjoy!!

Oh ya, mohon maaf sebelumnya, objek gambar adalah pas-foto saya, jadi kurang menarik ;p. Bukan bermaksud narsis, bukaaan… Tapi karena sekalian praktek sekalian di-capture gitu, ‘sekali mendayung satu dua pulau terlampaui’ bukan begitu? Okay, here we go…

Inilah pas-foto yang akan diubah warna latar belakangnya.

Pertama-tama, mari kita buat background-nya dulu. Shift+Ctrl+N untuk membuat layer baru. Drag layer baru tersebut ke bawah layer pas foto. Untuk memudahkan, sembunyikan dulu layer pas-foto dengan meng-klik simbol mata di sebelah layer pas-foto.

Warna latar belakang yang diminta adalah putih, jadi kita akan mengubah warna layer yang baru dibuat. Klik button ‘Create new fill or adjusment layer’ di kanan bawah, lalu pilih ‘Solid Color…’.

Supaya warna putihnya tidak terlihat… uhmm… terlalu datar, kita beri efek gradasi sedikit. Klik button ‘Add a layer style’ di kanan bawah, lalu pilih ‘Gradient Overlay…’. Ubah-ubah nilainya sampai pas.

Layer background hampir selesai ^^ Supaya bisa di-resize, harus melalui proses raster. Pilih menu ‘Layer – Rasterize – Layer’. Ctrl+T, dan layer background pun bisa diubah sesuka hati. Dengan demikian, layer background selesai sudah :)

Lanjut ke bagian yang paling penting. Pertama-tama, pilih Quick Selection Tool di toolbar sebelah kiri. Lalu drag pada foto perlahan-lahan sampai bagian yang diinginkan sudah ter-select semua. Bisa dilihat, untuk bagian rambut masih belum dapat ter-select secara sempurna. Setelah itu, klik button ‘Refine Edge’ di bagian atas.

Pilih dulu View Mode ke pilihan ‘On Layers (L)’. Dengan demikian, bisa terlihat hasil selection pada langkah sebelumnya, pada layer background. Pinggirannya masih terlihat kasar, dan ada bagian-bagian yang masih berlatar belakang warna merah.

Supaya pinggiran terlihat lebih halus, gunakan fitur Edge Detection. Centang checkbox ‘Smart Radius’, dan atur nilai ‘Radius’ hingga rambut-rambut halus yang awalnya tidak masuk ke dalam selection jadi terlihat.

Pada bagian tengah dan pinggiran rambut, ada yang masih berwarna latar belakang merah *bagian yang dilingkari merah*. Untuk itu, klik button ‘Refine Radius Tool’, dan drag kursor ke bagian-bagian tersebut.

Hasilnya… Merah-merah di tengah rambut itu hilang sudah! *plok plok plok* ^^

Yak, satu langkah lagi… finishing touch. Karena mungkin masih ada nuansa merah-merah di rambut, kita lakukan langkah terakhir. Centang checkbox ‘Decontaminate Colors’, dan atur nilai ‘Amount’ sampai nuansa merah itu hilang. Dan… voila!

Selesai!! :)) Ain’t it easy?

And that is the magic of ‘Refine Edge’ by Adobe Photoshop CS5.

Asik ya, kalau punya asisten pribadi secanggih JARVIS *Just A Rather Very Intelligent System*-nya Tony Stark. Kalau mau nulis blog tinggal dikte aja, ga usah repot-repot ngetik :))

Atau KITT *Knight Industries Two/Three Thousand*-nya Michael Knight, ga perlu deh belajar nyetir, tinggal bilang aja mau ke mana lalu duduk manis ;p Bisa jadi temen ngobrol juga…

Atau Karen Plankton, WIFE *Wired Integrated Female Electroencephalograph*-nya si Plankton, otak di balik rencana-rencana untuk mencuri Krabby Patty, yang tak pernah tak gagal. Btw, emang ga ada ya plankton betina, sampe harus kawin sama komputer??

Yap, semua itu adalah Artificial Intelligent (AI) System, sistem yang memiliki kecerdasan agar dapat melakukan pekerjaan seperti yang dapat dilakukan manusia. Memang ada beberapa persoalan dimana komputer bisa lebih jago dalam menyelesaikannya, biasanya persoalan komputasi. Tapi, masih banyak kondisi dimana komputer masih belum bisa menyamai kemampuan otak manusia.

Salah satunya adalah, bagaimana komputer bisa memahami apa yang kita ucapkan, dan memberikan respons dengan tepat, seperti yang digambarkan oleh film-film di atas *di film, tentu saja respons adalah hasil rekaman sang pengisi suara ;p*. Cabang dari AI yang mempelajari hal ini adalah Natural Language Processing (NLP).

Tercakup di dalam NLP di antaranya:

• Speech Recognition dan Speech Generation, mengubah suara menjadi teks *supaya lebih mudah diproses* dan sebaliknya.
• Question Answering, diberikan pertanyaan dalam bahasa manusia, komputer juga harus mampu menjawab dalam bahasa manusia.
• Machine Translation, menerjemahkan teks ke bahasa lain secara otomatis *kayak Google Translate*.
• Automatic Summarization, membuat summary atau key point dari sebuah teks yang panjang.
• Information Extraction *Tugas Akhir saya ^^v*, mengekstrak secara otomatis informasi terstruktur dari sebuah teks atau dokumen yang tidak terstruktur. Contoh: dari iklan lowongan kerja, bisa diambil secara otomatis informasi perusahaan, posisi/jabatan, deadline aplikasi, dsb.

Nah, salah satu cara supaya komputer bisa memiliki kecerdasan tersebut adalah dengan Machine Learning (ML), alias pembelajaran mesin. OOT dikit, dulu waktu kuliah, mengambil mata kuliah ML kesannya keren, karena bisa bilang “Iya nih, gw mau ML dulu di 7605″ :))

Intinya adalah, bagaimana caranya supaya komputer mampu menghasilkan pengetahuan dari hasil interaksinya dengan lingkungannya dan menyimpannya, agar dapat digunakan untuk menyelesaikan persoalan. Persis seperti yang dapat dilakukan oleh manusia. Jujur, mempelajari bidang ini rasanya kagum berat sama pencipta kita, bisa menciptakan sesuatu yang sangat menakjubkan: otak manusia.

Language and Communication Technologies (LCT) adalah salah satu program yang ditawarkan oleh Erasmus Mundus untuk tahun ajaran 2010-2011, yang mempelajari hal-hal yang disebutkan di atas. Karena tertarik mempelajari hal-hal di atas *dan kesempatan berkeliling Eropa selama 2 tahun ;p*, saya memutuskan mencoba apply.

Sebenarnya ada satu lagi, International Masters in Natural Language Processing and Human Language Technology *fyuhh, panjang*. Tapi, entah kenapa rasanya kurang pede kalau apply untuk program itu *takut saingannya banyak*. Padahal, tak ada salahnya mencoba ya?

I believe that this field has a promising future to develop a technology that will understand human language. And someday we can communicate verbally with computers, just like what we often see only on movies.

… adalah kalimat penutup dari motivation letter a.k.a statement of interest yang saya tulis. Terkadang, imajinasi di dalam film memang menjadi motivasi untuk mengembangkan teknologi di dunia nyata ;). Sebuah bukti bahwa otak kanan juga penting dalam proses berpikir. Betapa keseimbangan antara fungsi otak kanan dan otak kiri sangat dibutuhkan *lagi-lagi kagum berat sama otak manusia >.<*.

Mungkin, kalimat tersebut pulalah yang membuat saya berhasil mendapatkan kunci untuk membuka gerbang salah satu impian… benua Eropa.

(bersambung)

]]> http://paramitopia.com/blog/2010/05/ai-nlp-ml-dan-lct/feed/ 2 http://paramitopia.com/blog/2010/04/24-rooms-of-tiny-apartment/ http://paramitopia.com/blog/2010/04/24-rooms-of-tiny-apartment/#comments Tue, 27 Apr 2010 02:33:19 +0000 paramitopia http://paramitopia.com/blog/?p=1339 For my future reference, if someday I could not afford to buy a big spacious house ;p The magic of architecture and interior design. If only I followed this path of my dream, will I become this brilliantly creative architect?]]>

For my future reference, if someday I could not afford to buy a big spacious house ;p

Click here to view the embedded video.

The magic of architecture and interior design. If only I followed this path of my dream, will I become this brilliantly creative architect?

]]> http://paramitopia.com/blog/2010/04/24-rooms-of-tiny-apartment/feed/ 2