Sketching: Bagaimana Pena dan Kertas Sederhana Dapat Mengubah Suatu Desain Website

() translation by (you can also view the original English article)

Kita menghabiskan sebagian waktu kita di depan monitor, yang kemungkinan besarnya kita memiliki lebih dari satu komputer, tanpa harus menyebutkan iphone, tablet dan semua peralatan ultra modern lainnya yang memenuhi meja kita. Kita semua adalah bagian dari generasi yang membutuhkan mouse untuk membolak-balikan album foto keluarga (selamat tinggal pada album keluarga tercinta dengan halaman-halaman yang dibiarkan menguning) dan generasi yang menggunakan Facebook untuk mengirim ucapan selamat ulang tahun kepada seorang teman. 20 contoh situs inspirasi "sketsa" yang bagus termasuk!

Namun, di tengah era digital ini, sekutu terbaik seorang designer web adalah tools umum yang bisa dibeli di sekitar anda. Saya berbicara tentang pena, pensil dan kertas sebagai bagian dari proses kreatif yang telah digunakan oleh para designer "non-digital" lainnya dari masa ke masa: membuat sketsa (sketching).

Dengan artikel ini, kami akan menanggapi sebuah argumen yang pasti banyak akan anda hadapi: kami akan membahas bagaimana membuat sketsa (sketching) dapat membantu kita dalam menyusun ide, mendesain layout yang efektif dan mengapa tidak, memberikan kesegaran dan sentuhan original ke desain kita

Sketching Sebagai Bagian dari Proses Perencanaan

Bayangkan skenario ini: Kita baru saja menyelesaikan briefing yang melelahkan dengan klien kita dan sekarang saatnya untuk mengatur ulang ide atau gagasan tersebut. Kita mengetahui keinginan dan kebutuhan klien kita; Atas dasar ini kita seharusnya bisa mengatur layout yang harus kita desain. Masalahnya adalah jumlah informasi yang harus kita pertimbangkan! Kita menentukan bahwa di homepage, kita harus memasang slider dan call-to-action yang terlihat yang mengundang ke kontak, halaman situs akan menjadi tujuh dan kita juga harus menyertakan berita terbaru (latest news) di homepage dan sebagainya.

Pada titik ini, saya jamin, membuka Photoshop dengan tujuan untuk menciptakan layout yang efektif tidak ada gunanya; Tanpa rencana untuk apa yang harus anda gambar secara rinci, anda akan diblok dan dipaksa untuk mendesain secara esensial tanpa pandangan jauh ke depan untuk membuat keputusan yang cerdas. Yang mana hal ini sering berarti lebih banyak pekerjaan di kemudian hari, memperbaiki apa yang bisa dilakukan dengan benar pada kali pertama tersebut cukup dengan sedikit membuat sketching atas pekerjaan tersebut.

Sketching menawarkan sesuatu yang unik bagi bayak web designer... hal itu membantu kami mengatur meng-organize besar informasi ke dalam potongan-potongan yang dapat dikelola dan dapat kami desain.

Sebagai gantinya, jika anda memiliki keberuntungan untuk bisa mengembangkan konsep dan ide dalam sebuah desain, kemungkinan besar anda akan melupakan sesuatu yang penting, karena harus meletakkan tangan anda sekali lagi di layout untuk kedua kalinya. Dan, anda mungkin juga tahu bahwa ada layout yang bahkan dengan sedikit perubahan bisa benar-benar berubah dan kehilangan efektivitas komunikatif dan estetika mereka... hasil yang benar-benar membuat frustrasi.

Beberapa saran tentang bagaimana maju tanpa memusingkan hal tersebut? Ambil pena dan kertas...

Tandai kata kunci yang harus membedakan antara perusahaan tersebut dan apa yang anda inginkan di depan mata selama fase proyek tersebut, agar tidak kehilangan fokus pada keinginan anda yang harus mewakili secara grafis. Hindari frasa dan konsep yang rumit, jadilah organik: semakin cepat anda, semakin banyak otak anda dapat memproses informasi dengan cepat dan mudah.
Selalu dengan cara skematik, mungkin sebagai list, catat seluruh informasi yang berguna untuk tahap design. Yang harus anda lakukan hanyalah mencatat di atas kertas hanya informasi dan konsep yang anda perlukan begitu anda membuka program grafis.
Bagi informasi secara bertahap, sehingga setiap frase jadi semudah mungkin. Jika anda masih harus mendesain layout dari homepage, jangan mencatat konten yang akan disertakan di halaman kontak: hindari kebingungan dan gangguan. Perhatikan informasi tentang berbagai sheet di notebook anda, sehingga anda dapat berkonsentrasi pada satu langkah setiap saat.

