Archive for the 'design' Category

Mengapa Harus Ganti Theme Blog Dan Mengapa Tidak?

Saya tidak suka gonta-ganti theme tampilan blog.

Alasannya sederhana:

  1. Branding. Tampilan itu mencerminkan brand. Identitas. Saya tidak suka ganti identitas (*kecuali kalau browsing, maka itu saya adalah pemuja TOR, haha*). Identitas itu perlu. Bukan hanya perlu ada, melainkan juga perlu dibangun. Salah satu cara membangun identitas adalah memiliki branding yang kuat. Kalau tidak punya branding yang kuat secara visual, maka sebaiknya memiliki branding yang memiliki ketahanan kuantitas waktu
  2. Sok Unik Tapi Malas. Ini alasan yang paling jujur. Saya biasanya malas ngoprek script lagi. Saya bosan ngoding. Seharian ngoding, malamnya ngoding lagi. Begadang temannya teh, musik klasik, LAMPP/XAMPP dan gedit/notepad++ hanya buat ngoding. Tapi kalau tidak ngoprek scripts maka tampilan web standar banget. Apa uniknya kalau cuma copy paste theme orang? Apa kekuatan usability web kita kalau cuma sekedar pakai yang sudah jadi? Maka itu harus unik dong… Tapi itu yaa itu penyakitnya, males… Hehehe
  3. Usability. Saya ganti tampilan atau feature web kalau memang saya sendiri sudah gerah dengan usability web saya. Kalau saya gerah, sih masih bisa kipas-kipas. Tapi kalau pengunjung sudah gerah, wah gawat itu. Makin dikipas makin gede apinya. Pengunjung sudah biasa mampir ke web kita. Dari mereka kita belajar UI/UX. Kalau gonta-ganti theme tanpa rekomendasi mereka, sebaiknya saya memang nggak ganti tampilan lah. Lah saya kan dandan buat pengunjung saya :)
  4. Security. ganti theme itu artinya ganti segala macem. Paling enak sih bikin theme sendiri. Semuanya sudah kita jamin keamanannya. Lah saya kan males. Paling saya ambil theme orang terus saya kulik sedikit script-scriptnya. Padahal, seharusnya kan butuh testing. Mulai dari testing di development, QA dan juga di production. Itu baru testing design dan usability, belum testing security. Belum lagi audit dan review. Waaahhh… pecah kepala kalau tiap ada waktu luang hanya ada untuk test
  5. Nggak Cukup Waktu. Pernah dengar database? Kalau pernah pasti pernah dengar backup database dong? Nahh, ini pula jangan dikecilkan peranannya. Backup database, menyimpannya di tempat aman terus melakukan analisa ini memakan waktu yang tidak sedikit loh. padahal backup database dari blog bukan sesuatu yang sulit dan memakan waktu banyak. Tapi jika setiap hari waktu Anda sudah dimakan oleh kegiatan lainnnya di atas, maka backup database bisa jadi salah satu resource hog tambahan.
  6. Biaya. Ini salah satu pertimbangan penting juga sih. Sebenarnya gonta-ganti theme sama sekali tidak makan biaya. Tapi ketika sedang ngoprek theme terus kepincut dengan theme yang berat loadingnya, mau ga mau kan makan bandwith buat pengunjung dan server. Bandwith lebih itu artinya yaa biaya buat kita sebagai penyedia layanan web dan juga pengunjung yang datang mampir ke web kita. Saya malas membebani pengunjung saya dengan biaya tambahan akibat web saya susah ditampilkan di browser mereka gara-gara berat tampilannya. Tulisan saya sudah dibaca saja sukurnya bukan main :)

Tapi… Tapiii… Hari ini baru saja saya update/ganti theme baru di blog lab ini dan blog utama di bangaip.org.

