Mari Putus Mata Rantai Penyebaran Virus Covid-19 dengan Tetap Jalankan Protokol Kesehatan Jaga Jarak dan Tetap Pakai Masker Sesuai Standar Pemerintah, Dan Selalu Bawa Hands Sanitizer Saat Keluar Rumah. Tetap Jaga Kesehatan dengan Olahraga dan Makan-makanan yang Sehat info lebih lanjut www.covid19.go.id

Mockup Aplikasi Beserta Cara Membuat Mockup






Dalam pembuatan dan desain, mockup, atau mock-up, adalah model skala atau ukuran penuh dari desain atau perangkat, yang digunakan untuk pengajaran, demonstrasi, evaluasi desain, promosi, dan tujuan lain. Maket adalah prototipe jika menyediakan setidaknya sebagian dari fungsionalitas sistem dan memungkinkan pengujian suatu desain.  Mock-up digunakan oleh desainer terutama untuk mendapatkan umpan balik dari pengguna. Mock-up membahas ide yang ditangkap dalam rekayasa satu-liner. mockup menyampaikan aspek desain visual, termasuk gambar, warna, dan tipografi. Mockup memberikan gambaran secara detail sebelum produk dibuat.

Berikut adalah beberapa kelebihan mockup:

   1. Mengorganisir detail dari proyek
   2. Menemukan error
   3. Menterjemahkan ide ke dalam bahasa yang dapat dimengerti stakeholders
   4. Menyampaikan ide kepada anggota tim
   5. Implementasi desain
   6. Perspektif user

Prototype dapat diklik dan anda akan mendapat respon. Prototype mensimulasikan bagaimana user berinteraksi dengan user interface secara nyata, meningkatkan komunikasi yang efektif sehingga memungkinkan desainer untuk menguji user journey dan menemukan masalah potensial pada tahap awal.

Wireframe, mockup, dan prototype memiliki ciri khasnya masing-masing. Penggunaannya dapat disesuaikan dengan kebutuhan. Namun, satu hal yang harus diingat yaitu: jangan membuat wireframe, mockup, atau prototype tanpa adanya pemikiran terhadap user.

Berikut cara cara membuat Mockup Aplikasi 

1. Membuat sketsa di kertas

Buatlah sketsa di kertas sesuai konsep aplikasi yang ingin anda buat atau sesuaikan selera anda.
 
2. Menggunakan Tools Online

Seperti Moqups atau Balsamiq, akan memberikan segala yang dibutuhkan untuk membangun mockup dan memfasilitasi seluruh proses. Tools ini dirancang untuk membuat proses pembuatan semudah mungkin, sehingga kamu dapat lebih fokus pada keputusan gaya dan mengambil pelajaran tentang cara memanipulasi program.
balsamiq cover

Para ahli dan pemula merasa paling nyaman dengan mockup tools. Sebagaian pemula lebih memilih kemudahan penggunaan, sementara para ahli menghargai desain khusus yang disesuaikan dengan kebutuhan canggih mereka.

Moqups dan Balsamiq menyediakan fungsionalitas lebih dari alat non-desain yang terkadang digunakan untuk wireframes dan mockup (seperti Keynote).

Ketika datang pada mockup tools, banyak yang ditargetkan untuk wireframingdari mockup nyata. Dengan kolaborasi built-in, UXPin menawarkan puluhan elemen perpustakaan untuk menghemat waktu, dan unsur sederhana untukdragging, dropping, dan customizing untuk membuat mockup.
 
3. Menggunakan Software Desain Grafis

Beberapa UX desainer banyak menggunakan software seperti Photoshop, Sketch, atau Illustrator, terutama yang sangat terampil atau akrab dengan tools yang menawarkan kontrol ke pixel. Nick Pettit dari Treehouse menunjukkan pada piece explaining mockup types, platform desain grafis bekerja dengan baik jika kamu bertujuan untuk realisme tingkat tertinggi dan kesetiaan visual.

Bekerja dalam software desain grafis memberikanmu akses ke definisi pilihan warna yang tak terbatas, jadi jika kamu bekerja dalam pembatasan skema warna yang kaku dan ditetapkan misalnya, di bawah aturan brand tertentu, maka program ini dapat menjadi pilihan yang terbaik. Lebih dari pilihan warna, program ini menawarkan tools yang jauh lebih visual, yang memungkinkanmu untuk mengatasi hal-hal kecil secara detail.

Namun, kelemahan menggunakan software jenis ini adalah bahwa hal itu bisa sulit untuk menerjemahkan ketika tiba saatnya untuk memulai coding desain. Apa yang bekerja di Photoshop mungkin tidak selalu bekerja dalam kode (unsur-unsur seperti fonts, shadows, gradient effects, dll), yang dapat membuang waktu dalam mencari tahu solusi untuk tahap prototipe.

Seperti dijelaskan dalam The Guide to Mockups, software desain grafis hanya direkomendasikan jika kesetiaan visual yang tinggi adalah prioritas utama. Jika kamu memiliki halaman dengan style berat, mungkin ini akan membantu untuk menuntaskan rincian visual yang spesifik dalam proses mockup (dalam hal Photoshop atau Sketch akan memberikan banyak pilihan).

Ini juga layak disebutkan bahwa mockups yang dibuat dalam Photoshop atauSketch dapat di drag dan drop ke tahap prototyping dengan UXPin. Ini memungkinkanmu menghidupkan semua lapisan (tidak merata) dengan beberapa klik dengan mudah, dan memastikanmu untuk tidak perlu mulai dari awal ketika saatnya untuk prototype.

Jika visual bukan merupakan prioritas, kamu mungkin akan lebih efisien menggunakan alat yang memungkinkan untuk melakukan wireframing, mockups, dan prototyping dalam satu tempat. Software desain grafis dapat menjadi masalah pada mockup kecuali jika kamu sedang mencari visualisasi yang optimal. Sebagai desainer yang menguasai UX, kamu pasti akan perlu berkomunikasi secara teratur dengan developer karena alat ini tidak dirancang untuk kolaborasi.
 
4. Coding Mockup-mu

Untuk para pemula, terutama jika kamu UX desainer dan tidak nyaman dengan coding, maka ini jelas bukan suatu pilihan. Sebagaimana dijelaskan dalam The Guide to Mockups, coded mockups bukan pilihan default.

Kebanyakan coding dapat ditunda sampai prototyping (jika kamu membuat sebuah HTML / Javascript prototype) atau bahkan kemudian (jika kamu menggunakan prototyping tool). Tapi meskipun kompleksitas dan hambatan potensial, ada banyak desainer menganjurkan memperkenalkan coding ke tahap mockup.

Post a Comment

0 Comments