Tahap pertama dari sketching ini menganggap elaborasi informasi secara skematis dan sederhana. Anda mungkin berpikir bahwa semua ketelitian dan disiplin ini tidak ada hubungannya dengan kreativitas dan imajinasi dan anda menginginkan perubahan pemandangan? Oke, mari kita lanjutkan ke langkah selanjutnya.

Jadikan Sketching Sebagai Bagian dari Proses Kreatif

Kami mengatakan bahwa sketching itu adalah suatu proses kreatif, tapi apa maksudnya ini dalam praktiknya?

Kita bisa menganggap sketching sebagai "jalan tengah" antara informasi yang kita miliki dan layout yang akan kita desain. Di wilayah ini, perseteruan dan magic, kita menemukan warna, font, kotak, ide, inspirasi, tekstur, gambar, sensasi, keraguan... dan banyak lagi. Tidak berguna mengatakan bahwa di tengah semua ini mudah untuk menjadi bingung dan untuk menemukan ide yang tepat, ide yang bekerja dan itu membuat kita bangga menjadi seorang desainer.

Saya berpikir bahwa tidak ada yang lebih menjengkelkan daripada mendapati diri di depan selembar kertas kosong, menunggu inspirasi yang seharusnya datang dari siapa yang tahu di mana, dan berakhir dengan menciptakan layout yang buruk (jika anda benar-benar beruntung seperti saya, anda akan dilibatkan dengan rekan kerja yang mengambil sebagian besar situasi untuk memberitahu anda bahwa pekerjaan anda menyebalkan tanpa mengganggu untuk berkata kurang memuaskan sehingga tidak menyakiti sensibilitas anda sebagai seorang kreatif).

Salah satu buku sketsa saya... kita akan meninjau kembali ini nanti.

Secara pribadi saya melewati masa-masa sulit dengan beberapa klien: inspirasi tidak mau datang dan proposal grafis saya membuat saya malu dengan diri saya sendiri. Saya melewati berjam-jam melihat-lihat situs galeri, merasa semakin tertekan karena sepertinya semua orang bisa membuat layout yang indah, satu-satunya orang yang tidak mampu menempatkan dua persegi panjang bersama dengan cara yang menyenangkan adalah saya. Dalam kasus saya, meringankan tekanan tersebut menjadi mudah dengan bantuan pensil.

Biarkan awal proses kreatif seseorang di atas kertas membebaskan imajinasi anda, memungkinkan anda bekerja dengan cara yang lebih spontan dan menstimulasi.

Terutama jika proyek yang sedang anda kerjakan sangat besar dan kaya akan rincian teknis, mengingat semua ini, fase pertama dapat dipastikan akan menimbulkan aliran kreatif, belum lagi ketakutan yang melemahkan "yang gagal" yang mempengaruhi banyak designer: terperangkap dalam keinginan untuk melakukan dengan cepat dan baik, keseringannya kita tetap lumpuh di depan monitor dan tidak mampu mengatur ulang ide dan menyalurkannya ke arah yang benar.

Karena itu, sebelum mulai bekerja dengan berbagai program grafis, ambil pena dan kertas dan... buat sketsa! Mencoret-coret, mencatat beberapa ide, mulai menelusuri bermacam desain abstrak untuk mendapatkan keterbiasaan dan setelah membebaskan intuisi anda. Anda kemudian akan menganalisis idenya, sekarang biarkan diri anda melakukannya dan hindari logika dan rasionalitas, mereka tidak akan membantu anda dalam fase ini.

Garis besar dari layout, letakkan beberapa catatan, hapus semuanya, mulailah lagi: selama proses ini, pikiran anda bekerja dengan cepat dan dahsyat, jadi perhatikan semuanya sebelum fase intuitif ini meredup! Anda akan menemukan bahwa memberikan kebebasan penuh untuk ide-ide anda bisa menjadi hal yang menyenangkan, santai dan berguna.