Alasannya:

  1. Demi Pengunjung. Beberapa orang pengunjung yang juga teman-teman saya (diantaranya Pak Harry Sufehmi) memberi tahu mengenai usability theme saya yang melemah. Wah ini masukan yang berguna sekali. Saya usahakan selalu memenuhi kebutuhan pengunjung blog saya. Sebab dari tangan mereka lah user experience kita jadi bertambah.
  2. Interface. Saya tidak bosan dengan tampilan yang lama. Sama sekali tidak. Tapi saya menginginkan tampilan yang secara disain lebih minimalis. Ketika usia makin bertambah begini dan setiap hari berurusan dengan disain minimalis, saya menginginkan pula interface yang minimalis. Prinsip baru less is more sudah beberapa tahun belakangan ini mendasari kegiatan saya dalam mendisain. Makin sedikit distraksi pada tampilan web, makin konsentrasi pengunjung saya terhadap konten web.
  3. Ada Fasilitas. Hahaha. Saya kebetulan punya waktu beberapa jam hari ini untuk ngoprek theme web. Saya pergunakan lah sebaik-baiknya. Jarang sekali punya kesempatan waktu dari makan siang sampai sore begini untuk ngoprek web pribadi. Selain itu, saya kebetulan kerja dengan beberapa OS sekaligus hari ini. Jadi selain bisa cek tampilan UI saya juga bisa mengecek security dan desain di bawah beberapa browser dan platform system sekaligus.
  4. Future Proof. Kata teman saya Toni, kalau mau beli televisi jangan setiap tiga tahun sekali, rugi itu namanya. Simpelnya, kalau mau sesuatu yang bertahan di masa depan maka harus tahu bagaimana strateginya. Saya cari theme yang sederhana dan minimalis sebab memang sudah terbukti kalau minimalis itu selain mudah diingat, mudah dioprek, mudah ditambahi dan juga (kadang-kadang) mudah penggunaannya. Jadi kalau saya pakai theme sederhana dan minimalis saat ini, saya harap di kemudian hari nanti tidak terkesan out of date. Terlalu kuno untuk ditampilkan di muka publik.
  5. Terapi Ingatan. Kemampuan manusia mengingat itu tidak canggih. Kemampuan saya mengingat, lebih parah daripada manusia kebanyakan. Dengan melakukan gerakan-gerakan koding hari ini saya dipaksa kembali mengeluarkan jurus-jurus PHP dan CSS dalam mencapai tujuan. Ini bagus buat kordinasi otak saya, hehe. Moga-moga dengan mengoprek script kita bisa belajar melawan lupa. Amiin…

Yang lebih syukur dari semua ini adalah… Saya bisa update blog laboratorium ini lagi. Hehehe.

Memahami Dasar CSS versi Lie

foto Håkon Wium LieSaya telat, baru baca tesisnya Håkon Wium Lie. Ini tesis keren sekali. Judulnya Cascading Style Sheets. Iya benar, CSS. Asal mula dan bagaimana terbentuknya CSS ada di sini.

Kenapa telat?

Nggak, saya nggak begitu telat. Saya sudah baca bukunya Lie yang edisi pertama Cascading Style Sheets: Designing for the Web. Buku ini penting buat awal-awal perkembangan membuat sketsa design dan menentukan arsitektural website. Buku ini memang implementasi dari tesisnya Lie.

Loh jadi kenapa telat?

Iya, saya telat tahu kalau buku itu punya versi html dan pdf nya yang bisa dibaca gratis. Kalau tahu begini mah, ngapain juga dulu maksa-maksa kantor beliin buku itu. Hahaha. Mungkin gara-gara saya nggak mau rugi kali yaah. Hahaha.

Untuk teman-teman yang berminat membaca tesisnya Lie, silahkan ke link berikut ini:
HTML: http://people.opera.com/howcome/2006/phd/
PDF: http://people.opera.com/howcome/2006/phd/css.pdf

Lebih lanjut mengenai Lie yang juga bosnya Opera (yang internet browser, bukan yang nyanyi)… Berikut ini kutipan beliau mengenai dirinya sendirinya:

