doc1

1. Tugas Kelompok ke-3
Week 8
Ketentuan umum:
Tugas kelompok akan dilakukan dalam bentuk Proyek perancangan UI/UX dari aplikasi atau
website. Setiap kelompok bebas menentukan proyek aplikasi/website yang akan dikerjakan.
Tugas proyek ini akan dilakukan berkelanjutan mulai dari tugas kelompok 1 – 4.
Carilah website atau mobile apps yang sejenis dengan proyek yang akan anda buat. Misalkan
anda akan membuat website toko buku online, maka beberapa contoh yang dapat ambil adalah
gramedia.com dan amazon.com.
Pada Aplikasi / Website pada project kami yaitu Aplikasi/Website penyewaan sepeda dengan
metode pinjam pakai sepeda, perancangan ini kami pilih dilatarbelakangi oleh kebutuhan orang-
orang untuk melakukan kegiatan hobinya dalam hal ini bersepeda/gowes di lokasi yang berbeda
dari domisilinya, kebanyakan orang akan merasa cukup merepotkan saat harus
menenteng/membawa sepeda ke lokasi liburan dikarenakan berbagai faktor seperti tidak
cukupnya ruang dalam kendaraan dan lainnya.
1. Berdasarkan wesbite/apps yang sudah anda pilih, carilah contoh-contoh User
interface (UI) yang menurut anda sudah atau belum mengikuti pedoman Gestalt.
Jelaskan jawaban anda tipe pedoman gestalt yang sudah/belum diterapkan oleh UI
tersebut. (berikan 5 contoh)
Gestalt adalah sebuah teori yang menjelaskan proses persepsi melalui
pengorganisasian komponen-komponen sensasi yang memiliki hubungan, pola atau
kemiripan menjadi kesatuan. Teori Gestalt berupaya mengurangi pembagian sensasi
menjadi bagian-bagian kecil. Teori Gestalt banyak dipakai dalam proses desain karena
banyak menjelaskan bagaimana persepsi visual bisa terbentuk.
5 Prinsip Gestalt: Proximity, Similarity, Continuation, Figure/Ground, Focal Point
dan Simplicity
1. Proximity
Proximity adalah jarak relatif antar objek yang mempengaruhi persepsi kita
tentang bagaimana objek diatur dalam sub grup. Objek yang dekat satu sama
ISYS6619 -UX for Digital Business
Anggota Kelompok:
1. Yoga Yuniar BM (2402014001)
2. Wisamtama AA (2402012690)
3. Andree Fathurizki (240201995924)

2. lain tampak berada dalam satu grup dan objek yang berjauhan tidak dalam
satu grup.
Pada contoh penggunaan Prinsip Proximity pada website www.tiket.com dimana kita bisa
mengelompokkan menu berdasarkan kategori dan jenisnya. Hal ini mempengaruhi persepsi
kita mengenai pengelompokan grup berdasarkan jenis dalam case ini adalah merek mobil
nya.
Secara spesifik untuk aplikasi/website penyewaan sepeda yang sejenis dengan projek kami
adalah https://sewasepeda.net dimana belum diterapkan nya prinsip proximity sehingga
produk yang di tawarkan bercampur dan tidak dapat dikategorikan
ISYS6619 -UX for Digital Business

3. 2. Similarity
Elemen-elemen secara visual dapat dikelompokkan bersama jika elemen
tersebut memiliki kesamaan visual. Navigasi yang memiliki peran-peran
berbeda seperti menu, kategori produk, bermacam tombol action, kesemuanya
dapat dengan mudah dikomunikasikan masing-masing perannya dengan
menerapkan prinsip kesamaan Gestalt.
ISYS6619 -UX for Digital Business

4. Terlihat prinsip Similarity dan Proximity digunakan untuk mengelompokkan
kategori daerah. Website : https://salsawisata.com/rental-mobil/ . Sementara
pada website https://sewasepeda.net belum menerapkan hal tersebut
3. Continuation
Prinsip ini membantu kita membelokkan perhatian untuk beralih ke sebuah
objek yang kita tentukan agar user memperhatikan objek tersebut. Penerapan
prinsip continuity ini terlihat pada elemen waktu melakukan pemesanan
ISYS6619 -UX for Digital Business

5. ISYS6619 -UX for Digital Business
Adanya Continuation setelah user
melakukan pemilihan barang

6. Terdapat indicator yang harus diisi terlebih dahulu oleh pengguna sebelum proses
check out pesanan bisa diproses lebih lanjut ke pembayaran dengan menampilkan
Langkah – Langkah checkout Website : www.tiket.com
4. Figure/Ground
Prinsip Multi-stability menjelaskan bahwa mata akan memisahkan seluruh
obyek dari latar belakangnya untuk memahami apa yang sedang dilihat.
Persepsi seseorang saat melihat suatu objek di bagian atas akan lebih kuat
daripada latar belakangnya, terutama pada saat objek dan latar belakangnya
ditampilkan secara bersamaan.
Penerapan pada website : https://sewasepeda.net terdapat pada bagian Home /
landing page dengan slogan dan tagline yang di usung pada website tersebut.
Sementara ada kelebihan dan keunggulan service yang ditawarkan langsung
diberikan pada halaman utama sehingga Persepsi seseorang saat melihat suatu
objek di bagian atas akan lebih kuat daripada latar belakangnya.
ISYS6619 -UX for Digital Business

