514. Perlukah UI designer mengetahui logika pemrograman?

Maaf sebelumnya, saya baru dengan Hal UI ( user interface ), tetapi pernah mencoba membuat app Android. pada saat belajar coding, saya selalui di hantui dengan UI yang baik(Full Stack). Jadi lebih banyak mikirin UI nya daripada coding nya hehehehe.
pertanyaan saya, untuk UI sendiri, apakah hanya memikirkan dari User Interface nya saja? tanpa harus memikirkan bagaimana si programmer mengcoding dari design UI kita?

Salam kenal dan mohon solusinya, Terima kasih…

Jawaban Aku;

PERLUUU BANGEET!
kenapa banyak desain di Dribbble ga jadi kenyataan di dunia nyata adalah sulitnya membuat logic untuk interaksi dan desain seperti di desain tsb.

Desain yang indah-indah di lihat belom tentu performanya bagus.

Kalau performanya bagus pun, belum tentu ada library yang bisa bikin seperti itu. Ini artinya programmer harus bikin library custom. Alias bikin library versi sendiri.

Di tengah mepetnya waktu development app atau web, worth it ga sih programmer ngerjain yang kayak gtu?

Apakah dengan desain seperti itu sudah di validasi akan memberikan hasil yang setimpal dengan pengerjannya?

Klo aku sih dulu banyak baca-baca guideline dari tiap OS. Supaya desain dan komponen yang di buat sama dengan standar yg ada. Sampai nama icon dan penamaan button dan typografi disamakan. Klo uda hafal baru deh, modif-modif sesuai selera.

Semoga bisa membantu yah.

513. Link Referensi UI favorit sebagai Inspirasi.

customers users color wheel
Photo by Kaboompics .com on Pexels.com

Sebagai Designer kan kita pastinya butuh referensi sebelum mendesain. Dimana sih sebaiknya kita mencari inspirasi dan referensi UI ( user interface ) untuk projek ? Berikut ini beberapa link yang Aku harapkan bisa membantu proses pengerjaan kalian. Cuman jadi inspirasi yah dan jangan di contek abis-abisan.

Berikut ini list web untuk inspirasi UI.

  1. Dribbble
  2. Behance
  3. Pinterest
  4. Site Inspire
  5. Lapa Ninja
  6. UI-Patterns
  7. Mobile Pattern
  8. Inspired UI
  9. UX Archive
  10. Land Book
  11. Uplabs Android
  12. Uplabs iOS

Referensi untuk micro interaction bagi web atau app Anda.
http://littlebigdetails.com

Buat yang mau iseng2 bikin mock up movie app (Seperti tugas kursus Android level 2 yang saya jalani ) ini ada web yang menyediakan resource poster-poster  film secara high res+ info filmnya. Nama pemain, durasi,genre,sinopsis. Smga bsa menginspirasi dan berguna yah.

https://www.cinematerial.com/

Buat yang nyari kombo Gradasi keren2 dan variatif. Cek ini gan!
https://uigradients.com/

 

 

 

512. Bagaimana menentukan hourly rate kita sebagai UX Designer?

Forum UI desainer dari Indonesia nan Kece Badai
Contoh UI design yang nge animasiin. ini ceritanya membayangkan kontrol scrolling pake mata.

Pertanyaannya;

“Jadi gini , saya baru aja dapet tawaran pekerjaan berupa desain web . Dan klien menanyakan tentang pembayaran hourly rate saya berapaa? nah berhubung saya juga baru dalam hal ini ( UI & UX Design ) , bagaimana sih nentuin harga yang pas untuk perjamnya? terlebih ini adalah projek pertama saya dalam UI & UX

Terimakasih!! :smile:

 

Sebagai UX desainer kita bisa pakai web seperti ini untuk menentukan harga per jam kita ; http://thenuschool.com/how-much/

