Petunjuk Penggunaan Aplikasi

Transkripsi

1 Petunjuk Penggunaan Aplikasi Berikut adalalah panduan penggunaan aplikasi Online Learning System: 1. Halaman Sign Up Halaman ini dipakai untuk melakukan proses registrasi user sebagai member dalam sistem OLS. User harus data diri yang diperlukan untuk dapat terdaftar dalam sistem ini. Gambar 1 Halaman Sign Up Setelah user berhasil melakukan proses sign up, user akan melihat tampilan pesan dari sistem bahwa user telah berhasil melakukan registrasi. User diminta untuk memeriksa kotak masuk pada yang telah terdaftar sebelumnya untuk melakukan verifikasi akunnya. 1

2 2 Gambar 2 Halaman Message Sign Up Jika user sudah membuka yang dikirimkan oleh sistem dan membuka link yang dikirimkan maka sistem akan menampilkan pesan pada halaman web yang menunjukkan bahwa user sukses melakukan verifikasi akun dan dapat sign in kedalam sistem.

3 3 Gambar Error! No text of specified style in document.3 Halaman Message Account Verification 2. Halaman Account Verification Jika user tidak mendapatkan verifikasi akun dari sistem maka user dapat mengirimkan permintaan akan tersebut kepada sistem. Halaman ini dipakai untuk meminta sistem untuk mengirim ulang verifikasi ke user. User dapat mengisi atau username yang telah terdaftar sebelumnya.

4 4 Gambar 4 Halaman Re-send Verification Sistem akan mengirimkan verifikasi ke yang telah diisi oleh user dan menampilkan halaman resend verify request. Halaman ini memberikan informasi kepada user bahwa permintaannya untuk mengirim ulang verifikasi telah berhasil dilakukan. User diminta untuk memeriksa kotak masuk di -nya.

5 Gambar 5 Halaman Re-Send Verification Message 5

6 6 3. Halaman Sign In Halaman ini dipakai oleh user yang telah melakukan aktivasi akun untuk sign in ke dalam website. User diminta untuk mengisi username atau yang telah terdaftar dan password yang benar. Gambar 6 Halaman Sign In

7 7 4. Halaman Forgot Password Halaman ini dipakai oleh user untuk mengirim permintaan pergantian password karena user lupa dengan password yang telah terdaftar di sistem. User diminta untuk mengisi atau username yang terdaftar dalam sistem untuk mengirimkan permintaan tersebut. Gambar 7 Halaman Forgot Password Jika permintaan berhasil, maka sistem akan menampilkan pesan berhasil di halaman web. Halaman ini memberikan informasi kepada user bahwa permintaannya untuk membuat password baru telah berhasil. User diminta untuk memeriksa kotak masuk pada yang diisi sebelumnya untuk melanjutkan proses pembuatan password baru.

8 8 Gambar 8 Halaman Forgot Password Message Setelah user membuka dan mengklik link yang telah dikirimkan tersebut maka sistem akan menampilkan halaman untuk ganti password

9 9 Gambar 9 Halaman Change Password (Forgot Password) Halaman ini dipakai oleh user untuk mengisi password baru serta konfirmasinya. Jika penggantian password berhasil maka sistem akan menampilkan pesan berhasil.

10 10 Gambar 10 Halaman Change Password Message

11 11 5. Halaman Home Halaman ini memberikan informasi Course terbaru dalam sistem OLS. User dapat melihat kode course, nama course beserta dengan gambarnya masing-masing. User juga dapat melihat detail dari course dengan mengklik tombol learn more. Gambar 11 Halaman Home

12 12 6. Halaman Course Catalog Halaman ini memuat semua course yang terdaftar dalam sistem. User dapat memilih dan mengklik salah satu course yang ingin dilihat perinciannya. Gambar 12 Halaman Course Catalog

13 13 7. Halaman Course Detail Halaman ini berisi informasi mengenai course yang dipilih sebelumnya. Informasi yang didapat oleh user berupa Course Group, Level, Total Topic, Software Required, Programming Language, Course Deskription, dan Learning Outcome. Gambar 13 Halaman Course Detail User juga dapat melihat daftar topic serta subtopic yang tersedia pada course tersebut dengan memilih menu topic

