Published on

Technology

7 Rekomendasi aplikasi mockup website untuk kamu coba

Maria Tri Handayani

aplikasi-mockup-website---EKRUT.jpg

Mockup website adalah gambaran atau simulasi bagaimana sebuah website akan terlihat. Mockup akan merepresentasikan strukur dan logika wireframe beserta gambar, grafik, dan elemen UI yang nantinya akan ada pada tampilan final website tersebut. 

Nah, jika kamu hendak membuat mockup website, maka beberapa rekomendasi aplikasi mockup website ini bisa jadi alternatif untuk kamu gunakan. 

1. Adobe XD 

aplikasi mockup website - EKRUT
Adobe XD menyediakan fitur penyimpanan berbasis cloud - EKRUT

Adobe XD adalah salah satu aplikasi mockup website yang bisa kamu untuk menguji bagaimana website kamu akan terlihat di berbagai medium, seperti mobile, tablet, dan desktop. 

Tidak hanya untuk membuat mockup website, Adobe XD pada dasarnya juga bisa digunakan untuk membuat prototipe yang berfungsi penuh berdasarkan mockup yang kamu buat. 

Adobe XD menawarkan banyak fitur, seperti penyimpanan dan sinkronisasi data otomatis di folder Creative Cloud Files, serta aset grafis yang bisa dibuat dan digunakan kembali pada tools Adobe lainnya seperti Adobe Photoshop. Dengan fitur ini kamu bisa membuat desain di Adobe Photoshop dan memindahkannya ke Adobe XD saat membuat mockup

Aplikasi mockup website ini dapat digunakan secara gratis dengan kapasitas cloud storage sebesar 2 GB, namun dengan jumlah font dan fitur berbagi dokumen yang terbatas. Untuk fitur lebih lengkap kamu harus memilih paket berlangganan berbayar yang ditawarkan. 

2. InVision Freehand

aplikasi mockup website - EKRUT
Kamu dapat menggunakan InVision untuk langsung berkolaborasi dengan tim dalam merancang desain website - EKRUT

InVision Feehand adalah salah satu aplikasi mockup berbasis cloud terbaik. Beberapa fitur yang ditawarkan oleh InVision Freehand antara lain freehand drafting mode, interactive mockups, user testing, kolaborasi dan manajemen ide. 

Adapula fitur brainstorming di mana pengguna bisa memetakan pengalaman mereka dan memberikan umpan balik semua di satu tempat. Tidak hanya itu, aplikasi mockup ini juga terbilang sederhana dan mudah digunakan. 

InVision dapat digunakan secara gratis, namun ada batasan hanya untuk membuat satu prototipe saja. Kamu bisa memilih paket berlangganan untuk menggunakan semua fitur yang ada dengan lebih maksimal.

Baca juga: Catat, ini 10 tips desain UI/UX yang ‘menjual’

3. Moqups 

aplikasi mockup website - EKRUT
Selain untuk membuat mockup, Moqups juga bisa kamu gunakan untuk wireframing - EKRUT

Moqups juga merupakan tools yang  memungkinkan kamu membuat wireframe, mockup, diagram dan prototipe secara kolaboratif. 

Aplikasi mockup website ini mudah digunakan karena terstruktur dengan baik. Contohnya, pada bagian sidebar Moqups, kamu bisa menemukan template yang bisa kamu pindahkan ke area gambar dengan mudah. Selain itu ada banyak koleksi font dan icon yang juga bisa kamu gunakan untuk menunjang desain mockups. 

Sayangnya, untuk menggunakan Moqups secara gratis kamu hanya bisa membuat 1 proyek saja dengan kapasitas penyimpanan 5MB. Selain itu bila kamu tidak memilih berlanggan, maka kamu hanya bisa menggunakan koleksi objek dalam jumlah terbatas. 

4. Mockflow 

aplikasi mockup website - EKRUT
Mockflow memiliki fitur-fitur editor yang mudah digunakan - EKRUT

Kamu juga bisa membuat mockup website dengan menggunakan Mockflow. Aplikasi mockup ini memiliki antarmuka yang minimalis dan terorganisir. Terdapat pula template dan elemen seperti tombol, tabs, dan gambar yang bisa kamu gunakan. 

Mocklow pada dasarnya akan memudahkanmu dalam membuat dan mengedit mockups. Pasalnya, Mockflow memiliki editor dengan fitur-fitur lengkap yang mudah dipelajari. 

