Akhir 2009 ada ajakan dari temanmacet untuk ngobrol bareng mengenai web desain, pesan tersebut dikirim melalui twitter kepada @zamdesign @icreativelabs dan @madeforyou. Saya dan Richard menyanggupi, sedangkan Anggi Krisna (@icreativelabs) menawarkan saya saja (karena masih sama-sama mewakili iCreativeLabs).

Selanjutnya rencana ngobrol tersebut berlanjut melalui email, sebagai pengantar Ronald mengirimkan beberapa pertanyaan. Berikut pertanyaan sekaligus balasan dari saya melalui email:

Halo Richard dan Zam,

Halo Ronald Widha,

Teman macet ini podcast mingguan tentang programming dan informatika. Alasan kenapa aku nge-approach kalian berdua karena dapet request suruh ngebahas soal web design dari bbrp pendengar teman macet. Dan kalian adalah nama2 yang direkomendasi untuk jadi nara sumber di topik ini.

Terimakasih yah, hehe ternyata ada yang merekomendasikan nama saya :)

Eniwei..tentunya kalian sudha menyadari betawa integralnya posisi diri kalian di sebuah software, terutama web development. Aku ingin mengangkat ke permukaan sudut pandang UX designer dengan harapan developer bisa lebih menghargai perspektif kalian.

Kebetulan Richard spesialisasinya di desain mock up website, desain dari draft sampai contoh preview di PSD (Photoshop) atau PNG (Fireworks). Sedangkan saya spesialisasinya di slicing XHTML/CSS, dari mengkonversi file mock up (PSD/PNG) sampai crossbrowsing, untuk selanjutnya file diserahkan ke bagian programmer / developer. Dan CSS framework, seperti 960.gs selain dipakai di tahap XHTML/CSS (saya) juga dipakai di tahap mockup (Richard)

pembukaan: apa masalah yang kalian biasa hadapi sebagai ux designer dalam bikin web application? misalnya: constrain platform web, interaksi sama programmer, browser compatibility, atau apa?

sejauh ada komunikasi yang baik antaranggota tim saya kira tidak ada masalah soal interaksi dengan programmer /developer, kemudian soal membuat desain website yang crossbrowsing, crossplatform, memperhatikan usability dan aksesibility, semantik markup (standart w3c) saya pikir itu bukan masalah, tetapi sebuah tantangan yang memacu kita untuk terus belajar.

apa konsep grid system ini? apa tujuannya?

konsep grid system sebenarnya tidak hanya berlaku di website, konsep tersebut sudah di pakai dalam desain cetak, contohnya: surat kabar/koran, majalah, brosur, pamflet, dll. grid system merupakan konsep desain struktur layout yang mengatur tata letak text dan gambar secara vertikal (kolom-kolom) maupun secara horizontal. tujuannya: membuat tampilan layout menjadi rapi, teratur, imbang, (fleksibel jika diterapkan di berbagai pola layout) serta memberi kemudahan pandangan mata, sehingga pesan lebih mudah diterima oleh pembaca.

gimana bisa diaplikasikan ke web?

penerapan konsep grid system dalam website diatur melalui kode XHTML dan styling CSS. tetapi sebelum langkah tersebut, terlebih dulu harus dibuatkan draft mockup melalui software grafis (Photoshop atau Fireworks) untuk memudahkan dan mengefektifkan proses desain (pembuatan) website.

pernah denger 960.gs? golden grid? 1kb grid? simple grid system? apakah ini membantu proses design, apa membatasi?

pernah, sekarang sudah banyak. Beberapa contoh yang disebutkan tadi termasuk dalam CSS framework. CSS framework adalah paket kode CSS/XHTML sebagai acuan dasar membuat web, sehingga kita tidak perlu lagi menulis kode web dari NOL. rata-rata CSS framework memakai konsep grid system. Apakah ini membantu atau membatasi? jawabannya relatif karena tergantung masing-masing designer.

pernah pake http://960.gs/ ga? menurut kalian gimana?

pernah pakai 960.gs menurut saya pribadi ini CSS frame work yang paling bagus, karena selain menyediakan paket kode XHTML/CSS juga menyediakan file template PSD/PNG dll sebagai acuan Mockup. Cocok untuk kerja tim

Untuk mendengarkan hasil rekaman obrolan ini silahkan menyimak di website temanmacet edisi #28 (diposting 4 januari 2009). Mohon masukan dan koreksi jika ada yang salah atau kurang :) semoga bermanfaat.