14 14 Gambar 14 Halaman Topic Selain itu user juga dapat melihat daftar materi pendukung yang tersedia pada course tersebut dengan memilih menu Support Material.

15 Gambar 15 Halaman Support Material 15

16 16 9. Halaman Lesson Halaman ini dipakai untuk menyampaikan materi pembelajaran kepada user. User dapat melihat materi belajar serta contoh coding beserta output-nya. Selain itu, user dapat mencatat progress pembelajarannya dengan mengklik tombol mark lesson complete. User juga dapat mengerjakan latihan untuk mengukur kemampuannya dengan mengklik tombol take quiz. Gambar 16 Halaman Lesson

17 Halaman Quiz Tampilan pertama yang user lihat saat ingin mengerjakan kuis yaitu halaman start quiz. User dapat melihat informasi mengenai kuis yang akan dikerjakan. Informasinya berupa nama kuis, tipe kuis, jumlah pertanyaan serta aturannya. Untuk memulai kuis user harus mengklik tombol start the quiz. Gambar 17 Halaman Start Quiz Setelah itu sistem akan menampilkan halaman Quiz. Halaman ini menampilkan semua pertanyaan pada kuis yang telah dipilih oleh user. Pertanyaan dikelompokkan berdasarkan subtopic yang bersangkutan. Jenis pertanyaan yang disajikan dapat berupa pilihan ganda, isian singkat atau kombinasi keduanya. Setiap pertanyaan memiliki bobot yang sama. User harus memilih atau mengisi jawaban yang dianggap benar dari semua pertanyaan yang disajikan lalu mengklik tombol submit quiz untuk mengecek hasil kuis.

18 18 Gambar 18 Halaman Take Quiz Jika jawaban kuis telah dikoreksi oleh sistem, maka hasil koreksi akan ditampilkan pada halaman quiz result. User dapat melihat total jawaban benar, total jawaban salah serta total poin yang didapat. Selain itu informasi mengenai status benar atau salah jawaban yang diisi user juga ditampilkan.

19 Gambar 18 Halaman Quiz Result 19

20 Halaman Quiz List Halaman ini memberikan informasi kepada user daftar semua kuis yang tersedia pada sistem. Kuis dikelompokkan kedalam masing-masing course yang bersangkutan. Gambar 19 Halaman Quiz List

21 Halaman Dashboard Jika user melakukan sign in sebagai admin maka sistem akan menampilkan dashboard untuk admin. Halaman ini menampilkan menu yang dapat diakses oleh Admin. User dapat melakukan pengaturan Assessment, Code, Course, Course Group, FAQ, Language, Lesson, Material Support, Subtopic, Topic, dan User. Selain itu user juga dapat merubah data akunnya dengan tombol edit profile. Gambar 20 Halaman Admin Dashboard Jika user melakukan sign in sebagai member maka sistem akan menampilkan dashboard untuk member. Halaman ini memberikan informasi mengenai progress pembelajaran serta latihan user yang direpresentasikan dalam bentuk pie chart. User dapat melihat detailnya dengan mengklik bagian dari chart tersebut. User juga dapat melihat data dirinya yang terdaftar dalam sistem serta dapat merubah data dirinya dengan mengklik tombol edit profile.

22 22 Gambar 21 Halaman Member Dashboard

23 Halaman Edit Profile Halaman ini dipakai untuk mengganti profile picture yang tersimpan dalam sistem. User dapat memilih gambar yang ingin dipakai dengan mengklik tombol browse dan mengirimkan ke server dengan mengklik tombol submit. Gambar 22 Halaman Change Profile Picture Selain itu, user juga dapat melakukan perubahan data diri yang telah terdaftar pada sistem dengan memilih menu account. Sistem akan menampilkan halaman change account. Halaman ini digunakan oleh user untuk merubah data diri yang telah terdaftar dalam database. User dapat merubah data , nama, dan tanggal lahir.

24 24 Gambar 23 Halaman Change Account User juga dapat melakukan perubahan password dengan memilih menu password. Sistem akan menampilkan halaman change password. Halaman ini digunakan oleh user untuk mengganti password yang sedang dipakai menjadi password baru. User harus mengisi password yang sedang dipakai dengan benar dan mengisi password baru serta konfirmasi password tersebut.

