Tools wajib install untuk Design & Development
Tools yang sifatnya wajib install dan mendasar dalam dunia UI/UX serta development
Halo kawan-kawan, terima kasih sudah bersedia subscribe di nawala baru ini. Sebagai awalan, mari kita bahas sedikit soal tools yang akan banyak kita pakai dalam kerja-kerja design & development.
Dalam beberapa tahun terakhir ini terdapat perkembangan pesat yang sangat membantu dalam kerja-kerja UI/UX design serta implementasinya ke dalam koding untuk membuat prototype produk digital.
Kita tidak hanya bicara tentang framework, melainkan juga tentang tools yang bisa digunakan dalam kerja-kerja kreatif ini. Kabar baiknya: kebanyakan tools ini gratis!
Mari kita unduh dan install satu per satu.
Design Tools
Dalam pandangan kustomer, produk dan desain adalah satu kesatuan. User experience sebaiknya sudah kita rencanakan sejak awal mula pengembangan desain. Tools berikut ini membantu kita untuk memudahkan membuat konsep protoype dengan cepat.
Adobe XD
Jika kamu sudah punya sedikit gambaran tentang bagaimana rupa atau bentuk produk digital yang kamu ingin buat, langkah berikutnya adalah bagaimana visualisasinya. Adobe XD adalah tools yang sangat mudah digunakan untuk tahap ini. Apakah kita berniat membuat sekadar wireframe atau bahkan MVP (minimum viable product), Adobe XD dibuat dengan maksud untuk memudahkan kerja-kerja tersebut.
Sejauh ini pengalaman saya menggunakan Adobe XD dalam rangka membuat konsep produk digital (UI/UX design), aplikasi ini jauh lebih intuitif dan ringan digunakan dibanding Adobe Illustrator, atau Photoshop.
Adobe XD ini gratis. Tersedia untuk MacOS serta Windows. Buat pengguna Linux, sabar ya… :)
Silakan unduh disini: Adobe XD
Figma
Figma mirip seperti Adobe XD, bedanya, aplikasi ini tersedia di cloud. Kamu bisa mengaksesnya via browser (saran saya sih pakai chrome). Jadi, kamu tidak perlu install apapun di laptop atau PC. Selama ada akses internet, Figma bisa menjadi tools andalan dalam membuat prototype atau wireframe.
Sama seperti Adobe XD, Figma juga dilengkapi dengan dukungan banyak plugins yang memudahkan pembuatan prototype. Banyak pula komunitas design & development yang mulai beralih ke Figma.
Kabar terakhir, tim desain dari Spotify juga mulai beralih haluan ke Figma untuk memudahkan kerja-kerja kolaboratif mereka.
Kunjungi website-nya di sini: Figma
Development
Selain membuat prototype desain, jika berbicara soal design & development tentunya kita juga bicara soal peranti yang sudah menjadi standar umum bagi para developer profesional. Berikut ini adalah beberapa diantaranya.
Visual Studio Code
Visual Studio Code (sering disebut dengan VS Code), adalah program text editor besutan Microsoft yang gratis untuk diunduh. Text editor ini ringan dan didukung oleh banyak addons yang membantu koder untuk membangun aplikasi dengan kode yang lebih rapi, readable, dan taat konsensus.
Unduh di sini: VS Code
Github – Code Management
Github adalah surganya para developer. Di sini, para developer saling berbagi repository kode aplikasi yang mereka bangun. Banyak aplikasi open source dikembangkan dengan bantuan kerja kolaboratif melalui Github.
Mendaftar di Github adalah hal yang sudah menjadi norma standar bagi mereka yang terjun ke dunia development.
Daftar di sini: Github
Untuk lebih memahami bagaimana bekerja dengan Github, sebaiknya kita juga mempelajari juga tentang apa itu Git.
Singkatnya, Git adalah tool yang memungkinkan kita untuk melakukan kerja development secara kolaboratif, dengan version control yang rapi dan mudah dilacak.
Kenapa Git diperlukan? Bayangkan sebuah skenario seperti ini:
Seorang developer menulis kode-kode pemrograman yang kemudian direvisi oleh koleganya, tanpa sepengetahuannya. Kode yang sudah ia tulis itu tertimpa, dan sulit dilacak revisinya. Dengan Git, resiko peristiwa revisi tersebut bisa diminimalkan. Sebab Git mencatat semua perubahan pada repository project, dan Git menandai dimana saja perubahan tersebut dilakukan.
Resource tentang Git dan bagaimana cara menginstallnya bisa dibaca di sini:
npm (Node Package Manager)
Beberapa tahun terakhir, Node digunakan secara luas oleh developer JavaScript untuk membagikan tools, install berbagai modul dan mengelola dependensi antar library. Mengenal dan bekerja dengan npm menjadi penting untuk developer, terlebih banyak aplikasi modern yang dikembangkan dengan Node.js.
Sebagai penganut rapid development, npm sangat membantu saya sebab tidak perlu lagi repot merunut berbagai library untuk diunduh demi membangun sebuah aplikasi, cukup dengan mengetik satu line di terminal / command prompt, dan voila, npm yang mengatur semuanya. Dalam hitungan menit, kita sudah memiliki aplikasi boilerplate yang siap di otak-atik.
Bagaimana cara menginstall dan bekerja dengan npm akan kita jelajahi lebih lanjut dalam publikasi tersendiri. Agaknya akan terlalu panjang jika harus disematkan di sini :)
Xampp
XAMPP adalah tool open source yang kita gunakan sebagai solusi server untuk environment local. Artinya, dengan meng-install Xampp, kita menjadikan komputer kita sebagai server yang dapat melayani script kompleks seperti PHP, serta koneksinya dengan database MySql.
Installasi Xampp di windows dan MacOs cukup mudah dan straightforward. Sila unduh di sini: XAMPP.
Sementara untuk linux, saya sendiri memakai ubuntu 18 dan ZorinOS, resource ini layak dicoba: install Xampp di linux.
Kira-kira segini dulu teman-teman yang baik, silakan coba install dulu tools di atas. Kita akan banyak bekerja dengan Adobe XD, Figma, dan VS Code.
Mengenai Git dan npm, kita akan bahas lebih dalam di lain waktu. Tapi tidak ada salahnya untuk mulai mendaftar github sekarang juga :)
Jika ada pertanyaan atau ada topik khusus yang ingin dibahas seputar design & development, bisa kita diskusikan via twitter. Colek saja @ginseladipura
Jika berkenan, kamu juga bisa follow twitter @kodesain_news. Saya inginnya sih, kita bisa berbagi banyak ilmu dan pengalaman terkait design & development di akun @kodesain_news ini.
Tabik!