Membuat Kesalahan... dengan Tujuan

Ide pertama jarang akan menjadi kenyataan, bersiaplah untuk menerimanya. Sketching membantu anda membebaskan diri dan memanfaatkan peluang grafis yang berbeda yang tepat dan ringan untuk anda, tapi ini tidak berarti bahwa anda tidak akan melakukan kesalahan dalam fase ini. Hal positifnya adalah meski anda melakukan kesalahan dalam fase ini anda selalu bisa merobek lembaran tersebut, mempertajam pensil dan mulai lagi dari lembaran baru. Membuang layout yang dibuat dengan Photoshop, hanya karena anda menyadari bahwa ini bukan solusi terbaik untuk kasus anda tanpa menyangsikan hilangnya motivasi.

Sketsa, Bukan Wireframe

Dalam keadaan demikian, saya mohon agar anda tidak membuat sketsa dengan WireFrame: kita membicarakan dua hal yang berbeda, bahkan jika saya melihat, ada kebingungan tentang argumen tersebut. Beberapa hari yang lalu seorang web designer memberi tahu saya, mengutip kata-katanya yang tepat "Apa, anda menggunakan pena dan kertas? Saya melakukan semuanya secara online", menyebutkan sebuah situs yang untuk pembuatan mockup dengan presisi matematis, dengan kontrol penuh pada warna dan typography.

Tapi, ini bukan sketching, ini benar-benar sesuatu yang lain. Mengklik dengan mouse pada beberapa tombol untuk membuat beberapa persegi panjang tidak memungkinkan anda memberi bentuk pada ide anda dan membebaskan aliran kreatif anda, cobalah untuk percaya akan hal itu. Dengan pernyataan ini, saya tidak meragukan kegunaan dari wireframe yang bagus, saya hanya ingin menggarisbawahi perbedaan antara kedua pendekatan tersebut.

Melakukan Kekacauan

Singkirkan keinginan anda akan presisi, penggaris dan kompas! Pada fase ini tidak ada ruang untuk tertib dan teliti, jadi jangan membatasi aliran kreatif yang menghalangi diri anda pada margin dan white space, anda bisa memikirkannya nanti. Dengan cara yang sama, jangan khawatir jika anda tidak berbakat secara artistik dan kemampuan manual anda hampir tidak memungkinkan anda untuk memegang pensil: membuat sketsa bertujuan untuk menyusun kembali ide bukan untuk membentuk seniman berbakat.

Pada hal ini kita harus menambahkan bahwa bahkan jika sketching lahir sebagai ekspresi bebas dari imajinasi dan kreativitas selain kemampuan grafis anda, hal tersebut tidak berarti bahwa sketsa juga tidak memiliki nilai seni yang artistik. Mari kita lihat bersama apa yang sedang saya bicarakan.

Membuat Sketsa Sebagai Bagian dari Proses Desain

Kecenderungan pada banyak web designer untuk membuat sketsa telah memberi kesan awal yang nyata pada style grafis yang mengingatkan akan aspek estetika dari sketsa: Kami memiliki brush yang memancarkan spontanitas dan ringan, belum lagi ratusan font dengan style tulisan tangan dengan mudah dapat ditemuan di web. Berkat sumber-sumber semacam itu hari ini membuat layout dengan style sketch cukup mudah, namun disamping desain ini yang menggunakan style grafis ini biasanya memiliki sentuhan orisinalitas yang membuat mereka menarik dan tidak umum.

Style sketch, hanya karena hal tersebut terkait dengan aktivitas yang biasa terjadi pada banyak materi iklan, sering digunakan di situs freelancer atau agen komunikasi / desain yang ingin mentransmisikan konsep ini secara grafis. Bagaimanapun, bahkan kombinasi beberapa elemen sketch (sketsa) ke grafik yang lebih tradisional dapat memberi perspektif baru untuk desain yang biasa.

Mari kita lihat bagaimana beberapa situs menggunakan style ini dengan cara yang efektif dan orisinil dan bagaimana hal tersebut mempengaruhi estetika dan keefektifan layout mereka.

Kunal Chhajer

