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