Salah satu cara paling gampangnya lihat aja di web freelancing hourly rate designer Indonesia,Malay &Singapur berapa? Nanti di pilih aja jalan tengahnya harga berapa. untuk menambah keyakinan klien, Aku sarankan untuk memberikan link portfolio dan LinkedIn kalian. Di portfolio juga harus di jelaskan prosesnya dan dampak dari solusi kalian. Apa saja metriks yang naik?

Selain itu, di kontrak harus jelas sih scoop of work nya apa aja. Apa yang d kerjakan dan deliverables nya jelas apa aja dan seperti gimana. Di luar itu kalau nambah jam, yah bilangin ke klien. Kalau misalnya revisinya lebih dari 4jam pengerjaan d tambah charge harga 4jam+70%.

Supaya ga revisi mulu.

Semoga membantu 🙂

511. Bagaimana pendapat anda tentang Desain UI /UX pada Enterprise Software?

Ada seorang desainer bertanya;

“Halo, selamat malam teman2..
saya pengen tau pedapat teman2 soal UI design pada Enterprise Software (contoh : Enterprise Resource Planning / ERP) yang menurut saya peribadi kurang menarik dan tidak mengikuti trend desain yg lagi hipe pada saat ini. Begitupun dengan UX bagi saya sangat membingungkan ketika digunakan.

Contoh Software ERP

bagaimana pendapat teman2 sekalian :) terimakasih.”

Bagaimana pendapat anda tentang Desain UI /UX pada Enterprise Software?
Tampilan UI dari salah satu aplikasi enterprise.

Kalau menurut Saya ada 2 poin penting mengapa interface yg d attach mas untuk jasa enterprise seperti itu ( terkesan jadul dan tidak mengikuti zaman).

  1. Hardware&Software Minimum Requirement;

Hal minimum requirement ini lumrah banget buat software PC dan bahkan App (cuman app jarang d tampilin aja). Klo software PC kan biasanya ada tuh d belakang DVDnya,l.

Kenapa tampilannya jadul gtu karena, yah mungkin di minimumnya mereka harus support windows 7 kebawah. Akhirnya merekapun mendesain dengan icon dan library yang sudah ada karena, klo bikin custom akan membuat program berat.

Software enterprise kebanyakan native karena, klo web pasti lebih sering error nya dan ga bisa offline. Walaupun mengandalkan PWA ( Progressive Web App ) namun, belum bisa menyimpan data dan melakukan fungsi komputasi yang berat.

Sebenernya hal ini terjadi jga d Android. Dimana klo qta memaksakan gaya material design ke OS sebelom Lollipop maka harus pake library khusus dan jadinya aplikasi itu performanya ga se lancar yg Android OS lollipop.

Btw lanjut ke yg tdi,Kenapa mendesain untuk Windows 7 kebawah?

karena, usernya masih banyak yg pakai hardware dengan OS itu.

Sebagai contoh di perusahaan Saya kerja akuntan, orang legal dan pajak masih banyak loh yang pake software dan OS jadul karena, yah udah banyak datanya disana. Bagi mereka stabilitas lebih penting daripada tampilan terkini. (Padahal desainer dan progammernya udah kekinian banget software dan hardware nya).

  1. Kebiasaan User (User behavior)

    Sangat susah mengubah kebiasaan user yang bertahun-tahun dan setiap hari,pake software enterprise Anda. Contoh kasusnya;

Photoshop (PS)

PS kan software desain paling kece dan bisa ribet lah nge desain dsana. Desainer pembuat PS pun pastinya kece2 tapi, kenapa icon2 san tampilan UI PS kok gtu2 aja ya?

Ga ada soft gradientnya. Icon nya ga yg tipis2 outline doank? Gak ada hamburger menu ato carouselnya? Fontnya ga jadi Bold bgt? Dsb.

Untuk mengubah information architecture atau bahkan lokasi dari tools di software yang sudah dipakai bertahun2 itu memang perjuangan banget. Mereka lebih resisten terhadadap perubahan karena, sudah nyaman seperti itu.

Makanya Adobe daripada ubah PS capek-capek, lebih baik membuat produk baru yakni Adobe bikin XD. hehe.

 

 