Situs web designer Kunal Chhajer mencerminkan konsep style sketsa dengan tepat. Grafiknya ringan dan menyenangkan, diperkaya dengan cara yang orisinil dengan beberapa desain yang membuat layout yang unik. Style ini juga teringat akan penggunaan font tulisan tangan di menu navigasi. Semua detail ini memberi desain kreativitas yang diinginkan beberapa designer dalam situs pribadinya.

Creative With a K

Di situs Creative with a K ada banyak sekali sketsa dan corat-coret, hanya untuk secara jelas menunjukkan "sifat kreatif" dari situs ini. Dalam hal ini bahkan keganjilan layout yang tidak normal, membuat situs ini spesial dan tidak biasa, meski sulit untuk diungkapkan.

Lega-Lega

Situs Lega-Lega adalah toko online kaos dengan cetakan yang sedikit tidak biasa dan ditujukan secara pasti di pasar anak muda. Penambahan beberapa detail sketsa memberi potongan kreatif dan seru ke situs ini.

Beavory

Beavory adalah situs/blog Karen Mack, ilustrator Israel. Style situsnya sengaja didasarkan pada style yang mengingatkannya akan sifat kreatifnya dengan cara yang nyata dan original. Setiap detail, dari struktur layout berdasarkan garis tidak beraturan, seolah-olah digambar dengan pena felt, sampai ke ikon jejaring sosial sepenuhnya merupakan style sketsa yang efektif.

Bowtie

Bowtie adalah sebuah studio digital yang memutuskan untuk mewakili dirinya benar-benar dalam cara yang kreatif di web. Animasi dari situs, dengan gambar-gambar lucu, jarang, membuat tata letak menarik dan sangat boros. Mereka menyebut diri mereka "creative" dan, untuk membuktikan hal itu, mereka menggunakan unsur-unsur dalam gaya sketsa.

MakoMako

Tata letak dari band MakoMako benar-benar dibuat dalam gaya sketsa, sehingga struktur yang sama halaman didasarkan pada selembar kertas dengan garis-garis yang tidak teratur, dan di homepage sebagai bagian dari desain, kita menemukan selain rincian grafik biasa berdasarkan sketsa dan tangan-wr itten font, pensil. Yang aneh dan terlihat sangat tidak biasa untuk sebuah band.

Stan The Snowman

Nah, itu hampir musim panas banyak pesona lenyap, tetapi efektivitas grafis dari situs Stan salju namun adalah keluar dari pertanyaan. Dalam kasus ini penambahan gambar bergaya dan font kaligrafi memberikan gaya spontan untuk tata letak, menyenangkan dan informal. Dan menelusuri konsep aktivitas, berdasarkan menulis kartu ucapan.

Greenaway Pro

Situs Greenaway Pro 2011 festival menggabungkan dengan cara tertentu dan menarik gaya sketsa dan gaya grunge, memberikan tata letak jejak yang benar-benar asli. Juga dalam kasus ini pilihan gaya grafis ini tertentu cenderung untuk mengekspresikan pandangan informal, spontan dan eksentrik. Sempurna untuk festival yang berurusan dengan musik dan berselancar, kanan?

Julian Laval

Julian adalah freelance web desainer lain yang ingin menyoroti keterampilan grafis, dimanfaatkan kekuatan komunikatif sketsa dalam cara yang benar-benar kreatif. Tentu saja, hal ini tidak hanya ini yang membuat nya situs khusus, tetapi bahkan sifat penasaran dan sengaja jarang gambar. Seperti banyak situs lainnya dalam gaya, warna terbatas skala abu-abu, membuat ilustrasi lebih realistis.

Little Creatures

Situs makhluk kecil benar-benar dirancang dalam gaya sketsa dan berkat keganjilan dari sketsa, begitu sedikit refinished, Halaman ini begitu menarik.

Le Carnet Ordinaire

Carnet Ordinaire adalah sebuah situs yang adalah seperti sebuah diary, dengan catatan perjalanan, anotasi, dan pertimbangan-pertimbangan pribadi. Mengingat sifat yang eksentrik dan intim situs, gaya sketsa adalah salah satu yang paling sesuai: tata letak didasarkan pada gambar moleskine dibuka, ditingkatkan dengan sketsa dan gambar-gambar yang bergaya. Bahkan latar belakang dibuat lebih asli dengan beberapa kartun yang dimasukkan dalam opacity dan oleh kehadiran pensil, meninggalkan santai dekat moleskine.

