Unlimited WordPress themes, graphics, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Web Design
  2. Web Design
Webdesign

Pendapat Saya Tentang Mendesain di Browser vs Mendesain di Photoshop

by
Length:ShortLanguages:

Indonesian (Bahasa Indonesia) translation by Haikal Kamil (you can also view the original English article)

Mendesain di browser menjadi lebih dan lebih populer dengan munculnya "designers who code". Tetapi hanya karena kita telah memiliki beberapa skill baru, apakah itu berarti kita harus membuang kertas, sharpie, software  desktop publishing dan tool wireframing dan langsung beralih ke coding prototype?

Browser vs. Photoshop Adalah Topik Populer

Jika Anda bekerja di ruang digital, dengan banyak desainer dan developer, Anda akan melihat tren peningkatan desainer yang diharapkan memiliki (beberapa) skill coding.

Banyak orang mendukungnya, sementara beberapa percaya bahwa desainer tidak boleh menyentuh kode. Namun, para desainer yang melakukan kode semakin percaya diri dan beberapa bahkan berpendapat bahwa mendesain di Photoshop tidak lagi relevan dalam skenario tertentu.

Saya berpendapat bahwa kreativitas adalah alat yang independen, tetapi saya dapat melihat manfaat dan kelemahan dari kedua pendekatan secara terpisah (saya telah mencantumkannya di bawah ini, sehingga Anda bisa mendapatkan perspektif saya dalam diskusi ini).

Pada artikel ini saya menggunakan istilah "Photoshop" dan "UXPin" secara luas. Saya benar-benar merujuk pada tools semacam ini, baik Anda menggunakan Sketch, Balsamic atau yang lainnya! Argumen yang sama berlaku. Photoshop dan UXPin kebetulan menjadi tools preferensi saya.

Langsung ke Browser

Hak cipta © 2013 Olle Svensson Attribution-commercial-Share Alike 2.0 license

Situasi umum di mana seseorang dalam suatu organisasi dapat mendesain di browser adalah jika mereka terampil dalam desain visual, tetapi mereka juga nyaman dalam coding. Misalnya, tujuannya mungkin untuk berkomunikasi dengan developer yang membangun CMS seperti apa desainnya nantinya. PSD akan cocok, tetapi desainer tersebut mungkin merasa akan lebih valuable untuk menampilkan semua dengan ekstra tersebut, seperti animasi dan responsif dengan cara yang lebih dekat dengan produk final.

Manfaat

  • Framework seperti Bootstrap dan Foundation membuat proses ini lebih cepat. Dalam pengalaman saya, ada baiknya untuk benar-benar belajar cara membuat kode dari awal sebelum bersandar pada framework karena Anda akan mempelajari apa yang terjadi di balik layar.
  • Belajar kode front-end mengurangi jumlah kemacetan, terutama jika tim Anda lebih berat di sisi desain. Anda dapat membiarkan pengembang fokus pada lebih banyak aspek yang menantang dari pengembangan dan area spesialis.

Kekurangannya

  • Mendesain di browser bisa sedikit lebih lambat jika Anda tidak percaya diri dalam coding. Dalam pengalaman saya, suatu hal yang bagus untuk membayar untuk mendaftar dalam kursus front-end development, dan mencoba tangan Anda di beberapa pekerjaan freelance seperti membangun landing page sederhana.
  • Proses ini dapat mengalihkan fokus desainer dari kekuatan intinya. Ya, mungkin lebih baik memiliki keterampilan coding. Namun, beberapa orang berpendapat bahwa pembagian kerja (orang yang berfokus pada tugas yang sangat spesifik) mengarah pada efisiensi yang lebih besar dalam produksi. Realitas pasar (dan fleksibilitas yang dicari dalam ruang digital) yang sebaliknya dapat menyebabkan orang-orang berdebat!

Mendesain dalam Photoshop/UXPin

Hak cipta © 2013 Serg Kij Attribution-commercial-Share Alike 2.0 license

Software  publishing desktop seperti Adobe Photoshop dan Software as a Services (SAAS) seperti UXPin hanyalah beberapa dari banyak tool yang merupakan roti dan mentega bagi para desainer. Bahkan desainer yang dapat membuat kode dan sering mendesain di browser akan merasa berharga untuk merencanakan hal-hal menggunakan tools ini terlebih dahulu.

Manfaat

  • Aplikasi grafis sangat bagus dalam fase perencanaan dan research awal. Dalam pengalaman saya, kertas dan sharpie adalah cara yang cepat dan kotor untuk dengan cepat menyempurnakan sesuatu.
  • Wireframes dapat menjadi cara yang baik bagi analis bisnis atau pemangku kepentingan non-visual lainnya untuk mengkomunikasikan data meta dasar. Mendesain dalam browser mungkin akan berlebihan karena tujuan pada tahap ini adalah untuk menghasilkan sesuatu yang longgar untuk diskusi.
  • Perencanaan dan pemikiran ke depan dengan mock up yang lower fidelity dapat menyebabkan penurunan dalam waktu pengembangan yang cukup besar.

Kekurangannya

  • Mendesain untuk web yang responsif dapat terasa berulang-ulang di Photoshop dan tidak menerjemahkan secara realistis seperti apa bentuk produk yang sebenarnya. Dalam pengalaman saya, lebih mudah untuk mengotak-atik media query Anda dengan mata untuk perangkat yang berbeda, mendapatkan feedback real time dari apa yang sebenarnya akan terlihat, daripada menghasilkan sejumlah mock up spekulatif di Photoshop.
  • Ada kesulitan mengenali keterbatasan teknis saat mendesain di Photoshop. Misalnya, pernah saya mendesain sebuah landing page untuk klien. Landing page ini menampilkan capture box email, yang kemudian menjadi sangat sulit untuk didesain karena kerumitannya. Di akhir saya "dirancang" di browser dengan cara yang malas, yang adalah jauh lebih praktis.

Kesimpulan

Kreativitas adalah tool independen. Bekerja secara langsung di browser akan menghadapkan Anda segera dengan keterbatasan yang mungkin terjadi dan membantu Anda mengembangkan desain Anda. Namun, dalam pengalaman saya itu bukan pengganti untuk desain awal di UxPin dan Adobe Photoshop. Pendekatan-pendekatan ini juga tidak saling eksklusif. Saya banyak menggunakan Adobe Photoshop, bahkan ketika mendesain di browser. Belakangan Photoshop ia juga memiliki beberapa extension hebat untuk membantu Anda kode yang jauh lebih efisien.

Apakah Anda seorang desainer yang melakukan coding? Atau apakah Anda lebih suka melakukan mock up di software publishing desktop seperti Photoshop? Tinggalkan komentar di bawah!

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.