510. Bagaimana Alur produksi apps?

Bagaimana Alur produksi apps?
Bagaimana Alur produksi apps?

Ada pertanyaan dari Seorang UX designer bernama Yoga;

“Mau tanya, mudah2an gak salah tempat
Di tempat temen2 bekerja, ketika pembuatan atau penambahan fitur baru di apps biasanya alur produksinya seperti apa?, boleh alur secara umum yang melibatkan posisi yang berbeda atau secara spesifik untuk UI/UX aja.
Mohon masukan dan pencerahannya

thank you”

 

Jawaban dari Aku;

Klo aku sih biasanya;

  1. Di mulai dari masalahnya; biasanya dpet laporan dari klien, PM ato tim Data.
  2. UX riset. Masalahnya apa dan kenapa bsa terjadi? (Kenapa nya ini harus ke lapangan dan tanya user sih).
  3. Bikin low fidelity,prototype dan validasi. Tes prototype ke user. Prototypenya bisa pakai Invision , Marvel atau Overflow. Darisana di lihat, masalahnya ke jawab ga dengan prototype itu? Klo enggak d ulangi langkah 2 dan 3.
  4. Bikin high fidelity + dokumentasi nya.
  5. QA ( Quality Assurance) sebelum di launching. Disini Designer membantu QA untuk mengecek fungsionalitas app dan kecocokan high fidelity dan implementasi sebenarnya.
  6. Udah launching di track / ukur mana yang kurang mana yang udah bagus.  Ulangi dari 1 deh.

 

Berikut ini beberapa dokumentasi yang biasanya di buat selama proses pembuatan App dari segi Desainer.

1. Persona+user story
2. Product Req Document( coba googling deh).
3. Hasil riset UX dari data analitik, video user testing, hasil wawancara. Prototype (klo AB testing)
4. Information Architecture, site map & user flow.
5. Low fidelity wireframe+ annotation+ reasoningnya
6. Style ato guideline (kalau belom ada)
7. High fidelity + animasi klo mau ngejelasin fitur tertentu. Ato prototypenya yg high fidelity. 
8. UI measurement dan komponen. kayak pake zeplin tapi d bentuk dokumen biar lebih terdokumentasi alias ada dokumentasinya klo zeplinnya ke apus ato ga pake zeplin lagi (di kerjain pas nge QA sih biasanya, selama mau develop ato kasih programmer pake zeplin aja).

Ada juga Beberapa contohnya kayak di slide saya di bawah ini sih. Kesemua dokumentasi ini di butuhkan untuk pengembangan selanjutnya. Apalagi kalau kita mau menambah jumlah orang di dalam tim, dengan dokumentasi ini bisa membantu mempercepat proses membuat app.

509. Perlukah perfeksionisme dalam mendesain?

Pertanyaan dari mas Dwinawan;

“Share pendapat yuk… kira kira perlu enggak ya mengedepankan perfeksionisme saat membuat sebuah design?. Memperhitungkan setiap elemen dari yang paling kecil hingga ke paling besar, memastikan semuanya sempurna baru diperlihatkan atau di deliver ke stakeholder.

Gimana menurut pendapat teman-teman? :D

Jawaban dari Saya;
Menurut saya sih ga usah perfeksionis-perfeksionis banget yah mas. Kalau prinsipinya Agile, yg penting bsa d kasih user dan dapat masukan secepat2nya.

Ttg perfeksionis ini, dulu Saya pernah d ceritain oleh teman saya yg ilustrator. Dulu ada 1 gambar yg dia bikin detail bangeeeeet, pas umur 8 dia pamer dan bangganya luar biasa. Pas umur 15 gambarnya itu dinilai jeleeeek banget oleh dia. Dia pun bikin gambar yg lebih keren , detil dan sampe menang lomba dengan gambar itu.

Di umur 23(udah masuk kuliah seni rupa) dia malu sendiri kalau nunjukin gambar yg dia bikin d umur 15 tahun. Menurut dia, ini gambar apaaaaaaa banget. Jadi pesan moralnya:

