Coding untuk Desainer – Berapa Banyak yang Harus Kita Ketahui?

Diterbitkan: 2022-03-11

Ambil sesuatu yang Anda kuasai lalu dorong diri Anda lebih jauh.

Sebagian besar komunitas desain terkunci dalam perdebatan apakah desainer harus membuat kode. Beberapa lebih suka mencari unicorn yang bisa melakukan keduanya, sementara yang lain mengklaim mereka tidak ada, atau hanya menghalangi.

Banyak desainer berpikir bahwa desainer dan pengembang perlu berkolaborasi, tetapi setiap disiplin harus berpegang pada apa yang mereka ketahui. Yang lain melihat tidak ada masalah dengan para profesional yang memakai banyak topi. Banyak pengembang melihat desainer yang mengkodekan ancaman, sementara yang lain melihat mereka sebagai kolaborator yang disambut baik yang telah belajar berbicara bahasa mereka.

Titik manis, yang disebut " pemahaman bersama ," mungkin ada di tengah-tengah. Mengetahui sedikit tentang kode tidak berarti seorang desainer harus menjadi ahli pembuat kode , tetapi cukup memahami perspektif pengembang.

UI, atau "lapisan presentasi" adalah taman bermain desainer, tetapi berfokus pada itu saja sama dengan hanya mempertimbangkan fasad bangunan. Desainer hebat memahami bahwa menjadi akrab dengan dasar-dasar teknologi yang memberikan desain mereka tidak hanya membuat seorang desainer lebih mengesankan, tetapi secara signifikan meningkatkan prospek karir mereka.

Seperti yang dikatakan Aaron Walter, Wakil Presiden Pendidikan Desain di InVision, dalam artikel Toptal Design Talks: “Ini tidak akan membunuh seorang desainer jika mereka tahu sedikit tentang cara menulis beberapa HTML dan CSS, mungkin sedikit JavaScript.”

Desainer yang membuat kode adalah kolaborator yang lebih baik.
Desainer yang membuat kode, bahkan sedikit, dan dapat menjadikan diri mereka aset besar bagi tim multidisiplin mana pun.

Seluruh topik "harus desainer belajar kode" diperdebatkan dengan hangat. Meskipun beberapa desainer hebat juga pandai coding, banyak yang percaya bahwa fokus yang tidak terbagi pada keterampilan tertentu akan membuat seorang profesional lebih kuat. Banyak juga yang percaya bahwa hari ini, menjadi desainer multi-keterampilan adalah nilai tambah yang besar, dan bahwa seharusnya tidak ada cara seorang desainer memiliki keterampilan lain yang berguna, seperti pengkodean, di bawah ikat pinggang mereka.

Pertanyaannya adalah, berapa banyak coding yang harus diketahui desainer? Apakah desainer akan membuang waktu mereka, atau melintasi batas ke wilayah pengembang dan berpotensi menginjak kaki?

Manfaat Mengetahui Basic HTML dan CSS

Desainer akan mendapat manfaat besar dari memperoleh beberapa pengetahuan dasar tentang apa yang disebut "front end" (lapisan presentasi) yang digerakkan oleh HTML (Hyper Text Markup Language) dan CSS (Cascading Style Sheets, bahasa yang menjelaskan gaya komponen dalam dokumen HTML) , dan mungkin akan terkejut dengan betapa mudahnya mempelajari dasar-dasarnya.

HTML dan CSS tidak melibatkan logika pemrograman. Huruf M dalam HTML adalah singkatan dari "Markup," sebuah cara untuk menggambarkan struktur kode elemen halaman yang merupakan blok pembangun halaman. HTML dengan CSS dan JavaScript, membentuk tiga serangkai teknologi dasar untuk World Wide Web.

Desainer dapat menggabungkan pengetahuan tentang pemrograman dan desain.

Dalam istilah awam, HTML adalah peta arsitektur yang memberi tahu browser apa yang harus ditampilkan, dan CSS, atau Cascading Style Sheets, adalah kode yang memberi tahu browser cara menampilkan sesuatu.

Secara metaforis, jika HTML adalah kerangka halaman, CSS akan menggambarkan tinggi, bentuk tubuh, kulit, warna mata, warna rambut, dll. Bahasa memiliki struktur kode yang sangat sederhana yang menentukan tipografi, warna, posisi dan dimensi .

Memahami Kode dan Cara Membuat Kode Adalah Memahami Piksel

Mempelajari cara membuat kode UI front-end dan mempratinjaunya, memberi desainer kesempatan untuk segera melihat bagaimana sesuatu ditampilkan saat dilihat di berbagai perangkat. Jika desainer bermain dengan HTML dan CSS, mereka akan melihat bahwa semuanya diukur dalam piksel (ada unit pengukuran lain seperti "em" dan persentase yang pada akhirnya akan dikonversi ke piksel).

