Bermula dengan Reka Bentuk UX dalam lakaran

Buku asas untuk pelajar pereka dan pelajar UX yang baru

Kami telah menulis banyak mengenai tip-tip lakaran di Alat Kuasa UX dalam tempoh dua tahun yang lalu dan saya ingin menganjurkannya dengan cara yang akan membantu pereka yang baru mula masuk ke UX.

Saya juga harus menyatakan bahawa saya tidak akan memperdebatkan alat yang terbaik - saya hanya akan menganggap anda telah menyedari Sketch adalah yang terbaik (sekarang) dan ingin tahu cara menggunakannya sebagai Pereka UX ィ

Saya telah memecahkan artikel kami ke dalam 5 bahagian yang memaparkan bagaimana saya berfikir pereka baru maju dari orang baru ke penguasaan:

  • Mendapatkan Idea Keluar
  • Bermula
  • Mendapatkan lebih cepat
  • Mendapatkan Lebih Pintar
  • Mendapatkan Visual

Mendapatkan idea

Reka bentuk UX bermula sebelum anda sampai ke alat - ia bermula pada titik mendapatkan idea dari kepala anda (... ia benar-benar bermula sebelum itu dengan penyelidikan, tapi teruskan artikel ini di bawah 20 minit lama).

Diakui, saya melompat terus ke alat digital cukup awal. Tetapi itu sebahagian besarnya kerana saya melakukan lebih banyak di kepala saya dan melukis bersama-sama di papan putih dengan pasukan reka bentuk saya. Pereka UX yang baru bermula harus benar-benar kekal dalam kesetiaan rendah sambil meneroka ruang masalah dan membuat kesilapan.

Sebaik sahaja anda bersedia untuk mendapatkan sesuatu di skrin, terdapat dua alat yang saya fikir ini memudahkan dengan baik. Yang pertama adalah alat InVision yang dipanggil Freehand, yang kami tinjau:

Alat kedua yang memudahkan fasa reka bentuk ini adalah satu set perpustakaan premium untuk Sketch yang dipanggil Flowkit oleh Matt D. Smith. Ia bernilai tag harga $ 29.

Ia bukan sahaja hebat untuk wireframing lo-fidelity, tetapi boleh digunakan pada peringkat seterusnya reka bentuk anda apabila anda perlu memetakan aliran kerja utama dalam kesetiaan tinggi untuk menyampaikan reka bentuk anda.

Bermula

Jauh dan jauh kekuatan terbesar Lukisan untuk Reka Bentuk UX adalah penekanannya untuk membuat perkara yang boleh diulang dan cepat.

Ia masih cukup membimbangkan untuk melihat berapa banyak pereka lakaran tidak menggunakan perkara yang mudah dan berkuasa seperti Gaya Dikongsi, atau lebih banyak kemajuan terkini seperti Simbol Tersarang. Saya meneka itu kerana pereka tidak sabar dan hanya mahu mengeluarkannya. Saya betul-betul mendapatkannya.

Tetapi reka bentuk yang hebat hanya sekadar pereka bentuk yang dianjurkan. Kami suka metafora memasak:

Dan kami juga suka memperluaskan konsep Stylesheets dari kod untuk reka bentuk (sejak kita menulis ini, sistem reka bentuk telah benar-benar meletup ke tempat kejadian, tetapi kebanyakan teknik ini masih relevan hari ini):

Dan akhirnya untuk artikel suci tentang cara memulakan projek di Sketch, yang meliputi semuanya (ke bawah ke struktur folder):

Dengan artikel bonus tentang cara membuat susun atur dalam lakaran secara responsif:

Mendapatkan lebih cepat

Ok, sekarang anda mempunyai genggaman tentang bagaimana untuk memulakan projek Sketch dengan berkesan, sudah tiba masanya untuk mula mendapatkan lebih cepat dengan alat itu. Secara peribadi, saya dapati ia menyinggung perasaan untuk melihat seorang pereka tidak menggunakan cara pintas semasa merancang - Maksud saya, ia benar-benar menyakitkan hati saya. Jangan jadi orang / gal:

