Perancangan layar merupakan awal dari pembuatan user interface yang akan diterapkan dalam cloud storage Yayasan WWF-Indonesia. Berikut rancangan layar yang dibagi ke beberapa halaman:
a. Halaman Index
Gambar 3.42 Gambar Halaman Sign In
Tabel 3.2 Menu Halaman Sign In
Menu Keterangan
Username User memasukan username yang sudah terdaftar pada sistem saat sign up
Password User memasukan password sebagai bukti atau validasi terdaftar atau tidaknya user dalam sistem
Remember Me Digunakan agar cookies tersimpan, sehingga user tidak perlu melakukan sign in.
Sign Up Button menuju halaman sign up
Login Button menuju halaman index user
b. Halaman Sign Up
Gambar 3.43 Gambar Halaman Sign Up
Tabel 3.3 Menu Halaman Sign Up
Menu Keterangan
Username Username dipilih oleh user untuk validasi saat melakukan login setelah user terdaftar
Password Kata sandi yang dimasukan oleh user, sebagai alat validasi
saat user melakukan login
Fullname User memasukan nama lengkapnya
Email User memasukan email
Gender User memilih jenis kelaminnya.
Birtday Untuk user menginput tanggal kelahirannya.
Submit Untuk men-submit data yang telah dimasukan user, kemudian disimpan didalam database
c. Home User
Gambar 3.44 Gambar Halaman Home User
Tabel 3.4 Menu Halaman Home
Menu Keterangan
Home User kembali ke halaman Home
File User masuk ke halaman File untuk mengorganisir filenya
Inbox User masuk ke halaman Inbox untuk melihat pesan yang masuk
Request Quota User masuk ke halaman Request Quota bila memerlukan kuota lebih untuk akunnya
Sign Out User keluar dari sessionnya
d. Halaman File
Gambar 3.45 Gambar Halaman File
Tabel 3.5 Menu Halaman File
Menu Keterangan
Home User masuk ke halaman Home
File User masuk ke halaman File untuk mengorganisir filenya
Inbox User masuk ke halaman Inbox untuk melihat pesan yang masuk
Request Quota User masuk ke halaman Request Quota bila memerlukan kuota lebih untuk akunnya
Sign Out User keluar dari sessionnya
Delete User menghapus file yang sudah tidak terpakai dari akunnya
Download User men-download file yang dipilih
Share User membagi file ke koleganya
Upload Your File User meng-upload file
e. Halaman Request quota
Gambar 3.46 Gambar Halaman Request Quota
Tabel 3.6 Menu Halaman Request Quota
Menu Keterangan
Home User masuk ke halaman Home
File User masuk ke halaman File untuk mengorganisir filenya
Inbox User masuk ke halaman Inbox untuk melihat pesan yang masuk
Request Quota User masuk ke halaman Request Quota bila memerlukan
kuota lebih untuk akunnya
Sign Out User keluar dari sessionnya
Request User memilih jumlah kuota yang diinginkan untuk ditambahkan
Description User mengirimkan pesan keterangan untuk apa tambahan kuota tersebut digunakan
Submit User men-submit requestnya
f. Halaman Manage Access File
Gambar 3.47 Gambar Halaman Manage Access
Tabel 3.7 Menu Halaman Manage Access
Menu Keterangan
Manage Quota Admin masuk ke halaman Manage Quota
Request Admin melihat permintaan penambahan kuota yang masuk
Manage Access Admin masuk ke halaman Manage Access
Sign Out Admin keluar dari session-nya
User Admin memilih user yang akan di-manage hak aksesnya
Division Admin menentukan pada divisi mana saja user dapat membagikan file-nya
g. Halaman Inbox
Gambar 3.48 Gambar Halaman Inbox
Tabel 3.8 Menu Halaman Inbox
Menu Keterangan
Home User masuk ke halaman Home
File User masuk ke halaman File untuk mengorganisir filenya
Inbox User masuk ke halaman Inbox untuk melihat pesan yang masuk
Request Quota User masuk ke halaman Request Quota bila memerlukan kuota lebih untuk akunnya
Sign Out User keluar dari sessionnya
Unread Combo box ini berguna untuk mensortir message dari yang sudah dibaca maupun yang belum dibaca
Sender Pengirim yang mengirimkan pesan ke user
Delete User menghapus message yang sudah tidak dibutuhkan
h. Halaman Share File
Gambar 3.49 Gambar Halaman Share File
Tabel 3.9 Menu Halaman Share File
Menu Keterangan
Home User masuk ke halaman Home
File User masuk ke halaman File untuk mengorganisir filenya
Inbox User masuk ke halaman Inbox untuk melihat pesan yang
masuk
Request Quota User masuk ke halaman Request Quota bila memerlukan kuota lebih untuk akunnya
Sign Out User keluar dari sessionnya
Send To User memilih kolega yang akan dibagi file tersebut
Message User mengirimkan pesan keterangan file tersebut kepada koleganya
Share User membagi file ke koleganya
i. Halaman Upload File
Gambar 3.50 Gambar Halaman Upload File
Tabel 3.10 Menu Halaman Upload File
Menu Keterangan
Home User masuk ke halaman Home
File User masuk ke halaman File untuk mengorganisir filenya
Inbox User masuk ke halaman Inbox untuk melihat pesan yang masuk
Request Quota User masuk ke halaman Request Quota bila memerlukan kuota lebih untuk akunnya
Sign Out User keluar dari sessionnya
Choose File User memilih file yang akan di-upload
Send To User memilih siapa kolega yang akan dibagi file tersebut
Message User menuliskan pesan mengapa mengirimkan file tersebut
Submit User meng-upload file yang telah dipilih
j. Halaman Manage Quota
Gambar 3.51 Gambar Halaman Manage Quota
Tabel 3.11 Menu Halaman Manage Quota
Menu Keterangan
Manage Quota Admin masuk ke halaman Manage Quota
Request Admin melihat permintaan penambahan kuota yang masuk
Manage Access Admin masuk ke halaman Manage Access
Sign Out Admin keluar dari session-nya
Search Admin mencari nama user yang ingin di manage quota-nya
Add Quota Admin menambahkan kuota user sesuai permintaan user
Subtract Quota Admin mengembalikan kuota awal user setelah kuota user ditambahkan
k. Halaman Request Admin
Gambar 3.52 Gambar Halaman Request Admin
Tabel 3.12 Menu Halaman Request
Menu Keterangan
Manage Quota Admin masuk ke halaman Manage Quota
Request Admin melihat permintaan penambahan kuota yang masuk
Manage Access Admin masuk ke halaman Manage Access
Sign Out Admin keluar dari session-nya
Search Admin mencari nama user yang ingin di manage quota-nya
Delete Admin menambahkan kuota user sesuai permintaan user
l. Halaman Subtract Quota Admin
Gambar 3.53 Gambar Halaman Quota Admin
Tabel 3.13 Menu Halaman Subtract Quota
Menu Keterangan
Manage Quota Admin masuk ke halaman Manage Quota
Request Admin melihat permintaan penambahan kuota yang masuk
Manage Access Admin masuk ke halaman Manage Access
Sign Out Admin keluar dari session-nya
Username Username yang tertera adalah username yang sebelumnya sudah dipilih Admin di halaman Manage Quota
Subtract Admin mengembalikan kuota user ke kuota awal
m. Halaman Add Quota
Gambar 3.54 Gambar Halaman Add Quota
Tabel 3.14 Menu Halaman Add Quota
Menu Keterangan
Manage Quota Admin masuk ke halaman Manage Quota
Request Admin melihat permintaan penambahan kuota yang masuk
Manage Access Admin masuk ke halaman Manage Access
Sign Out Admin keluar dari session-nya
Username Username yang tertera adalah username yang sebelumnya sudah dipilih Admin di halaman Manage Quota
Add Quota Admin memilih besar kuota yang ingin ditambahkan ke user tersebut