25 Gambar 24 Halaman Change Password 25

26 Halaman FAQ Halaman ini menampilkan informasi kepada user mengenai pertanyaan yang umum ditanyakan serta jawabannya. Gambar 25 Halaman FAQ

27 Halaman Contact Us Halaman ini menampilkan informasi mengenai lokasi administrator beserta dengan alamat yang dapat dihubungi. Gambar 26 Halaman Contact Us

28 Halaman Forum Halaman ini menampilkan informasi mengenai forum yang di posting oleh member. Gambar 27 Halaman Forum

29 29 Gambar 28 Tampilan Halaman Forum Detail User dapat membuat posting baru, dan memberikan komentar untuk setiap posting yang ada di halaman forum. User dapat menambahkan posting baru dengan mengklik icon add thread, maka sistem akan menampilkan halaman new thread.

30 30 Gambar 29 Tampilan Halaman New Thread

31 Halaman Manage Course Group Halaman ini menampilkan informasi mengenai course group yang tersimpan dalam sistem. Gambar 30 Halaman Manage Course Group User dapat menambahkan course group baru dengan mengklik icon add course group, maka sistem akan menampilkan halaman new course group. User dapat mengisi nama course group baru dan men-submit ke sistem.

32 32 Gambar 31 Halaman New Course Group User juga dapat merubah data course group dengan mengklik icon edit course group pada course group yang ingin diubah, maka sistem akan menampilkan halaman edit course group. User dapat mengganti nama course group dan men-submit ke sistem.

33 33 Gambar 32 Halaman Edit Course Group Selain itu, user juga dapat menghapus course group yang tidak terpakai lagi dengan mengklik icon delete course group pada course group yang ingin dihapus. 18. Halaman Manage Course Halaman ini menampilkan informasi mengenai course yang tersimpan dalam sistem. User juga dapat men-filter informasi berdasarkan course group.

34 34 Gambar 33 Halaman Manage Course User dapat menambahkan course baru dengan mengklik icon add course, maka sistem akan menampilkan halaman new course. User dapat mengisi course name, tag, course group, software required, level, course description, learning outcome dan course image baru lalu men-submit ke sistem.

35 35 Gambar 34 Halaman New Course User juga dapat merubah data course dengan mengklik icon edit course pada course yang ingin diubah, maka sistem akan menampilkan halaman edit course. User dapat mengganti course name, tag, course group, software required, level, course description, learning outcome dan course image lalu men-submit ke sistem.

36 36 Gambar 35 Halaman Edit Course Selain itu, user juga dapat menghapus course yang tidak terpakai lagi dengan mengklik icon delete course pada course yang ingin dihapus. 19. Halaman Manage Material Support Type Halaman ini menampilkan informasi mengenai material support type yang tersimpan dalam sistem.

37 37 Gambar 36 Halaman Manage Material Support Type User dapat menambahkan material support type baru dengan mengklik icon add material support type, maka sistem akan menampilkan halaman add material support type. User dapat mengisi nama material support type baru dan men-submit ke sistem.

38 38 Gambar 37 Halaman Add Material Support Type User juga dapat merubah data material support type dengan mengklik icon edit material support type pada material support type yang ingin diubah, maka sistem akan menampilkan halaman edit material support type. User dapat mengganti nama material support type dan men-submit ke sistem.

39 39 Gambar 38 Halaman Edit Material Support Type Selain itu, user juga dapat menghapus material support type yang tidak terpakai lagi dengan mengklik icon delete material support type pada material support type yang ingin dihapus.

40 Halaman Manage Material Support Halaman ini menampilkan informasi mengenai material support yang tersimpan dalam sistem. User dapat men-filter informasi berdasarkan material support type. Gambar 39 Halaman Manage Material Support User dapat menambahkan material support baru dengan mengklik icon add material support, maka sistem akan menampilkan halaman add material support. User dapat mengisi course, material support name, material support type, material support content dan men-submit ke sistem.