‘Perfect’ di saat ini,belum tentu sempurna untuk di 2-3 tahun mendatang.

Apalagi user kita pasti berubah. Berubah preferensi, berubah paradigmanya dan berubah perilakunya.

508. Portfolio UI/UX untuk Freshgraduate ?

Portfolio UI/UX untuk Freshgraduate ?
Portfolio UI/UX untuk Freshgraduate ?

Ada seorang junior yang bertanya dan mau berkecimpung di bidang UX Desain. Kebetulan beliau adalah mahasiswa yang baru lulus. berikut ini pertanyaannya;

“Hai semua, adakah saran bagaimanakah portfolio UI/UX design yg baik untuk pemula/fresh graduate, sebagai bahan penilaian dan pertimbangan untuk diterima di perusahaan yang membutuhkan UI/UX designer? Apakah hanya melampirkan hasil design tanpa proses pembuatan belum cukup? Terima kasih :)

jawaban dari Aku;

Kalau portfolio UX designer itu kadang tergantung yang wawancara juga yah. Ada yang suka:

  1. Tipe 1: Porto 1 projek aja tapi di jelaskan detail, mendalam dan signifikan. Gimana proses dari awal sampe akhirnya di jelaskan. Disini biasanya interviewernya nanya2 persona, riset metodologi yang digunakan, kualitatif & kuantitatifnya gimana. terus bagaimana kamu ngolah data nya sampe jadi wireframe dan high fidelity. (maaf yah pake banyak istilah bahas inggris)
  2. Tipe 2: 1 porto banyak projek. Disini di kasih liat aja rangkuman dari proses desainnya dari riset, bikin user flow, wireframe dan high fidelity. Kalau yang ini 1 projek yah seperti trailer aja. kalau tipe pertama kan kaya 1 film penuh.

Kalau aku sih prefer tipe ke dua ya. Nanti prosesnya gimana bakal di tanya waktu interview. Soalnya Aku yang review porto biasanya ada kerjaan lain juga dan ga ada banyak waktu baca-baca,hehe.

  1. Hal yang perlu di perhatikan:
    1. Pastikan yang masuk porto sebaiknya projek yang nyata (Real). Karena banyak bedanya ngerjain projek yang bener-bener di implementasikan dengan projek2 eksplorasi redesign (kaya di Dribbble). Supaya dapet banyak projek yang nyata mulailah proyekan, bantu non-profit organization, himpunan mahasiswa atau ikut komunitas. ATAU magang di startup yang baru. Kenapa di startup yang baru? karena disana kemungkinan besar bisa mengerjakan dari awal hingga akhir. kalau yang udah gede biasanya cuman sebagian-sebagian doank.
  2. Aku sarankan tiap tahun bikin porto PDF karena, banyak perusahaan minta PDFnya gitu. Kalau ada porto online kayak Behance lebih bagus lagi. Cuman fokus bikin PDFnya aja dulu. Ukuran PDFnya sebisa mungkin di bawah 10Mb (kalau aku di optimize nya pake InDesign trus pake Acrobat Pro. Ribet sih. Tapi belum nemu cara sederhana buat ngecilin PDF selain dengan 2 tools itu di gabung).
  3. Gunakan bahasa Inggris di portfolionya. Banyak interviewer bukan orang Indonesia soalnya.
  4. Jangan lupa taruh kontak email dan no telp + LinkedIn di akhir porto.
  5. Selamat mencoba.

 

Sebisa mungkin projeknya nyata supaya, solusi yang di buat benar-benar memecahkan masalah yang ada. Kamu bisa coba ikutan lomba seperti hackathon atau Top Coder. Kalau projeknya beneran juga, sebagai UI designer kamu bakal lebih memikirkan secara teknis apakah UInya bisa di implementasi dengan deadline yang ada dan tentunya ukuran-ukuran pastinya di setiap UI nya. Bukan cuman UI yang keren doank .

Semoga bisa membantu.