75 lines
5.3 KiB
Markdown
75 lines
5.3 KiB
Markdown
# Dokumentasi
|
|
Aplikasi berbasis web yang bertujuan menampilkan informasi berupa pengumuman kepada seluruh pihak pada [**Perguruan Tinggi LEPISI**][8c020676].
|
|
|
|
[8c020676]: http://lepisi.ac.id "LEPISI"
|
|
|
|
## Tampilan
|
|
|
|
### Resolusi
|
|
Seluruh halaman ditampilkan dalam bentuk `full-screen`, sehingga menyesuaikan ukuran layar.
|
|
|
|
### Label Pemberitahuan
|
|
Label pemberitahuan adalah sebuah label yang berfungsi untuk menampilkan pemberitahuan kepada pengguna. Pemberitahuan ini dapat berupa `error`, maupun informasi tambahan (konfirmasi berhasil unggah data, dll).
|
|
|
|
|
|
### Tampilan Awal
|
|
Halaman yang pertama kali ditampilkan adalah halaman yang menampilkan pengumuman dalam ukuran teks yang besar. Jika jumlah pengumuman lebih dari 1, maka setiap pengumuman akan ditampilkan dengan metode animasi bergeser.<br>
|
|
Halaman inilah yang ditampilkan ke umum.
|
|
|
|
|
|
#### Navigasi
|
|
Secara kasat mata, terlihat tidak ada tombol navigasi pada halaman awal. Tetapi, telah tersedia tombol `masuk` (_login_) untuk `user` yang memiliki hak untuk mengubah/menambahkan/menghapus sebuah pengumuman.<br>
|
|
|
|
Tombol ini berada di sisi kanan atas halaman, jika user mengarahkan kursor ke sisi tersebut, maka tombol tersebut akan terlihat.
|
|
|
|
|
|
### Halaman Login/Masuk
|
|
Pada halaman ini, pengguna dapat memasukkan data akun mereka (`username` dan `password`) untuk mendapatkan hak akses untuk mengubah/menambahkan/menghapus pengumuman.
|
|
|
|
|
|
### Halaman Administrator
|
|
Setelah pengguna memasukkan data dengan benar, maka pengguna akan dialihkan ke halaman awal dengan tampilan yang berbeda.<br>
|
|
Pada halaman ini ditampilkan seluruh pengumuman yang telah dibuat dalam bentuk `stack` atau berupa kotak-kotak. Pada halaman ini juga terdapat 2 navigasi yaitu `primary` dan `secondary`.
|
|
|
|
|
|
#### Navigasi
|
|
Terdapat 2 jenis navigasi pada halaman administrator, yaitu `primary` dan `secondary`. Navigasi `primary` berfungsi untuk membantu pengguna untuk beralih antar halaman. Sedangkan navigasi `secondary` berfungsi untuk membantu pengguna untuk men-sortir pengumuman yang ingin ditampilkan.
|
|
|
|
##### Primary
|
|
Tersedia tombol `home` pada sisi kiri atas.<br>
|
|
> NB: Pada `mobile-view`, navigasi `primary` tersembunyi oleh tombol `menu` (3 garis horizontal) pada sisi kanan atas.
|
|
|
|
###### Hak Akses User
|
|
Terdapat tombol `keluar` (_logout_) yang terletak pada sisi kanan atas, yang berfungsi untuk melepaskan hak akses dari pengguna (_logout_).
|
|
|
|
|
|
###### Hak Akses Admin
|
|
Terdapat 3 tombol yang terletak pada sisi kanan atas, yaitu `kategori`, `user`, dan `keluar`.<br>
|
|
Tombol `kategori` berfungsi untuk mengalihkan pengguna ke halaman `Kategori`.<br>
|
|
Tombol `user` berfungsi untuk mengalihkan pengguna ke halaman registrasi `user` baru.
|
|
Tombol `keluar` berfungsi untuk melepaskan hak akses dari pengguna (_logout_).
|
|
|
|
|
|
##### Secondary
|
|
Navigasi ini berupa 4 tombol _sortir_ (`Semua`, `Aktif`, `Belum Aktif`, `Nonaktif`), yang berguna untuk men-_sortir_ pengumuman yang ingin ditampilkan berdasarkan status pengumuman tersebut.
|
|
|
|
|
|
#### Daftar Pengumuman
|
|
Setiap pengumuman ditampilkan dalam bentuk sebuah kotak yang memiliki warna sesuai warna dari kategori pengumuman tersebut.<br>
|
|
Posisi kotak paling kiri/awal (berbentuk +) merupakan tombol untuk menambahkan atau membuat pengumuman baru.
|
|
|
|
|
|
### Halaman Registrasi User
|
|
Halaman ini ditujukan untuk keperluan penambahan `user` baru. Pada halaman ini tersedia sebuah formulir pendaftaran. Pada formulir ini terdapat 3 `input` berupa teks (`Nama Lengkap`, `Username`, dan `Password`), diikuti di bawahnya sebuah tombol registrasi.
|
|
|
|
|
|
### Halaman Kategori
|
|
Pada halaman ini terbagi menjadi 2 sisi. Sisi sebelah kiri adalah formulir untuk menambahkan kategori baru. Sementara sisi sebelah kanan adalah daftar kategori yang telah dibuat.<br>
|
|
|
|
|
|
Pada formulir penambahan kategori baru, terdapat 1 `input` berupa teks (diisi dengan nama kategori baru), 2 `input` berupa warna (`Background`, dan `Foreground`), dan diikuti 1 tombol penambahan.<br>
|
|
|
|
|
|
Pada daftar kategori, untuk setiap kategori, terdapat nama kategori (termasuk warna `background` dan `foreground` kategori tersebut.), serta 2 tombol, yaitu tombol `Ubah` dan tombol `Hapus`. Tombol `Ubah` berfungsi untuk mengalihkan pengguna ke halaman baru (memiliki layout sama seperti halaman kategori) untuk mengubah kategori tersebut (nama, `background`, atau `foreground`). Tombol `Hapus` berfungsi untuk menonaktifkan kategori tersebut sehingga tidak dapat digunakan dalam pembuatan pengumuman baru.<br>
|
|
|