Berbicara tentang UI Awareness dari Scrum Booster

Iskarim Rezki
Scrum Booster
Published in
3 min readApr 17, 2019

Bagaimana dan kenapa UI Scrum booster ini dibuat sedemikian rupa

Sebagi Hipster dari tim, dalam merancang User Interface (UI) dari Scrum Booster ada beberapa hal yang diperhatikan. Seperti apakah pengguna akan nyaman dengan UI tersebut, apakah pengguna akan terbiasa dengan UI tersebut, apakah pengguna sudah terbiasa dengan UI tersebut. Hal — hal ini menjadi pedoman saya untuk melakukan design UI dari Scrum Booster.

Disini saya akan menerangkan beberapa contoh halaman yang kami buat berdasarkan aplikasi lain yang sudah ada.

Splash Screen

Splash screen dari Scrum Booster

Splash Screen adalah halaman yang muncul pertama kali saat membuka aplikasi. Pada umumnya, aplikasi yang memiliki branding akan memiliki splash screen. Biasanya halaman hanya akan muncul selama 2–3 detik kemudian masuk ke halaman utama atau boarding page. Splash Screen ini berfungsi untuk memberikan informasi ke user bahwa ia telah membuka aplikasi yang diinginkannya. Selain itu splash screen ini juga berfungsi untuk memberi waktu untuk aplikasi untuk memuat data yang dibutuhkan untuk menjalakan aplikasi.

BOARDING PAGE

Scrum Booster(kiri), Whatsapp(tengah), IGTV(kanan)

Setelah splash screen, pada umumnya aplikasi masuk pada halaman login atau sign up. Namun, karena berhubung aplikasi kami tidak memerlukan fitur tersebut maka aplikasi akan masuk ke menu boarding page. Menu boarding page ini berfungsi untuk memberikan informasi kepada user tujuan dari aplikasi ini dibuat. Memang tidak semua aplikasi mempunyai boarding page, namun belakangan ini sudah mulai banyak aplikasi yang memberikan update berupa halaman boarding page.

NAVBAR ICON

Scrum Booster (2 diatas), Gmail (2 dibawah)

Untuk icon pada navbar, pada aplikasi kami sama seperti pada aplikasi android pada umumnya, disebelah kiri terdapat icon 3 garis yang menunjukan untuk melihat menu drawer, dan disebelah kanan terdapat icon search untuk melakukan pecarian pada aplikasi.

Additional : Asset & Content Style

Untuk Asset dan content style dari aplikasi, saya berusaha agar aplikasi tidak kelihatan flat. Agar tidak kelihatan flat, saya melakukan round corner pada beberapa widget. Contoh nya adalah tombol get started pada boarding page dan 4 container nama phase utama pada scrum phase, serta bentuk image container yang bulat instead of square.

Mungkin itu saja beberapa alasan atau hal yang pertimbangkan pada saat merancang UI dari Scrum Booster. Untuk tampilan layout yang sama dari aplikasi lain bukan berarti kami menyontek, akan tetapi berusaha agar user nyaman dan terbiasa dengan aplikasi kami. Sekian Pembahasan blog saya kali ini, sampai bertemu di blog selanjutnya !

--

--

Iskarim Rezki
Scrum Booster

Computer Science Student and a passionate dreamer