Lanjutan bahasan tentang mockup tools favorit untuk menrancang tampilan antar muka aplikasi, setelah sebelumnya gw udah review irit tentang pencil project ,gw sekarang bakalan bahas tentang koleksi yang bisa di tambahkan.


Pencil Project yang di rilis terahir pada September 2013 memiliki koleksi componen yang kurang mutakhir, tampilan ICS dan iOS nya juga masih yang jadul untuk ukuran 2015 ini ehehe, maka dari itu gw iseng googling nemu beberapa collection tambahan untuk Pencil project yang memperkaya rancangan mockup kita :D

1.@nathanielnw Bootstrap
Sumber: https://github.com/nathanielw/Bootstrap-Pencil-Stencils

2. @nathanielnw Android Lolipop
Sumber: https://github.com/nathanielw/Android-Lollipop-Pencil-Stencils

3. @nathanielnw Material Icons
Sumber: https://github.com/nathanielw/Material-Icons-for-Pencil

4. Stencils and Templates resmi
Sumber: https://code.google.com/p/evoluspencil/downloads/list?q=label%3aStencil

Cara menginstal koleksi grafik baru:

1. Download file zip dari release terahir di github.
2. Di aplikasi Pencil, install file .zip tadi di menu "Tools > Install new collection..."
3. Pastikan opsi "Hide Heavy Elements" di menu View di unceklis

Haiii, kali ini gw bakalan share mockup tools untuk membuat desain user interface dari aplikasi yang akan dibuat, sebenernya ini pengalaman lagi ngerjain skripsi ehehe, dimana untuk membuat rancangan antar muka pengguna kalo menggunakan software grafis macam inkscape, photoshop ataupun corel draw berasa manual dan ribet banget ehehe.

Tapi dengan aplikasi mockup tools yang emang dikhususkan untuk merancang prototype aplikasi bakalan terasa lebih mudah dan cepat, aplikasi yg bisa jadi prototype mockup yang pernah gw coba adalah:

1. microsoft visio (setingkat diatas desain manual, cuma masih ribet, dan berbayar)
2. balsamiq (tampilan nya keren, mudah di pelajari, drag drop yang simple, tapi berbayar)
3. Pencil project (simple, mudah digunakan, dan open source)

Oke gw mau bahas untuk point 3 dari Pencil Project, tools ini sangat memudahkan dalam mendesain antar muka aplikasi yang akan kita buat nanti nya, dengan UI component yang mencukupi untuk desain web sih, buat mencobanya kita bisa download di http://pencil.evolus.vn/Downloads.html

UI component yang tersedia

Cara menggunakannya juga gampang kok, kita tinggal drag-drop collection yang ada di samping kiri ke dalam canvas dan atur dikit langsung jadi sesuai yang ada di imajinasi kita.
Ini contoh screen shot aplikasi pencil di Ubuntu 14.04 gw hehehe :D

Namun dengan rilis terahir dari aplikasi pencil ini di bulan November tahun 2012 lalu mengakibatkan component User Interface nya juga belum update, jadi kaya collection iOS nya masih iOS 6, android nya masih tema Holo di ICS, tapi ada cara juga sih biar collection di pencil bisa di tambahkan dari kontributor, di post berikutnya gw share ya yang gw dapet ehehe

Dan pada akhirnya kita bisa menghasilkan keluaran desain dengan bermacam-macam format seperti:

Sebagai tools gratisan, Pencil Project evolus ini keren banget, dan creatornya adalah orang vietnam loh! ternyata orang Vietnam memiliki tools yang cukup berkontribusi di dunia software open source ini. Terima kasih :D