“So, somewhat by accident, I was the first person to type the now ubiquitous string “HTML 3.2” into a computer. A few small key strokes for a man, a giant leap for the web.”

Yang Baru Dari Photoshop CS5

photoshop cs5 loader image

Sehari-hari saya pakai Adobe Photoshop CS3.

Sebenarnya sih bukan hanya Photoshop, melainkan seluruh produk Adobe yang berbasis MacOS. Mulai dari mengolah animasi 2 dimensi atau menjajal script xml terbaru dengan Flash hingga mengolah data berbasis vector dengan illustrator atau indesign.

Semuanya dilakukan atas nama pendukung kerja.

Jika sedang iseng, saya melakukan manipulasi foto-foto yang sengaja atau tanpa sengaja terjepret kamera; pun dengan produk Adobe yang bernama Photoshop ini.

Ketika ada alternatif baru pemanipulasi foto sumber terbuka (open source) seperti The Gimp, saya pun sempat berpaling hati. Semua komputer di rumah lalu di install The Gimp. Kecuali komputer istri, masih memakai Photoshop 6, hehe

Saya memang menyukai Photoshop. Cerita kilas balik, tahun 1998 itu kami pakai Photoshop 5. Wah, jaman itu sudah hebat betul pakai Photoshop 5. Itu pengolah gambar paling top deh. Saya sempat terkagum-kagum dengan palet History-nya Photoshop. Gila! Kalau salah design, bisa diulang sampai dari awal apabila kita memakai palet itu.

Namun secara pribadi, pertama kali beli software pengolah image, yaa produk Adobe ini. Kalau tidak salah, harga akhir tahun 2000 itu sekitaran US$ 300-400. Saya beli Adobe Photoshop 6.0. Itu pun setelah memutuskan untuk berkarir di dunia arsitektur dan pembangunan website (sebab baru dan mengasyikkan. Plus booming dot com)

Mahal? Iya lah. Buat kantong saya saat itu memang mahal. Apalagi saat itu masih jadi mahasiswa Depok yang tinggal di Kukusan Beji yang bau sapi.

Uang tabungan setahun, habis semua. Sampai gagal liburan. Semuanya demi nafsu memiliki si Photoshop 6.0 ini. Hehe. Namun begitu melihat ada banyak sekali efek-efek ajaib seperti Liquify dan Rough Grain yang bisa dihasilkan Photoshop, saya pun akhirnya bisa tersenyum.

Keputusan beli Photoshop 6.0, saat itu memang didorong oleh bahwa versi 5.5 sudah bisa melakukan ‘save for web’. Kompresi gambar agar menjadi lebih ramah di laman-laman website. Satu image 300 kb bisa di ‘minimalisir’ menjadi 100 kb hanya dengan menekan tombol yang tepat.

Waktu itu, masalah jumlah kilobyte perhalaman website memang sungguh masalah yang luar biasa. Maklum, koneksi internet di Indonesia masih sekitar 10-20 Kbps (kadang bisa ngedrop sampai 2-5 kbps di pinggir JKT). Jadi orang-orang suka mematikan fasilitas menunjukkan image pada browser mereka.

Pada Photoshop 6.0 navigasi web juga mampu didukung oleh penggunaan transparansi ikon-ikon berbasis GIF. Jika di HTML kode warna ditandai oleh #****** (bagian * diisi oleh karakter angka dan huruf) maka di Photoshop 6.0 sudah bisa kita lihat bahwa #99333 itu adalah merah maroon. Sebab secara otomatis Photoshop telah menterjemahkan warna itu menjadi kode karakter HTML. Berguna sekali untuk kerja saya.

Pokoknya versi 6.0 itu lumayan top deh saat itu. Jadi saya memutuskan untuk membelinya.

