Ngomongin login

Disclammer duls: ini opini saya pribadi heheh

Halo gess kembali lagi bersama hamba pada kesempatan kali ini kita akan bedah desain login app yang telah saya buat.Jadi kita akan kupas dari hasil teori riset dan mengapa saya desain loginnya “biasa”.

Login kan emang patternnya gitu gitu aja, pasti temen temen ada aja yang mengatakan seperti ini. pointnya bukan itu melainkan apakah temen temen pernah bertanya mengapa dibuat simple dan mengapa patternya seperti itu.

Sebelum membedah desain alangkah asiquenya kita liat beberapa metode login dan elemen yang dibutuhkan pada login ada apa saja disana.

Metode:

1. Standart pattern (email/username dan password)
2. No hp kemudian OTP
3. Passcode atau PIN

Elemen yang dibutuhkan biasanya ada:

1. Button
2. Field username atau password
3. Option login
4. Forgot password (ini opsi tergantung metode login yang diambil)

Setelah mengetahui beberapa metode dan elemen seputar login kita sekarang belajar tentang teori dasar tentang UI salah satunya adalah CTA, singkatnya CTA atau bisa disebut call to action elemen atau button yang berfungsi untuk melanjutkan sebuah flow atau transaksi. Oh iya transaksi disini bukan jual beli saja transaksi itu bisa dikatakan sebuah proses.

Contoh CTA gimana sih?

mungkin seperti halaman web twitter

Untuk mengetahui button mana yang menjadi CTA biasanya designer memberi warna kontras atau warna yang cerah. Dan CTA itu tidak hanya di login tapi terkadang ada di semua flow. Jadi kalau kita ngomongin ux nya nih user lebih mudah mengetahui harus ngapain step selanjutnya. Ga sekedar buat button berwarna juga wkwkw jadi kita harus mikir bagaimana dengan mudah user memahami CTA kita. Nah kalau contoh diatas twitter memberikan CTA nya pada sign up kenapa disitu? yang pertama twitter jelas ingin mengajak kita untuk daftar ke twitter yang faktor kedua adalah twitter ingin mejelaskan sebelum masuk ke aplikasi (twitter disini maksudnya) harusnya daftar terlebih dahulu. Balik ajakan ini untuk orang yang baru kenal twitter.

Udah cukup untuk CTAnya jika temen temen ingin belajar lebih mendalam tentang CTA bisa googling karena sudah banyak teori bertebaran disana

Balik ke topik ngomongin login, pada case kali ini saya membuat sebuah desain untuk 2 metode login satu meggunakan PIN satu lagi menggunakan standart pattern dengan opsi yang cukup beda.

Oke saya bedah satu satu dulu yang pertama adalah dari desain yang sederhana keduannya saya buat sederhana selain bisa di design to code user lebih mudah mengakses sebuah page tanpa harus eksplore (kapan kapan saya akan share kapan waktunya user eksplore pada desain yang kita buat).

Berikut adalah hasil desain saya, maaf jika jelek sebab saya juga masih belajar hehehe

https://dribbble.com/shots/16019063-Simple-Login-Method

Membedah desain Passcode atau PIN:

Lanjut untuk desain pertama saya jelaskan menggunakan PIN atau passcode sekarang juga lagi tren gaya pattern login seperti ini balik lagi untuk memudahkan user tanpa harus masukkan username selain itu menjaga privasi serta dalam sekuritas juga lebih aman. Pada desain yang saya buat terdapat elemen PIN itu sendiri, detail akun seperti nama dan foto pengguna terakhir ada lupa pin.

Nah sebelah deail akun saya juga menambahkan opsi switch account dimana sekarang banyak sekali apps yang menyediakan opsi login akun lebih dari 2 saya memahami ini dan udah lama riset biasanya ada di sosmed atau cloud storage. Mereka menyematkan fitur tersebut untuk membedakan personal dan bisnis se simple itu, Tapi biasalah namanya user kadang human error terjadi biasanya malah dibuat akun fake huaa wkwkwk.

Bedah desain standart pattern

Yap, pada desain kedua ini saya menggunakan standart pattern namun saya disini menambahkan opsi gmail dan nomer hp. Kenapa saya menambahkan opsi login seperti itu, sebernarnya opsi login seperti ini masuk kategori standart pattern juga biasanya selain email ada juga opsi lain seperti sosmed.

Namun disini saya lebih memilih untuk menggunakan opsi via nomor hp, nomer hp sendiri lebih baik sekuritasnya ketimbang sosmed karena langsung tembak OTP dan banyak juga yang menggunakan metode ini sebagai login.

Kalau bahasa jawa e “ringkes ora ribet”. Sedangkan untuk opsi kedua saya menggunakan gmail, yang mana pengguna gmail banyak dan mereka sering menggunakan gmail sebagai email sosmed. Daripada ribet ambil akarnya yaitu email simplenya seperti itu jadi keputusan saya ambil 2 email dan nomor hp.

Kesimpulan gess

Pada intinya login dibuat dengan pattern yang sederhana karena untuk memudahkan akses user pemberian opsi juga berperan penting yang mana pengguna mengalami human error seperti lupa password salah satunya. Dan secara psikologi user ingin cepat cepat masuk kedalam aplikasi tanpa harus explore ini button untuk apa pilih button yang mana. kemudian untuk mengetahui mana metode login yang pas untuk user kamu bisa melakukan A/B testing. Terakhir memikirkan pendetailan seperti icon mata pada password, field yang aktif warna apa dan informasi pada login harus tepat dan jelas.

Oke sekian duls gess semoga bermanfaat!