Sepertinya belum banyak yang nulis tentang Exp.Design, hehe.. Jadi disini saya akan mencoba memfamiliarkan dunia “design” kepada komunitas yang pada umumnya developer, who loves coding more than anything (berlebihan :p). Tujuannya supaya kita sama-sama bisa punya pengetahuan dasar tentang design, karena “design” sangat penting dan erat kaitannya untuk membangun user interface yang menarik. Dan UI yang bagus juga merupakan hal yang dicari-cari dari aplikasi jaman sekarang, juga menjadi aspek penilaian penting untuk kompetisi-kompetisi kayak Imagine Cup, Next GenUX, atopun WPF Champion Competition. That’s why we all love WPF & Silverlight so much, don’t we? :p
Nah, berangkat dari sana, kita semua tahu bahwa tools designer untuk membuat aplikasi WPF dan Silverlight adalah Expression Blend. Lalu apa gunanya Expression Design dong?
- Apa itu Expression Design
Microsoft Expression Design adalah tool ilustrasi yang powerful untuk membuat grafik vektor maupun bitmap yang digunakan untuk project-project baik di Exp. Blend maupun Exp. Web. Expression Design merupakan bagian dari Microsoft Expression Suite dan bukan aplikasi standalone, dan saat ini cuman bisa diinstall di Windows XP/Vista (for Mac users, install vista di virtual machine-nya yaa..hehe).
- Penggunaan Expression Design
Biasanya Expression Design dipake untuk 2 hal: membuat custom web graphic terus diexport ke .JPG/.GIF/.PNG, serta untuk membuat custom UI control terus diexport ke dalam XAML dan bisa dimasukkan langsung ke dalam kanvas project WPF maupun Silverlight di Expression Blend. Jadi disini peran penting Expression Design adalah sebagai penyedia asset-asset grafik yang dibutuhkan :)
Seperti yang kita tahu juga, para designer umumnya jarang menggunakan produk Microsoft karena mereka lebih cinta dan lebih biasa menggunakan Photoshop, Illustrator, maupun Corel (ups :p). Nah kalo menurut saya sendiri semua tergantung kita mau belajarnya apa enggak. Karena kan Expression Design munculnya belakangan dan pastinya kalah populer dari tools design yang udah punya nama.
Yang menjadi kelebihan yang cukup ‘handy’ adalah bisa import file dari Photoshop dan Illustrator secara langsung ke kanvas Expression Design, so we have a nice coordination when we move back and forth between these 3 powerful tools :)
Nah tapi kelebihan utamanya menurut saya adalah fitur export ke native XAML secara langsung ke Blend supaya pembuatan aplikasi WPF/Silverlight bisa jadi lebih mudah. Untuk masalah exporting ini dibahasnya ntar aja kali ya :)
OK, diasumsikan udah pada install Expression Design, jadi langsung aja berangkat ke pengenalan main interfacenya:
Kalo udah pernah atau udah biasa megang dokumen .PSD, .AI, ataupun .CDR pasti cukup familiar dengan panel-panel yang ada. Selain itu yang cukup ‘handy’ lagi adalah shortcut yang dimiliki Expression Design kebanyakan sama dengan yang dipake buat di Photoshop, contohnya V untuk Selection 
, A untuk Direct Selection 
, P untuk Pen 
, B untuk Brush
, T untuk Text 
, dan buat nge-Zoom tinggal scroll in/out mouse Anda, atau seperti di Expression Blend, tinggal gunakan zoom slider di sisi kiri bawah kanvas.
Selain tools diatas ada juga tools lain seperti shape tools (Rectangle, Ellipse, Polygon, Line), Slice, Gradient Transform, Scissors, Color Dropper, Pan & Zoom.
Di panel-panel sebelah kanan hanya ada 2 buah panel, yaitu panel Properties dan panel Layers. Properties dipake untuk mengubah-ubah appearance objek, mulai dari warna, stroke, blending mode yang digunakan, gradient fill, image fill, jenis brush yang digunakan, dsb. Sedangkan panel Layers untuk menampilkan daftar layer yang terdapat pada gambar.
Untuk mulai bermain-main dengan Expression Design, saya sarankan mulailah dari yang simpel-simpel, contohnya membuat strokes, brush, path, shapes, text, sampai nanti baru menanjak ke tingkatan yang lebih tinggi seperti pengaturan layer, clipping path, blending mode, exporting rules, gimana cara membuat UI custom control yang ciamik, dll.
So, bertahap yaa…
Oiya, satu hal lagi. Kalo udah bikin sesuatu di Exp. Design ini maka ekstensi filenya menjadi something.design
Cheers! :)