9. #NgobrolinTools — Membuat User Flow dengan Overflow

User flow dalam proses desain merupakan salah satu pondasi untuk mengarahkan user agar tidak kehilangan arah saat menggunakan produk yang kita desain, keseluruhan proses User Flow ini biasanya hanya berbasis Low Fidelity, kami menggunakannya untuk berdiskusi dengan Project Manager dan juga teman-teman developer.

Mbak Aimilia Tzanavari dalam sebuah artikelnya bilang:

User flows serve a particular purpose, and their benefits are widely known:

They’re a visual representation of the path the user can follow to achieve a goal.

Having this representation helps you reflect on the user’s flow, communicate it and get feedback. You can see it better yourself, but also your team and stakeholders can see, understand and provide input.

They allow you to compare alternatives, as well as evaluate and test them with real users before proceeding.

It’s easier and wiser to make changes on this level because it saves you from making more costly changes later on.

Nah, singkatnya…. dari sekian banyak Tools untuk membantu memvisualisasikan user flow saya tertarik dengan Overflow.

Apa itu Overflow?

Overflow merupakan tools untuk membuat user flow selain lebih jelas juga lebih menarik, seperti filosofinya:

“Meet Overflow Turn your designs into playable user flow diagrams that tell a story.”

Overflow merupakan salah satu produk dari Proto.io yang bergerak di lini prototyping tools selain Marvelapp, Invision dan kawan-kawan :D

Source: Overflow.io

Menurut saya, tools ini dapat digunakan sangat mudah untuk mempresentasikan user flow dan melihat keseluruhan desain yang telah kita buat. Walaupun masih versi beta, tapi banyak keuntungan yang didapatkan daripada beberapa plugin sketch untuk membuat user flow atau web prototype lain:

1. Bisa synchronize dari sketchapp maupun Adobe XD dan Figma

Saat install Aplikasi overflow, plugin akan otomatis terinstall ke Sketch / Adobe XD

1. Perpindahan frame ke frame lainnya mempunya Interaksi yang tidak membosankan, jadi cukup menarik untuk mempresentasikan kehadapan client atau stakeholders

Source: Overflow.io

3. Upload hasil ke cloud, dan akan mendapat link untuk dibagikan ke yang lain (metode yang sama seperti Sketch Cloud atau synchronize dari sketch app ke marvelapp) berikut contoh link dari dokumen yang saya upload ke cloud pakai desain sample tersedia: https://overflow.io/s/NZP8R6/

Mode Prototype dari link yang kita bagikan

4. Bisa membuat Prototype tersendiri seperti Prototyping tools lainnya, kita bisa mengubah mode untuk melihat user flow-nya atau langsung melihat prototype-nya, yaa walaupun belum sempurna tapi boleh laaah~

5. Dark Mode! yep.. di versi beta ini 0.8.0 overflow sudah menyediakan tema dark mode dan light mode

Tema Dark Mode dari Overflow

6. Interface dan Shortcut yang tidak jauh berbeda dari Sketch App

7. Export ke PNG atau PDF, untuk dokumentasi kita juga bisa export hasilnya ke format PNG maupun PDF lho..

8. Bisa pakai Offline, Yak! ini nih yang penting karna tidak semua tempat punya koneksi internet, jadi overflow ini punya aplikasi yang sementara cuma untuk Mac OS jadi pas membuat desain kita bisa sync langsung dari Sketch tanpa koneksi internet, nanti saat sudah terkoneksi internet kita bisa langsung upload ke cloud terus dibagikan ke tim.

9. FREE, Untuk saat ini mungkin karna masih versi Beta kita dapat menggunakan semua fitur tersebut secara Gratis.

Semoga Artikelnya membantu, Download Overflow di sini: https://overflow.io

Buat temen-temen yang suka dengan Kegiatan bermusik dan Juga Komunitas, dengerin Podcast Ngobras Di Jalan yang tersedia di Spotify, Apple Podcast serta Google Podcast.

Kritik dan Saran silahkan ke ngobrasdijalan@gmail.com