Memahami pengukuran dan struktur kode, yaitu, bagaimana halaman ditampilkan, akan memberikan pemahaman yang lebih dalam tentang proses pengembangan front-end. Itu pada gilirannya akan menyebabkan desainer berpikir lebih dalam tentang desain mereka dan bagaimana membuatnya lebih efisien untuk proses itu. Mereka akan tahu apa yang bisa dicapai dengan mudah dan apa yang lebih menantang.

Pengkodean untuk desainer adalah aset yang bagus.

JavaScript Front-end dan Pengetahuan Ajax Menjadikan Desainer sebagai Aset Unik

Di sinilah hal-hal bisa mulai menjadi rumit, tetapi juga di mana banyak kesenangan terjadi. Jika seorang desainer adalah pemikir analitis, atau sangat termotivasi, mereka akan mendapatkan banyak manfaat dari mempelajari JavaScript dan Ajax (JavaScript dan XML Asinkron). Mengapa?

Mendemonstrasikan pengetahuan teknis UI front-end dan fasih di Ajax akan sangat membantu untuk mendapatkan rasa hormat dari pengembang. Mampu mereferensikan JavaScript dan Ajax dan cara menggunakannya akan meningkatkan kemampuan desainer untuk mengartikulasikan ide desain yang sangat canggih kepada pengembang, misalnya, desain fungsionalitas tertentu di UI.

Perspektif seorang desainer akan meluas jika mereka merasa nyaman mengetahui dengan tepat seberapa jauh teknologi dapat membawa mereka, dan seberapa jauh mereka dapat mendorongnya untuk berinovasi. Tidak perlu mendalami pengkodean dan berbagai teknologi—jika seorang desainer mengetahui dasar-dasar HTML, CSS, dan JavaScript, dengan sedikit Ajax, mereka sudah berada jauh di depan persaingan. Mereka akan menjadi aset unik bagi perusahaan dan tim produk mana pun.

Tentang pemrograman dan desain
Aaron Walter, Wakil Presiden Pendidikan Desain di InVision, menguraikan bagaimana desainer dan pengembang dapat berkolaborasi lebih baik dalam artikel Pembicaraan Desain Toptal.

Desainer Dapat Membawanya ke Tingkat Selanjutnya dengan Dasar-dasar JavaScript

Meskipun desainer dapat berhenti di sini dan menerapkan back end (lapisan akses data) oleh pengembang, mereka dapat membuat desain lebih dinamis dengan menambahkan beberapa skrip. Masukkan JavaScript (bahasa scripting), yang merupakan bahasa pemrograman untuk web.

Pada awal 2000-an ketika web masih berkembang, agensi seperti Fantasy dan Firstborn membuat kesan besar di komunitas desain web ketika mereka memanfaatkan JavaScript dengan cara yang tidak biasa, inovatif, dan kreatif.

JavaScript dapat memperbarui dan mengubah HTML dan CSS, dan dapat menghitung, memanipulasi, dan memvalidasi data. Ini dapat digunakan untuk menampilkan interaksi dinamis, elemen animasi, membuat komunikasi responsif dengan back end atau server, dan banyak lagi.

Tidak ada batasan untuk apa yang dapat dicapai dengan JavaScript dalam pengembangan front-end. Ini adalah bahasa pemrograman : fungsi, objek, logika, kondisional, matematika, matematika, dan lebih banyak matematika—yang mungkin sedikit menantang bagi sebagian orang. Tapi itu tidak sulit untuk dipelajari, terutama mengingat apa yang dibutuhkan sebagian besar klien.

Mengapa JavaScript penting bagi desainer?
Garis waktu animasi seperti ini dapat dibuat dengan JavaScript saja. (histografi.io)

Belajar Kode Akan Meningkatkan Kolaborasi dengan Pengembang

Apakah hubungan romantis akan lebih mudah jika pria dan wanita bisa membaca pikiran satu sama lain? Beberapa orang berpikir begitu. Hal yang sama berlaku untuk desainer dan pengembang.

Mengetahui bagaimana cara berpikir pengembang, dan apa yang mereka butuhkan untuk dapat melakukan pekerjaan mereka, akan menjadikan seorang desainer aset besar bagi tim multidisiplin mana pun. Pendekatan ini berguna untuk komunikasi internal serta lemparan gagasan karena mereka akan memiliki lebih banyak gagasan tentang apa yang diharapkan dari anggota tim lainnya. Jika desainer dapat melakukan ini, mereka akan berada dalam posisi yang jauh lebih baik untuk mengusulkan solusi yang lebih kuat kepada klien.

Desainer yang Membuat Kode Akan Melihat Lebih Banyak Peluang Kerja

Dalam setiap peluang kerja desain, mengetahui cara membuat kode dapat membuat perbedaan besar dalam proses penyaringan serta pekerjaan sehari-hari. Di Toptal, kami melihat banyak peluang bagi para profesional dengan profil hybrid ini, dan perusahaan rintisan di luar sana ingin sekali menemukan orang yang dapat mengambil alih desain dan ujung depan aplikasi tahap awal mereka.

Pengkodean untuk desainer adalah keuntungan.
Mempelajari cara membuat kode dapat menghasilkan beberapa peluang tak terduga.