Sayangnya, kemajuan teknologi berlangsung cepat. Jauh lebih cepat daripada yang saya kira. Versi Photoshop cepat berganti modern, membutuhkan RAM dan kartu grafis baru. Maka ketika teman-teman desainer/developer lainnya bicara versi terbaru Photoshop CS, saya masih tergagap-gagap menanggapinya. Maklum, masih pakai versi 6.0, Hahaha.

Namun sejak Adobe memulai kode CS2 nya, pelan-pelan saya mulai menggali kembali arti sejati Photoshop itu sendiri (haihi, bahasanya jijay banget).

Sejak Adobe CS 2, kebetulan saya sudah dapat rejeki. Bekerja di tempat-tempat yang memberikan saya fasilitas menggunakan Adobe secara cuma-cuma. Jadi, tidak harus beli sendiri lagi.

(*Walaupun pada CS3, ternyata saya harus menganggarkan budget khusus untuk itu, namun tetap saja tempat kerja yang membayar. Waktu itu, 2007, dijual masih harga-harga awal. Kami beli sekitar € 2300 untuk 3 lisensi Adobe, plus acrobat pro, berbasis Mac OS. Lumayan juga. Sebab teknologi cloud sudah memungkinkan untuk rekan kerja kami yang berjarak 12 jam kerja untuk bekerja di komputer yang sama. Eh ternyata pakai cloud ga boleh sama Adobe. Halah*)

Pas tulisan ini turun, Adobe sudah versi CS 5. Begitu pula dengan Photoshopnya. Kalau ditanya apa yang baru? Well, saya mah akan menjawab; kalau dibanding Photoshop 6.0 yaa jelas sudah banyak berbeda. Haha.

Sejak CS 4, setting palet photoshop jadi lebih asik. Artist toolbox keren. Sudah bisa pindah-pindah User Interface, jadi kalau mau kerja ngedesign, ngelukis atau maen 3D, jadi lebih mudah. Trus ada fasilitas vibrance, yang nge-boost warna. Jadi memudahkan main-main di saturasi dan kekontrasan warna. Lumayan lah untuk fotografer wannabe kayak saya ini. Hehe.

Waktu melihat bahwa kita bisa pindah UI, saya dalam hati membatin; wah keren nih, kayak MyEclipse Java Enterprise. Maklum sehari-hari, saya juga berurusan dengan perangkat lunak tersebut dan nyaman dengan kemudahannya mengganti UI. Di MyEclipse saya, mudah untuk ganti UI dari web dev AJAX, Team Synch hingga SVN Repository exploring. CS4 pun begitu. Nyaman mengganti UI.

Di CS 5, Photoshop sudah pakai fasilitas review (namanya ‘creative review’). Edan! Jadi hasil karya kita bisa langsung pitching ke client langsung. Jadi client bisa koreksi secara real time. Well, real time? Yaah tergantung koneksi internet sih. Hehe. Kalau client dan designer sama-sama pakai koneksi internet UPC 120/10 mbps DL/UL, yaa emang pitching dan review-nya udah kayak real time.

(*Yang doyan 3D dan main-main di image HD format, photoshop CS5 trick bisa di lihat di sini untuk Repousse atau di web official-nya langsung di sini sebab CS 5 ini katanya bisa bikin image kita jadi 3D. Silahkan baca di Sounas ini untuk keterangan lebih lanjut*)

Yang aneh, di software yang harga lisensi per-mesin nya sekitar € 630 ini masih juga belum bisa menemukan kompresi untuk menekan gambar-gambar yang akan kita masukkan ke laman-laman web menjadi lebih rendah. Artinya, teknologi kompresi image di Photoshop sama sekali belum berubah sejak Photoshop 6.0.

Saya hanya mencoba versi trial selama 1 bulan dengan software ini. Setelah itu, balik lagi ke CS3 untuk bekerja atau The Gimp untuk keperluan harian. Kalau kompresi image masih sama dan hanya itu yang saya butuhkan, buat apa beli?

(*Ahh tapi itu kan pendapat saya. Belum tentu anda yang trendi suka pendapat ini. Hehe*)