41 41 Gambar 40 Halaman Add Material Support User juga dapat merubah data material support dengan mengklik icon edit material support pada material support yang ingin diubah, maka sistem akan menampilkan halaman edit material support. User dapat mengganti course, material support type, material support name serta material support content dan men-submit ke sistem.

42 42 Gambar 41 Halaman Edit Material Support Selain itu, user juga dapat menghapus material support yang tidak terpakai lagi dengan mengklik icon delete material support pada material support yang ingin dihapus.

43 Halaman Manage Topic Halaman ini menampilkan informasi mengenai topic yang tersimpan dalam sistem. User juga dapat men-filter informasi berdasarkan course group dan course. Gambar 42 Halaman Manage Topic User dapat menambahkan topic baru dengan mengklik icon add topic, maka sistem akan menampilkan halaman new topic. User dapat mengisi course, topic title dan session no lalu men-submit ke sistem.

44 44 Gambar 43 Halaman New Topic User juga dapat merubah data topic dengan mengklik icon edit topic pada topic yang ingin diubah, maka sistem akan menampilkan halaman edit topic. User dapat mengganti isi topic title dan session no lalu men-submit ke sistem.

45 45 Gambar 44 Halaman Edit Topic Selain itu, user juga dapat menghapus topic yang tidak terpakai lagi dengan mengklik icon delete topic pada topic yang ingin dihapus.

46 Halaman Manage Subtopic Halaman ini menampilkan informasi mengenai subtopic yang tersimpan dalam sistem. User juga dapat men-filter informasi berdasarkan course dan topic. Gambar 45 Halaman Manage Subtopic User dapat menambahkan subtopic baru dengan mengklik icon add subtopic, maka sistem akan menampilkan halaman new subtopic. User dapat mengisi course, topic, title dan session no lalu men-submit ke sistem.

47 47 Gambar 46 Halaman New Subtopic User juga dapat merubah data subtopic dengan mengklik icon edit subtopic pada subtopic yang ingin diubah, maka sistem akan menampilkan halaman edit subtopic. User dapat mengganti title dan session no lalu mensubmit ke sistem.

48 48 Gambar 47 Halaman Edit Subtopic Selain itu, user juga dapat menghapus subtopic yang tidak terpakai lagi dengan mengklik icon delete subtopic pada subtopic yang ingin dihapus.

49 Halaman Manage Lesson Halaman ini akan menampilkan semua subtopic yang ada dalam sistem serta informasi mengenai jumlah lesson yang dimiliki. User dapat melihat detail lesson yang dimiliki dengan mengklik subtopic yang ingin dilihat detailnya. Sistem akan menampilkan daftar lesson yang dimiliki oleh subtopic tersebut. Gambar 48 Halaman Manage Lesson

50 50 Gambar 49 Halaman Detail Lesson User juga dapat menambahkan lesson pada subtopic yang dipilih dengan mengklik icon add lesson, maka sistem akan menampilkan halaman add lesson. User dapat mengisi lesson title, lesson no dan content.

51 51 Gambar 50 Halaman New Lesson User dapat menambahkan lesson pada subtopic yang dipilih dengan mengklik icon edit lesson, maka sistem akan menampilkan halaman edit lesson. User dapat mengubah isi lesson title, lesson no dan content.

52 52 Gambar 51 Halaman Edit Lesson Selain itu, user juga dapat menghapus lesson yang tidak terpakai lagi dengan mengklik icon delete lesson pada lesson yang ingin dihapus.

53 Halaman Manage Code Halaman ini menampilkan informasi mengenai code yang tersimpan dalam sistem. User juga dapat men-filter informasi berdasarkan course, topic, subtopic dan lesson. Gambar 52 Halaman Manage Code detail. Detail code dapat dilihat dengan mengklik link click here to see code

54 54 Gambar 53 Halaman Code Detail User dapat menambahkan code baru dengan mengklik icon add code, maka sistem akan menampilkan halaman add new code. User dapat mengisi course, topic, subtopic, lesson, code language dan code serta output lalu men-submit ke sistem.

55 55 Gambar 54 Halaman New Code User juga dapat merubah data code dengan mengklik icon edit code pada code yang ingin diubah, maka sistem akan menampilkan halaman edit code. User dapat mengganti code language, code, dan output lalu mensubmit ke sistem