Mockflow juga menawarkan fitur kolaborasi sehingga kamu dapat mengatur proyek ke dalam folder dan sub halaman yang berbeda agar semua tetap rapi saat kamu membagikannya dengan anggota tim lainnya. 

Untuk menggunakannya, kamu bisa memilih paket basic yang pada dasarnya gratis atau paket berbayar bulanan. 

5. FluidUI

aplikasi mockup website - EKRUT
Kamu dapat menambahkan link ke dalam desain mockup dengan FluidUI - EKRUT

FluidUI adalah tools lainnya yang umum digunakan untuk membuat mockup website ataupun mobile app. Untuk membuat mockups dengan FluidUI kamu dapat menggunakan widget dan menu kontekstual yang muncul di layar dengan mudah. 

Terdapat pula built-in library dengan lebih dari 2000 jenis item yang biasa digunakan saat merancang desain website. Kamu juga dapat mengunggah desain sendiri untuk membuat perpustakaan khusus. 

FluidUI juga memungkinkan kamu menambahkan animasi, mouse actions dan link ke dalam desain untuk membuat tampilan mockup yang hampir sempurna dan menarik. 

Kamu dapat menggunakan FluidUI secara gratis, namun ada batasan yakni hanya untuk 1 proyek dengan maksimal 10 halaman.  Sementara untuk menggunakan semua fitur dengan maksimal kamu dapat memilih tiga paket berlangganan lainnya, mulai dari paket Solo, Pro dan Team. 

Baca juga: 5 Rekomendasi software desain grafis gratis selain Adobe

6. Balsamiq

aplikasi mockup website - EKRUT
Kamu bisa membuat template khusus yang bisa digunakan berulang di Balsamiq - EKRUT

Salah satu aplikasi mockup website populer lainnya yang bisa kamu gunakan adalah Balsamic. Tools ini menawarkan fitur-fitur yang membantumu membuat mockup yang interaktif dengan menggunakan elemen UI secara jelas dan cepat. 

Kamu bisa membuat built-in library berisi aset-aset seperti logo atau simbol yang sering kamu gunakan dalam berbagai proyek, atau membuat template khusus yang bisa digunakan kembali pada proyek-proyek lainnya. 

Tidak hanya itu ada pula fitur lain seperti export draft ke dalam format PDF atau PNG dan fitur kolaborasi dimana kamu bisa mengerjakan satu proyek yang sama bersama tim kamu. 

Untuk menggunakan Balsamiq kamu harus memilih paket berlangganan yang disesuaikan dengan biaya dan kapasitas cloud storage yang berbeda. Namun, jika untuk menggunakannya secara gratis kamu bisa memanfaatkan uji coba gratis 30 hari yang ditawarkan bagi pengguna baru. 

7. Marvel app

aplikasi mockup website - EKRUT
Kamu juga bisa menggunakan MarvelApp untuk user testing - EKRUT

Jika kamu ingin membuat mockup yang menarik dalam waktu yang singkat, maka Marvel App bisa jadi tools yang tepat untuk kamu pertimbangkan lainnya. 

Marvel App menyediakan spesifikasi desain otomatis untuk setiap proyek dimana dengan satu klik kamu bisa langsung dapat mengunduh aset dan menghasilkan kode CSS untuk desain kamu. 

Tidak hanya untuk mendesain mockup yang bagus, kamu juga bisa menggunakan Marvel App untuk melakukan user testing, lho. 

Kelebihan lain dari Marvel App yang tidak boleh dilewatkan adalah fitur integrasi Marvel App dengan tools lain seperti Slack dan Sketch, sehingga kamu juga bisa membuat desain sekaligus meningkatkan alur kerja di saat bersamaan. 

Sama seperti aplikasi mockup website lainnya, Marvel App dapat digunakan secara gratis maupun berbayar. Untuk menggunakan secara gratis, kamu hanya bisa menggunakan Marvel app untuk satu user dan terbatas untuk satu proyek. 

Sementara untuk memaksimalkan penggunaan fitur yang ada kamu bisa memilih paket berlangganan Pro Plan yang memungkinkan kamu membuat proyek tanpa batas di Marvel App, atau paket berlangganan Team Plus untuk multi user.

Itu dia beberapa 7 rekomendasi aplikasi mockup website yang bisa kamu gunakan. Pilih dan gunakan aplikasi mockup mana yang paling sesuai dengan kebutuhan kamu dalam proyek pengembangan website

Aplikasi mockup website - EKRUT

Sumber:

  • influencermarketinghub.com
  • mockplus.com
  • uxplanet.org
  • allthatsaas.com

Tags

Share