UJIAN TENGAH SEMESTER

INTERAKSI MANUSIA DAN KOMPUTER

RinG (Rent in Guarantee)

Nama Dosen:
Vikky Aprelia Windarni, S.Kom., M.Cs
Muhammad Misbahul Munir, M.Kom

Kelas : 20TI04

GILES PALENDYA THESSA W 20.82.1029

MUHAMMAD IQBAL HAFIZH 20.82.1062
DWI MUHAMMAD JUSTIN 20.82.1063

SEMESTER GANJIL TAHUN AJARAN 2022/2023

UNIVERSITAS AMIKOM YOGYAKARTA
2022
1. Introduction
1.1. Purpose
a. Aplikasi ini bertujuan untuk mempermudah pecinta alam yang ingin mendaki
akan tetapi tidak memiliki peralatan yang dibutuhkan.
b. Menyediakan berbagai macam alat dengan harga yang ekonomis.
c. Persyaratan sewa yang mudah dan cepat.

1.2. Scope
Semua hal yang tercantum dalam dokumen ini merupakan bagian dari ruang
lingkup kebutuhan pengembangan Aplikasi RinG.

a. Admin memasukkan produk-produk yang tersedia dan menginputkan jumlah

stok barang yang dimiliki toko. Data-data nama barang dan stok barang
ditampilkan pada bagian Katalog Produk.
b. Melalui bagian stok, Admin dapat merubah atau menambahkan nama barang
dan stok barang. Perubahan ini kemudian ditampilkan di bagian Katalog
Produk.
c. Admin dapat merubah harga dan memberikan voucher diskon. Voucher diskon
ini hanya berlaku untuk member RinG.
d. Pembeli dapat melakukan pembayaran dengan 3 (tiga) metode pembayaran,
yaitu Cash on Delivery (COD), E-Wallet, dan Debit Card
1.3. Diagram flow
Berikut adalah alur system dari user membuka aplikasi hingga proses akhir
2. Functional and Requirements
2.1. User Characteristic
User yang terlibat dalam pengoperasian system ini adalah :
a. Admin
b. Pembeli

2.2. Menus
1) Menu Utama
• Katalog : Menampilkan barang berdasarkan kategori.
• Keranjang : Menampilkan barang yang sudah dipilih.
• Rekomendasi : Menampilkan barang-barang terlaris.
2) Keranjang
• Checkout : Menampilkan total biaya pembayaran.
3) Pembayaran
• Metode Pembayaran : Memilih metode pembayaran.
4) Akun
• Pesananmu : Menampilkan barang yang sudah dibayar.
• Login/Daftar : Login atau daftar menggunakan email.

2.3. Interactions
1) Pada menu login, jika username/password salah akan muncul notifikasi.
2) Jika mengklik tiap icon atau menu, icon atau menu tersebut akan berubah warna
(highlight).
3) Jika mengklik menu akun, maka akan muncul menu akun dengan slide dari
kanan ke kiri.
4) Pada bagian keranjang, jika menghapus barang dari list maka akan hilang
dengan cara fade-out.
3. User Interface Design
3.1. Company Logo

3.2. Meaning
Logo ini memiliki makna pada beberapa bentuk yang ada, antara lain yaitu:
• 3 Gunung
Bentuk ini menggambarkan bahwa terdapat 3 orang besar yang berjasa atas
berdirinya RinG.
• Warna Hijau
Warna ini mewakili warna alam sekaligus memiliki makna perkembangan,
yang diharapkan Rin Gini akan terus berkembang.
• 2 Pohon dan Petir didalam Segitiga
Bentuk ini bermakna bahwa barang yang kami sewakan merupakan barang
kualitas tinggi yang kuat disegala kondisi walaupun badai sekalipun.
3.3. Colors Palette
a. Primary Colors

b. Colors Pallete

3.4. Typography
a. Primary Typeface
Font utama yang digunakan pada desain Interface ini adalah Montserat. Adapun
tipe yang kami pakai adalah sebagai berikut:
 b. Secondary Typeface
Font sekunder yang digunakan pada desain antarmuka ini adalah Barlow
Condensed. Berikut tipe yang kami pakai:

3.5. Icons