Uploaded by sertu.smart2

Rancangan Web pegasbelajar

advertisement
Desain Pengembangan “Pegas Belajar” berbasis Website
www.pegasbelajar.com
A. Tampilan Awal (Beranda)
Beranda
Tes
Tentang
Kontak
Login
1
Gaya belajar itu unik.
Kenali gaya belajarmu
Disini!
2
Mulai dari sini..
Siswa
Guru
3
Informasi Gaya Belajar
4
Divergen
Asimilasi
Kovergen
Akomodasi
Statistik Pengguna
Siswa
Logo
Guru
Pegas Belajar
.........................
.........................
.........................
5
Total
Kritik & Saran
.........................
.........................
........................
Kontak
..................
..................
..................
6
Gambar diatas adalah bentuk tampilan awal (beranda) pengembangan Pegas Belajar dengan
menggunakan media website. Dengan rincian penjelasan sebagai berikut:
1. Menu Bar, yang terdiri atas menu Beranda, Tes, Tentang, Kontak dan Login.
Beranda adalah bentuk tampilan awal dari website. Tes adalah menu untuk
mengetahui gaya belajar siswa tanpa perlu melakukan pendaftaran akun terlebih
dahulu. Tentang menampilkan profil pengembang serta tujuan dikembangkannya
website ini. Kontak menampilkan nomor dan alamat yang bisa dihubungi sekaitan
dengan pengembangan aplikasi. Dan menu login, untuk masuk pada akun yang
telah dibuat sebelumnya.
2. Slide Picture, yang menampilkan gambar-gambar khusus secara bergantian.
3. Form login untuk siswa dan guru. Form siswa untuk mendaftarkan akun siswa dan
form guru untuk mendaftarkan akun milik guru.
4. Informasi gaya belajar, yang terdiri atas gaya belajar divergen, asimilasi, kovergen,
dan akomodasi. Informasi gaya belajar akan menampikan deskripsi lengkap tentang
masing-masing gaya belajar, kelebihan dan kekurangan dari gaya belajar tersebut,
dan termasuk juga tips trik untuk memaksimalkan potensi diri sesuai gaya belajar
yang dimiliki.
5. Statistik pengguna, yang menampilkan jumlah pemakai aplikasi nantinya. Statistik
pengguna akan menampilkan jumlah siswa dan guru yang menggunakan website
yang telah dikembangkan.
6. Footer, yang menampilkan Kontak, Kritik dan Saran, Logo dan gambaran umum
tentang pegas belajar.
B. Tampilan Log in
Beranda
Tes
Tentang
Kontak
Login
1
Isi untuk masuk
Email/Nomor Telepon/Nama
Password
Remember me
2
LOGIN
Gambar diatas adalah bentuk tampilan masuk atau form login. Untuk masuk pada form
login terlebih dahulu pengguna harus mendaftar atau membuat akun pada form siswa dan
guru. Adapun rinciannya adalah:
1. Menu bar, yang menampilkan menu utama yang ada pada website atau pilihanpilihan khusus yang dapat digunakan oleh pengguna.
2. Tampilan login, yang dapat diisi dengan menggunakan email yang sudah
didaftarkan atau nomor telepon dan bisa juga dengan menggunakan nama pengguna
(user name) yang telah dibuat pada saat membuat atau mendaftarkan akun.
Kemudian memasukkan password dan menekan tombol login.
C. Tampilan untuk Siswa
1) Sign-up untuk siswa
Beranda
Tes
Tentang
Kontak
Login
1
2
IDENTITAS DIRI SISWA
Nama Lengkap
Nama Pengguna
Email
No. Telepon
3
Tempat, Tgl Lahir
Asal Sekolah
Nomor Induk
Kabupaten
Kode Kelas*
*Diperoleh dari guru
DAFTAR
4
Gambar diatas adalah tampilan sign up atau membuat akun pengguna siswa. Dengan
rincian tampilan sebagai berikut:
1. Menu Bar, yang menampilkan menu utama yang ada pada website atau pilihanpilihan khusus yang dapat digunakan oleh pengguna.
2. Slide picture, menampilkan gambar-gambar secara bergantian.
3. Form pengisian indentitas siswa, mulai dari nama lengkap, nama pengguna (user
name), Email, no. Telepon, tempat tanggal lahir, asal sekolah, nomor induk,
kabupaten dan kode kelas. Kode kelas digunakan untuk menghubungkan hasil tes
gaya belajar siswa kepada guru, sehingga data hasil gaya belajar dapat digunakan
oleh guru dalam membuat program layanan. Kode kelas dibuat oleh guru, kemudian
disampaikan kepada siswa untuk memasukkan kode kelas tersebut.
4. Tombol daftar, untuk mendaftarkan akun setelah terlebih dahulu mengisi data-data
yang diperlukan.
2) Kelola Siswa
Beranda
Tes
Tentang
Kontak
Nama Akun
1
2
KELOLA SISWA
Profil
Tes Potensi Gaya Belajar
Hasil Tes
3
4
Gambar diatas adalah tampilan kelola siswa, yang digunakan untuk mengelola akun
pengguna siswa, dengan rincian sebagai berikut:
1. Menu Bar, yang menampilkan menu utama yang ada pada website atau pilihanpilihan khusus yang dapat digunakan oleh pengguna.
2. Slide picture, menampilkan gambar-gambar secara bergantian.
3. Menu Profil untuk mengelola profil pemilik akun. Tes Gaya Belajar untuk
mengikuti tes gaya belajar dan Hasil Tes, untuk melihat analisis gaya belajar.
4. Menampilkan isi sesuai dengan menu atau tombol yang di tekan oleh pengguna.
Misalkan menu profil, maka pada tampilan form 4 akan memperlihatkan detail
profil dari pemilik akun yang dapat diubah.
D. Tampilan untuk Guru
1) Sign-up untuk guru
Beranda
Tes
Tentang
Kontak
Login
1
2
IDENTITAS DIRI GURU
Nama Lengkap
Nama Pengguna
Email
No. Telepon
3
Jenis Kelamin
Tempat, Tgl Lahir
Sekolah Tempat Ngajar
Kabupaten
DAFTAR
4
Gambar diatas adalah tampilan sign-up atau untuk membuat akun guru. Dengan rincian
sebagai berikut:
1. Menu Bar, yang menampilkan menu utama yang ada pada website atau pilihanpilihan khusus yang dapat digunakan oleh pengguna.
2. Slide picture, menampilkan gambar-gambar secara bergantian.
3. Form pengisian indentitas guru, mulai dari nama lengkap, nama pengguna (user
name), Email, no. Telepon, tempat tanggal lahir, asal sekolah, nomor induk, dan
kabupaten. Tombol daftar, untuk mendaftarkan akun setelah terlebih dahulu mengisi
data-data yang diperlukan.
2) Kelola Guru
Beranda
Tes
Tentang
Kontak
Nama Akun
1
2
KELOLA GURU
Profil
Kelola
Kelas
Hasil Tes
Siswa
Hasil Analisis
Kelas
3
4
Gambar diatas adalah tampilan kelola siswa, yang digunakan untuk mengelola akun
pengguna siswa, dengan rincian sebagai berikut:
1. Menu Bar, yang menampilkan menu utama yang ada pada website atau pilihanpilihan khusus yang dapat digunakan oleh pengguna.
2. Slide picture, menampilkan gambar-gambar secara bergantian.
3. Menu Profil untuk mengelola profil pemilik akun. Tes Gaya Belajar untuk
mengikuti tes gaya belajar dan Hasil Tes, untuk melihat analisis gaya belajar.
4. Menampilkan isi sesuai dengan menu atau tombol yang di tekan oleh pengguna.
Misalkan menu profil, maka pada tampilan form 4 akan memperlihatkan detail
profil dari pemilik akun yang dapat diubah.
E. Tampilan Tes Gaya Belajar Siswa
TES GAYA BELAJAR
Ilustrasi/Gambar
1
Saya lebih suka informasi disajikan dengan cara berikut:
a. model seperti diagram alir
b. poin-poin
2
c. penjelasan rinci
d. disertai dengan contoh
Selanjutnya
3
Gambar diatas adalah bentuk tampilan tes gaya belajar siswa, yang terdiri atas 3 bagian
yaitu:
1. Ilustrasi, memperlihatkan gambar sesuai kondisi pertanyaan atau pernyataan yang
muncul pada soal tes.
2. Tes gaya belajar, berisikan pernyataan atau pertanyaan tentang gaya belajar yang
sebelumnya telah dikembangkan sendiri oleh peneliti.
3. Tombol selanjutnya, untuk berpindah ke tes selanjutnya.
F. Tampilan Potensi Gaya Belajar Siswa
HASIL POTENSI GAYA BELAJAR
Ilustrasi/Gambar Gaya Belajar
Kekuatan
.............................................
.............................................
.............................................
.............................................
.............................................
.............................................
.............................................
1
Kelemahan
.............................................
.............................................
.............................................
.............................................
.............................................
.............................................
.............................................
2
Rekomendasi Cara Belajar
.................................................................................................
.................................................................................................
................................................................................................
3
Gambar diatas adalah tampilan hasil analisis dari gaya belajar, yang terdiri dari: 1) gambar
atau ilustrasi dari hasil gaya belajar, 2) memperlihatkan kekuatan dan kelemahan dari gaya
belajarnya serta 3) cara memaksimalkan belajar sesuai dengan gaya belajar yang dimiliki.
G. Informasi Gaya Belajar
Beranda
Tes
Tentang
Kontak
Nama Akun
1
2
Gaya Belajar Divergen
Deskripsi tentang gaya belajar divergen..........................................
............................................................................................................
............................................................................................................
............................................................................................................
............................................................................................................
...........................................................................................................
Karakteristik......................................................................................
............................................................................................................
............................................................................................................
............................................................................................................
............................................................................................................
...........................................................................................................
Kekuatan dan Kelemahan.................................................................
............................................................................................................
............................................................................................................
............................................................................................................
............................................................................................................
...........................................................................................................
3
Gambar diatas adalah tampilan informasi gaya belajar (yang sebelumnya ditampilkan di
beranda), yang berisikan deskripsi lengkap mengenai gaya belajar yang ada pada gaya
belajar experintial learning. Dengan rincian sebagai berikut:
1. Menu Bar, yang menampilkan menu utama yang ada pada website atau pilihanpilihan khusus yang dapat digunakan oleh pengguna.
2. Slide picture, menampilkan gambar-gambar secara bergantian.
3. Deskripsi tentang gaya belajar yang meliputi gambaran secara umum, karakteristik,
kelebihan dan kekurangan pada gaya belajar tersebut.
H. Tentang Pengembang
Beranda
Tes
Tentang
Kontak
Nama Akun
1
Tentang Pengembang
Deskripsi pengembang........................
...................................................................
...................................................................
...................................................................
...................................................................
...................................................................
Cari Tahu
Gaya Belajarmu disini!
...................................................................
Deskripsi pengembang........................
...................................................................
...................................................................
...................................................................
...................................................................
...................................................................
...................................................................
2
Gambar diatas adalah tampilan tentang pengembang, yang menampilkan profil dari peneliti
sebagai pengemban dari aplikasi tersebut. Dengan bagian-bagian sebagai berikut:
1. Menu Bar, yang menampilkan menu utama yang ada pada website atau pilihanpilihan khusus yang dapat digunakan oleh pengguna.
2. Profil Pengembang, yang menampilkan profil dari peneliti.
I. Kontak
Beranda
Tes
Kirim Pesan
2
Tentang
Kontak
Nama Akun
Kontak
Jl. Gunungsari Makassar
0852 4057 2160 (WA)
[email protected]
www.pegasbelajar.com
Nama :
Email:
Perihal:
Isi Pesan:
Kirim
Gambar diatas adalah tampilan menu kontak, yang memuat sebagai berikut:
1
3
1. Menu Bar, yang menampilkan menu utama yang ada pada website atau pilihanpilihan khusus yang dapat digunakan oleh pengguna.
2. Form Kritik dan Saran
3. Informasi Kontak yang dapat dihubungi
Download