Weekly Report 17/4/2016 - Muhamad Farhan Dzikri

Dalam 2 minggu ini yang saya kerjakan adalah menentukan primary color, secondary color dan accent color. Pilihan warna yang saya ambil dari primary color yaitu warna hitam di halaman login, secondary color yaitu warna kotak untuk mengisi nama saat registrasi, dan biru muda accent color sebagai headernya.

Kemudian saya jugamendesign halaman yang telah dibuat Luthfi agar sesuai dengan uiux aplikasi yang telah saya rancang sebelumnya. Design awal yang Luthfi buat adalah seperti berikut ini

Karena uiux saya gabungkan dengan gaya material design, maka saya berniat akan mengubah designnya menjadi seperti gambar dibawah ini. Ini adalah mock up yang saya buat di Corel Draw. Inspirasinya adalah dari aplikasi WhatsApp bagian settings.

Kemudian design ini saya implementasikan di Android studio sehingga hasilnya seperti gambar dibawah ini. Ukuran font, jarak hingga warna saya ikuti dari guideline material design. Ukuran font besar adalah 16sp, ukuran font kecil adalah 14sp dengan warna #88888, tinggi list adalah 72dp, dan padding kanan kiri adalah 16dp.

Setelah itu saya memasukkan fungsi dialog pada masing2 list. Jika di klik list akan menampilkan kotak dialog seperti ini.

Untuk menampilkan kotak dialog seperti ini kode yang dibuat cukup simple. Saya mempelajari kode ini dan berikut adalah penjelasannya.

Kode terdiri dari menampilkan Alert Dialog, Set View, Postive button, Negative button, Single Choice button, dan OnClickListener.
Alert dialog adalah fungsi untuk menampilkan kotak putih seperti gambar diatas.
Set view adalah fungsi untuk mengisi kotak alert dialog.
Positive button adalah fungsi untuk menyetujui pilihan alert dialog.
Negative button adalah fungsi untuk membatalkan pilihan alert dialog.
Single choice adalah isi dari alert dialog untuk membuat pilihan yang hanya dapat dipilih satu.
On click listener adalah fungsi untuk membuat respon dari fungsi2 yang diimplementasikan.
Di kode bagian awah ada fungsi SetText, tugasnya adalah untuk mengubah tulisan di halaman depan agar sesuai dengan pilihan user.

Selain itu saya juga mengimplementasikan Toast dimana fungsi tersebut akan menampilkan tulisan di dekat home button. Tujuannya adalah agar user mendapatkan feedback dari hasil pilihannya. Hasilnya dapat dilihat di gambar bawah berikut.

Namun setelah saya buat, saya mendapatkan inspirasi lain untuk mendesign uiux halaman ini. Saya terinspirasi dari Google Calendar seperti dibawah ini.

Saya merasa tampilan diatas lebih cokok untuk dijadikan tampilan membuat amalan baru. Karena halaman whatsapp diatas bukanlah halaman membuat, tapi mengubah settings. Jadi sebelum saya mengimplementasikannya di Android Studio saya mencoba membuat mockupnya di Corel Draw untuk saya tanyakan kepada teman2. Sejauh ini hasilnya adalah seperti berikut.