Wing Cheng

Portofolio sayap Cheng adalah contoh sempurna dari perspektif segar yang gaya sketsa dapat memberikan tata letak. Struktur halaman berdasarkan moleskine terbuka, dari mana halaman jatuh. Efek dibuat lebih dramatis berkat bayangan yang membingkai desain dan penggunaan kaligrafi font untuk setiap konten tata letak, dari judul proyek untuk deskripsi mereka. Tetapi keanehan nyata situs ini menganggap paparan proyek, juga membuat sketsa di pensil dengan cara yang benar-benar kreatif.

Kuztown University

Universitas Kutztown komunikasi dan desain tidak dapat menemukan cara yang lebih baik untuk mengatasi efektif materi iklan atau orang-orang yang bercita-cita tinggi. Tata letak pasti tidak biasa untuk realitas akademik: latar belakang dalam air warna style, halaman berdasarkan halaman buku ilustrasi dalam air warna, font tertentu dari menu navigasi... semua rincian asli dan pasti ekspresif.

Dan Whittaker

Dann Whittaker di situs nya menunjukkan gaya grafis umum untuk banyak web designer. Santai dan spontan dilihat, berdasarkan tata letak halaman buku dan pada penggunaan konsisten dari rincian dalam gaya sketsa. Di kompleks tata letak ini sangat efektif dan menyenangkan estetis.

Chernobyl Heart

Dalam hal situs Chernobyl hati gaya sketsa digunakan untuk menyorot grafis konsep masa kanak-kanak: di sini kita berbicara tentang anak-anak dan kita melihatnya melalui beberapa sketsa bergaya kecil yang Salin cara menggambar mereka. Efektif dan menyenangkan.

Demain j’arrete

Gaya sketsa adalah sempurna untuk hadir pada komik dan ilustrasi, sehingga tata letak mewakili visual dan kreatif sifat situs. Dalam kasus Demain J'arrete, seluruh situs memiliki gaya grafis "arang", mulai dari gradien latar belakang garis yang tidak teratur yang berisi tata letak dan menu navigasi.

Nature Shop

Menambahkan beberapa sketsa rincian cara rupanya kasual, dapat memberikan sentuhan kreatif khusus ke situs minimal dan penting. Hasilnya, terlihat misalnya di situs Toko alam, sangat menyenangkan.

Ready to Market

Tata letak siap untuk pasar adalah contoh bagaimana memadukan gaya modern dengan beberapa rincian yang bergaya dan komik dapat memberikan hasil yang baru dan merangsang.

Cou Cou Shop

Toko Cou Cou sangat bagus dan menyenangkan untuk melihat. Salah satu elemen paling tertentu tata letak adalah tanpa keraguan footer, yang menunjukkan lanskap bergaya Swiss. Bahkan sketsa tas dari sudut yang berbeda adalah sebuah detail yang sangat asli.

Upside Down-Town

Warna-warni, tidak biasa dan aneh: situs pusat belajar Upside-Down Town berinvestasi banyak pada keaslian gaya sketsa. Setiap elemen tata letak, terutama dalam judul, menunjukkan efektivitas visual gambar, sketsa dan warna yang menekankan grafis dan di dunia anak-anak cara menyenangkan.

Kesimpulan

Kami melihat bagaimana proses sketsa dapat membantu kami untuk ide-ide proses dalam cara yang kreatif dan pada saat yang sama, bagaimana beberapa sketsa dapat memberikan perspektif yang berbeda dan asli untuk layout kita. Membuat sketsa kebiasaan ketika Anda mulai bekerja pada sebuah proyek desain baru- dan tidak hanya-bisa datang sangat berguna juga di bidang lain, seperti dalam copywriting – dan waktu Anda akan mengembangkan fleksibilitas pikiran yang akan mengubah berguna dalam pekerjaan Anda. Oleh karena itu menyimpulkan: mematikan komputer dan mendapatkan kertas dan pena!

Aku menyelesaikan berbagi dengan Anda dua sketsa pribadi: sketsa portofolio saya saat ini dan ide-ide pertama aku meletakkan untuk artikel ini, selama dalam perjalanan naik kereta yang benar-benar membosankan.

Sekarang, giliran anda, saya ingin melihat sketsa anda!