Sebanyak satu juta dan setengah alat baru dan plugin telah keluar sejak kami menulis artikel ini, tetapi dengan kejujuran, para sahabat terbaik untuk Sketch tidak pernah berubah pada pandangan saya (Nudg.it sekarang secara asal disokong dalam Sketch, Anima masih berguna walaupun beberapa telah dibakar ke dalam fungsi susun atur Sketch):

Petua dan cara

Jon Moore telah memberikan kebijaksanaan pengguna kuasa dalam beberapa artikel yang akan meniup pikiran anda dalam kesederhanaan dan kekuasaan mereka:

Mendapatkan Lebih Pintar

Anda tahu bagaimana untuk menyediakan projek, anda telah belajar bagaimana untuk mendapatkan lebih cepat dengan Lakaran, dan kini sudah tiba masanya untuk memohon semua itu untuk reka bentuk UX.

Seperti yang saya katakan tadi, Lakaran adalah sempurna untuk reka bentuk UX kerana ia membuat pengulangan, konsistensi, dan modularity mudah. Berikut adalah beberapa contoh bagaimana menggunakan Lakaran untuk membuat elemen UI dengan bijak (dan mereka semua datang dengan freebies ):

Mengendalikan ikon dan grafik dengan cekap

Kami akan merangkumi bahagian reka bentuk visual UX di bahagian seterusnya, tetapi berurusan dengan grafik sering di luar rumah roda pereka UX. Daripada bimbang tentang membuat ikon, dapatkan lebih bijak tentang cara anda menggunakannya:

Simbol bersarang sebenarnya boleh mengautomasikan sedikit:

Akhirnya, saya akan kecewa jika saya tidak menunjukkan kemajuan terbesar Sketch dalam 12 bulan lepas - Perpustakaan:

Mendapatkan Visual

Seolah-olah semua itu tidak mencukupi, pereka UX hari ini mempunyai standard yang jauh lebih tinggi untuk bertemu ketika datang ke reka bentuk visual.

Apabila saya bermula dalam reka bentuk UX, saya mendapati ia mencabar untuk mengetahui "bahan" yang saya perlukan untuk mereka bentuk dengan: nisbah aspek, saiz fon, berat, kontras warna, dan sebagainya.

Untuk menjadi lebih baik, saya mula dengan menyalin produk sedia ada supaya saya dapat merasakan bagaimana UI telah dibuat.

Kami membahas tahun lepas ini dan memberikan pautan kepada beberapa produk biasa yang dibuat semula dalam Sketsa (walaupun sebahagian daripada mereka telah diubahsuai semula):

Dari situ anda boleh mula menggunakan beberapa teknik kecil untuk menambah sedikit bakat kepada reka bentuk anda:

Tetapi jangan lupa bahawa data sampel yang tepat sama pentingnya dengan reka bentuk visual kerana visual itu sendiri:

* kami tidak pernah menulis bahagian 2

Yang terakhir, tetapi tidak kurang pentingnya, pada suatu ketika dalam karier anda, anda perlu merancang papan pemuka dan ia sering merupakan salah satu mimpi buruk terbesar bagi seorang pereka UX. Secara peribadi, saya mendapati bahawa papan pemuka membawa nilai marginal ke meja, jadi saya lebih suka tidak menghabiskan hari mendapatkan carta untuk kelihatan baik:

Sudah menjadi 18 bulan yang luar biasa membantu komuniti reka bentuk melalui UX Power Tools. Dan sementara Sketch pasti bukan satu-satunya alat perancang harus memiliki senjata mereka, tentu saja yang paling kuat. Saya harap apendiks ini akan membantu anda yang baru bermula dalam kerjaya UX, atau yang membuat peralihan ke Sketch untuk aliran kerja reka bentuk anda.

Jika anda berminat dengan sistem reka bentuk vanili yang sesuai untuk memulakan projek baru, kami akan suka jika anda menyemak yang telah kami bina. Mereka akan menyelamatkan anda beribu-ribu jam masa reka bentuk:

Apabila saya tidak mengumpul artikel Lakaran pada Sederhana, saya sedang menggunakan alat reka bentuk lakaran di Alat Kuasa UX untuk menjadikan anda pereka yang lebih baik dan lebih cekap.

Ikut UX Power Tools di Twitter
Ikuti saya di Twitter