Namun, ada beberapa desainer dan programmer yang tidak suka satu sama lain saling mencampuri urusan masing-masing. Beberapa mungkin terancam, beberapa mungkin tertantang, dan beberapa mungkin terlalu malas untuk mempelajari sesuatu yang baru. Tetapi kenyataannya adalah, masing-masing harus menganalisis pilihan mereka, dan fokus pada apa yang akan meningkatkan peluang keberhasilan mereka.

Desainer mungkin tidak memiliki cukup waktu untuk mempelajari semuanya, tetapi mengetahui vanilla HTML dan CSS seharusnya cukup untuk menambahkan perbedaan yang signifikan antara karier yang berkembang dan karier yang buntu. Ini harus menjadi proses yang cepat dan mudah bagi desainer untuk mengambil langkah pertama. Semakin banyak yang mereka ketahui, semakin mereka dapat memperluas wawasan mereka dalam hal peluang kerja.

Haruskah Desainer Belajar Kode?

Kemampuan beradaptasi dan fleksibilitas bekerja dengan tim lain, kemampuan untuk menangani berbagai proyek, dan serangkaian keterampilan yang luas untuk mengambil berbagai tanggung jawab selalu diminati. Apakah ada desainer di mana pun yang tidak ingin memiliki keunggulan dibandingkan orang lain dalam hal pekerjaan yang sangat didambakan di perusahaan rintisan yang menarik, atau perusahaan teknologi besar yang mapan?

Desainer memiliki pendekatan, proses, gudang alat desain, dan hasil, tetapi itu hanya bagian dari persamaan. Menjelajahi, dan mengumpulkan pemahaman tentang bagaimana desain UI disampaikan menggunakan berbagai teknologi digital, dapat membawa desainer ke tingkat berikutnya dan meningkatkan kemampuan mereka untuk memberikan desain yang hebat.

Semakin, semakin banyak peluang kerja di bidang desain termasuk "bagus untuk dimiliki" seperti pengembangan web dasar dan keterampilan membuat prototipe menggunakan HTML, CSS, dan JavaScript. Ini untuk setiap desainer untuk memutuskan berapa banyak yang harus diambil; jelas kebutuhan ada di luar sana.

Desainer yang membuat kode melihat lebih banyak peluang kerja.

Apakah AI Akan Menghilangkan Pengembang Front-end?

Satu pertanyaan tetap ada: Apakah pengkodean untuk desainer akan tetap relevan dalam jangka panjang? Ada firasat di antara desainer bahwa dengan AI dan pembelajaran mesin, desainer akan segera dapat mendesain tanpa kode. Cukup seret-dan-lepas dan pindahkan berbagai hal di layar, lalu tekan tombol dan AI mengkodekan semuanya. Dengan kata lain, pekerjaan untuk jenis front-end developer ini akan cepat hilang.

Dalam hal desainer, jawabannya mungkin terletak pada pemikiran jangka pendek vs jangka panjang. Dalam waktu dekat, AI tidak akan mengambil alih, dan desainer yang membuat kode mungkin masih banyak diminati. Untuk jangka pendek, desainer yang ingin menonjol harus tetap memiliki keterampilan pengkodean dasar tertentu seperti JavaScript dan Ajax di gudang senjata mereka.

Penguasaan Coding untuk Desainer Akan Meningkatkan Karir

Desainer UI yang memiliki keinginan untuk tumbuh dan meningkatkan keahlian mereka memiliki beberapa opsi yang mereka miliki. Mereka dapat memoles berbagai keterampilan desain dan beralih ke peran lain seperti desain visual, UX, atau bahkan penelitian UX. Mereka juga dapat secara bertahap menaiki tangga ke peran yang lebih senior, kepala sekolah, pemimpin, manajer, dan direktur.

Namun, untuk benar-benar meningkatkan karir mereka, desainer mungkin ingin mempelajari lebih dalam pengembangan. Memperoleh pengetahuan mendalam tentang berbagai teknologi yang mendorong produk digital saat ini akan membekali mereka dengan serangkaian keterampilan yang sangat diinginkan. Itu pada gilirannya akan membuka lebih banyak pintu untuk peluang kerja di perusahaan besar dan kecil.

Haruskah desainer membuat kode? Mungkin tidak. Tetapi desainer yang membuat kode, atau setidaknya menunjukkan pengetahuan mendalam tentang berbagai teknologi, akan menjadi aset besar bagi tim multidisiplin mana pun, dan itu pasti akan terbayar dalam jangka panjang.

• • •

Bacaan lebih lanjut di Blog Desain Toptal:

  • Prinsip dan Praktik Terbaik Desain UX Seluler
  • Desain UX Seluler – Praktik Terbaik, Kendala, dan Bekerja dengan Pengembang
  • Desain Lintas Budaya dan Peran UX
  • Prinsip Desain dan Kepentingannya
  • Portofolio Desainer UX Terbaik – Studi Kasus dan Contoh yang Menginspirasi