7. 5. Focal Point
Prinsip ini menyatakan bahwa Obyek dengan point of interest akan lebih
cepat ditangkap mata dan lebih menarik perhatian karena adanya penekanan
atau perbedaan dari unsur objek lainnya. Penerapan pada website sering
digunakan terutama pada foto/gambar dan teks pada homepage dengan
ukuran yang lebih besar, untuk menarik perhatian pengunjung supaya tertarik
dengan poin utama yang ingin ditunjukan.
Pada Website www.tiket.com Objek dengan point interest ditangkap dalam
bentuk flyer promo ketika melakukan pembayaran dengan PayLater. Dimana
hal ini akan menarik user dalam melihat website untuk pertama kalinya.
6. Simplicity
Simplicity adalah prinsip dasar dari Gestalt. Elemen yang sederhana, jelas,
dan teratur dapat menyampaikan pesan secara jelas dan tidak
membingungkan. Ketika dihadapkan dengan bentuk kompleks, mata
cenderung menata kembali obyek yang tidak beraturan menjadi komponen
sederhana atau menjadi satu kesatuan sederhana. Prinsip ini mengedepankan
kesederhanaan dalam desain. Fokus pada fitur/elemen yang benar-benar
dibutuhkan, sehingga menghasilkan desain yang sederhana, fungsional clean
dan teratur.
ISYS6619 -UX for Digital Business

8. Pada Website : https://salsawisata.com/sewa-motor/ terdapat element
simplicity dengan mengedepankan elemen yang sederhara berupa deskripsi,
gambar dan desain yang ditampilkan. Pada prinsip ini, fitur dan elemen
terlihat pada beberapa pilihan dibagian atas
ISYS6619 -UX for Digital Business

9. 2. Berdasarkan website/apps yang anda pilih, berikan pendapat anda mengenai navigasi
yang diterapkan pada website/apps tersebut. Sebutkan kelebihan serta kekurangan
dari navigasi tersebut.
a. Tiket.com
ISYS6619 -UX for Digital Business

10. Pada laman web https://www.tiket.com/ terdapat ikon yang sudah terpampang cukup
jelas sehingga memudahkan proses navigasi dari user itu sendiri yang memberi user
beberapa konteks untuk berbagai tautan, terdapat dengan sangat baik untuk utilitas
menu - yang menampilkan tautan untuk pencarian, pembelian tiket kendaraan umum,
pembelian tiket hotel, pembelian tiket event, pendaftaran / login pengguna, dll. Selain
dari itu menu juga diletakan pada halaman yang berbeda seperti terdapat sub menu to
do yang terdiri dari 11 Sub menu yang mana apabila diletakkan pada halaman utama
dapat terlalu membuat ramai halaman utama.
Kelebihan lain masih terdapat pada tampilan awal dimana penempatan elemen
desain seperti slider besar dan animasi yang sering mengalihkan perhatian
pengguna ditambah dengan informasi yang paling sering dicari seperti
kelebihan/keuntungan menggunakan web dan cara melakukan penyicilan
pembayaran serta pemilihan desain yang tidak ramai dengan cara-cara kreatif
untuk menjaga gangguan-gangguan lainnya seminimal mungkin, seperti
menambahkan white-space atau warna tebal ke menu mungkin sudah cukup.
ISYS6619 -UX for Digital Business

11. Pada tampilan pemilihan lokasi hotel belum ada menu/ikon untuk memilih
lokasi hotel terdekat berdasarkan live lokasi hal ini mungkin dapat menyebabkan
tindakan yang lebih banyak bagi pengguna untuk mencari hotel terdekat dari live
lokasi pengguna.
ISYS6619 -UX for Digital Business

12. b. Sewasepeda.net
Halaman utama sewa sepeda
Pada website sewasepeda, secara tipikal di bagian menu utama terdapat bar
navigasi, dan penempatan menu di bagian kanan merupakan penempatan ideal
untuk desain UX. Hanya saja terdapat menu keranjang, checkout, dan
konfirmasi pembayaran yang mana seharusnya menu seperti ini bisa di akses
ketika sudah login, sehingga menu seperti ini dirasa kurang tepat untuk di
bagian navigasi menu utama.
ISYS6619 -UX for Digital Business

13. Pada bagian menu etalase sepeda, terdapat navigasi untuk mensortir jenis
sepeda yang disewakan, navigasinya dirarsa cukup dan mudah untuk dilihat,
pada bagian etalase pun sudah menggunakan metode chunking, hanya saja
margin pemisah antar barang terlalu renggang sehingga dirasa kurang ideal.
ISYS6619 -UX for Digital Business

14. Pada menu kontak, navigasi yang berfungsi hanya pada bagian email, sisa
navigasi bar yang lain hanya mendirect ke halaman utama saja.
ISYS6619 -UX for Digital Business