56 56 Gambar 55 Halaman Edit Code Selain itu, user juga dapat menghapus code yang tidak terpakai lagi dengan mengklik icon delete code pada code yang ingin dihapus.

57 Halaman Manage Language Halaman ini menampilkan informasi mengenai language yang tersimpan dalam sistem. Gambar 56 Halaman Manage Language User dapat menambahkan language baru dengan mengklik icon add language, maka sistem akan menampilkan halaman new language. User dapat mengisi language name serta language script baru dan men-submit ke sistem.

58 58 Gambar 57 Halaman New Language User juga dapat merubah data language dengan mengklik icon edit language pada language yang ingin diubah, maka sistem akan menampilkan halaman edit language. User dapat mengganti language name serta language script dan men-submit ke sistem.

59 59 Gambar 58 Halaman Edit Language Selain itu, user juga dapat menghapus language yang tidak terpakai lagi dengan mengklik icon delete language pada language yang ingin dihapus.

60 Halaman Manage Course Language Halaman ini menampilkan informasi mengenai course language yang tersimpan dalam sistem. User dapat men-filter informasi berdasarkan course. Gambar 59 Halaman Manage Course Language User dapat menambahkan course language baru dengan mengklik icon add course language, maka sistem akan menampilkan halaman add course language. User dapat mengisi course dan language lalu men-submit ke sistem.

61 61 Gambar 60 Halaman New Course Language User juga dapat merubah data language dengan mengklik icon edit course language pada course language yang ingin diubah, maka sistem akan menampilkan halaman edit course language. User dapat mengganti course dan language men-submit ke sistem.

62 62 Gambar 61 Halaman Edit Course Language Selain itu, user juga dapat menghapus course language yang tidak terpakai lagi dengan mengklik icon delete course language pada course language yang ingin dihapus. 27. Halaman Manage Assessment Halaman ini menampilkan informasi mengenai assessment yang tersimpan dalam sistem. User juga dapat men-filter informasi berdasarkan course, topic, dan subtopic.

63 63 Gambar 62 Halaman Manage Assesment User dapat menambahkan pertanyaan dan jawaban baru dengan mengklik icon add assessment, maka sistem akan menampilkan halaman new assessment. User dapat mengisi course, topic, subtopic, question dan answer lalu men-submit ke sistem.

64 64 Gambar 63 Halaman New Assesment User juga dapat merubah data assessment dengan mengklik icon edit assessment pada assessment yang ingin diubah, maka sistem akan menampilkan halaman edit assessment. User dapat mengganti question dan answer lalu men-submit ke sistem.

65 65 Gambar 64 Halaman Edit Assesment Selain itu, user juga dapat menghapus assessment yang tidak terpakai lagi dengan mengklik icon delete assessment pada assessment yang ingin dihapus.

66 Halaman Manage User Halaman ini menampilkan informasi mengenai daftar member yang ada dalam sistem. User dapat mengubah role user lain menjadi admin atau sebaliknya dengan mengklik icon promote/demote user. User juga dapat mengubah status user lain dari active menjadi banned atau sebaliknya dengan mengklik icon banned/active user. Selain itu, user juga dapat menghapus user lain dengan mengklik icon delete user pada user yang ingin dihapus. Gambar 65 Halaman Manage User

67 Halaman Manage FAQ Halaman ini menampilkan informasi mengenai FAQ yang tersimpan dalam sistem. Gambar 66 Halaman Manage FAQ User dapat menambahkan FAQ baru dengan mengklik icon add FAQ, maka sistem akan menampilkan halaman add FAQ. User dapat mengisi nama pertanyaan dan jawaban FAQ baru dan men-submit ke sistem.

68 68 Gambar 67 Halaman Add FAQ User juga dapat merubah data FAQ dengan mengklik icon edit FAQ pada FAQ yang ingin diubah, maka sistem akan menampilkan halaman edit FAQ. User dapat mengganti pertanyaan serta jawaban FAQ dan men-submit ke sistem.

69 69 Gambar 68 Halaman Edit FAQ Selain itu, user juga dapat menghapus FAQ yang tidak terpakai lagi dengan mengklik icon delete FAQ pada FAQ yang ingin dihapus.