LAMPIRAN B       SPESIFIKASI USE CASE DAN INTERFACE       Berikut ini dijelaskan secara detail tentang rancangan analisa m...
B-2B.2.1. Activity Diagram Login       Pada activity diagram proses login dapat diketahui bahwa proses tersebutmerupakan s...
B-3Gambar B.2 Activity Diagram Proses Login
B-4B.2.2. Activity Diagram Ubah Data Pribadi      Activity diagram untuk proses Ubah Data Pribadi memberikan gambaranterha...
B-5                Gambar B.4 Activity Diagram Proses Ubah mCodeB.2.4. Activity Diagram Logout       Proses logout merupak...
B-6B.2.5. Activity Diagram Daftar       Proses Daftar merupakan proses untuk membuat atau mendaftarkan akunpengguna baru. ...
B-7              Gambar B.7 Activity Diagram Proses Reset PasswordB.2.7. Activity Diagram Reset mCode      Proses ini hamp...
B-8               Gambar B.8 Activity Diagram Proses Reset mCodeB.3. Sequence Diagram      Sequence diagram menunjukkan al...
B-9 Gambar B.9 Sequence Diagram Login Normal FlowGambar B.10 Sequence Diagram Login Exception Flow
B-10            Gambar B.11 Sequence Diagram Login Exception Flow(2)B.3.2. Sequence Diagram Ubah Data Pribadi      Sequenc...
B-11 Gambar B.12 Sequence Diagram Ubah Data Pribadi Normal FlowGambar B.13 Sequence Diagram Ubah Data Pribadi Exception Flow
B-12B.3.3. Sequence Diagram Ubah mCode       Sequence diagram Ubah mCode menunjukkan urutan aksi yang dilakukanpada saat u...
B-13              Gambar B.15 Sequence Diagram Logout Normal FlowB.3.5. Sequence Diagram Daftar       Sequence diagram Daf...
B-14             Gambar B.17 Sequence Diagram Daftar Exception FlowB.3.6. Sequence Diagram Reset Password      Sequence di...
B-15 Gambar B.18 Sequence Diagram Reset Password Normal FlowGambar B.19 Sequence Diagram Reset Password Exception Flow
B-16B.3.7. Sequence Diagram Reset mCode       Sequence diagram Reset mCode menunjukkan urutan aksi yang dilakukanpada saat...
B-17B.4. Class Diagram       Class diagram modAuth secara umum dapat dilihat pada gambar B.22.Adapun rincian dari masing-m...
B-18Gambar B.23 Rincian Class Diagram modAuth
B-19Tabel B.1 Keterangan Class Diagram modAuthNo   Nama Class               Keterangan1    modAuth                  Class ...
B-20                Gambar B.24 Component Diagram modAuthB.6. Statechart Diagram      Statechart diagram untuk modAuth sec...
B-21                   Gambar B.25 Statechart Diagram modAuthB.7. Deployment Diagram         Deployment diagram menggambar...
B-22B.8. Perancangan InterfaceB.8.1. Perancangan Interface Login       Rancangan interface Login terdiri dari textbox yang...
B-23B.8.3. Perancangan Interface Login Sukses       Rancangan interface Login Sukses menunjukkan bahwa pengguna telahberha...
B-24            Gambar B.30 Rancangan Interface Ubah Data PribadiB.8.5. Perancangan Interface Ubah mCode      Rancangan in...
B-25B.8.6. Perancangan Interface Daftar       Rancangan interface Daftar menyedian form isian yang memfasilitasiuntuk pend...
B-26Gambar B.33 Rancangan Interface Kehilangan Akun
Upcoming SlideShare
Loading in …5
×

affTA10 - LampiranB

295 views
194 views

Published on

Published in: Technology, Business
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
295
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
4
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

affTA10 - LampiranB

  1. 1. LAMPIRAN B SPESIFIKASI USE CASE DAN INTERFACE Berikut ini dijelaskan secara detail tentang rancangan analisa modAuthmenggunakan UML.B.1. Use Case Diagram Use case diagram terdiri dari aktor yang merupakan pelaku pada modAuth.Aktor pada modAuth ini diberi nama Pengguna, yaitu pengguna dari modAuth.Untuk lebih jelasnya dapat dilihat pada gambar B.1. Gambar B.1 Use Case Diagram modAuthB.2. Activity Diagram Activity diagram terdapat pada setiap proses yang ada pada use casediagram. Berikut ini activity diagram yang ada pada modAuth. B-1
  2. 2. B-2B.2.1. Activity Diagram Login Pada activity diagram proses login dapat diketahui bahwa proses tersebutmerupakan satu rangkaian untuk proses otentikasi. Untuk melakukan otentikasi,pengguna harus memasukkan username dan password. Jika username dan password valid, maka akan di set Request mCode.Request mCode merupakan kode mCode yang akan diminta oleh modAuth padasaat Konfirmasi mCode. Selanjutnya pengguna akan diminta memasukkan mCode berdasarkanrequest mCode dari modAuth. Jika mCode yang dimasukkan pengguna cocokdengan mCode yang ada di database, maka login sukses, jika tidak cocok, makaakan diulang ke tahap awal (gambar B.2).
  3. 3. B-3Gambar B.2 Activity Diagram Proses Login
  4. 4. B-4B.2.2. Activity Diagram Ubah Data Pribadi Activity diagram untuk proses Ubah Data Pribadi memberikan gambaranterhadap proses pengubahan data-data pengguna. Proses tersebut dapat dilihatpada gambar B.3. Gambar B.3 Activity Diagram Proses Ubah Data PribadiB.2.3. Activity Diagram Ubah mCode Activity diagram untuk proses Ubah mCode memberikan gambaranterhadap proses pengubahan mCode. Proses ini berguna apabila mCode yangdimiliki pengguna telah diketahui oleh orang lain. Proses ini hampir serupadengan proses pengubahan password. Activity diagram Ubah mCode dapat dilihatpada gambar B.4.
  5. 5. B-5 Gambar B.4 Activity Diagram Proses Ubah mCodeB.2.4. Activity Diagram Logout Proses logout merupakan proses untuk mengakhiri sesi otentikasi. Activitydiagram logout dapat dilihat pada gambar B.5. Gambar B.5 Activity Diagram Proses Logout
  6. 6. B-6B.2.5. Activity Diagram Daftar Proses Daftar merupakan proses untuk membuat atau mendaftarkan akunpengguna baru. Activity diagram Daftar dapat dilihat pada gambar B.6. Gambar B.6 Activity Diagram Proses DaftarB.2.6. Activity Diagram Reset Password Proses Reset Password adalah proses untuk mengubah password penggunadengan password baru yang di-generate oleh server dan dikirimkan ke emailpengguna. Activity diagram Reset Password dapat dilihat pada gambar B.7.
  7. 7. B-7 Gambar B.7 Activity Diagram Proses Reset PasswordB.2.7. Activity Diagram Reset mCode Proses ini hampir sama dengan proses Reset Password. Server akanmembuat mCode baru secara acak dan dikirimkan ke email pengguna. Activitydiagram Reset mCode dapat dilihat pada gambar B.8.
  8. 8. B-8 Gambar B.8 Activity Diagram Proses Reset mCodeB.3. Sequence Diagram Sequence diagram menunjukkan alur proses berdasarkan waktu. Berikutsequence diagram pada modAuth.B.3.1. Sequence Diagram Login Sequence diagram Login menunjukkan urutan aksi yang dilakukan padasaat use case Login dilaksanakan. Sequence diagram Login terdiri dari diagramnormal flow (gambar B.9) dan exception flow (gambar B.10 dan gambar B.11).
  9. 9. B-9 Gambar B.9 Sequence Diagram Login Normal FlowGambar B.10 Sequence Diagram Login Exception Flow
  10. 10. B-10 Gambar B.11 Sequence Diagram Login Exception Flow(2)B.3.2. Sequence Diagram Ubah Data Pribadi Sequence diagram Ubah Data Pribadi menunjukkan urutan aksi yangdilakukan pada saat use case Ubah Data Pribadi dilaksanakan. Sequence diagramUbah Data Pribadi terdiri dari diagram normal flow (gambar B.12) dan exceptionflow (gambar B.13).
  11. 11. B-11 Gambar B.12 Sequence Diagram Ubah Data Pribadi Normal FlowGambar B.13 Sequence Diagram Ubah Data Pribadi Exception Flow
  12. 12. B-12B.3.3. Sequence Diagram Ubah mCode Sequence diagram Ubah mCode menunjukkan urutan aksi yang dilakukanpada saat use case Ubah mCode dilaksanakan. Sequence diagram Ubah mCodeterdiri dari diagram normal flow (gambar B.14). Gambar B.14 Sequence Diagram Ubah mCode Normal FlowB.3.4. Sequence Diagram Logout Sequence diagram Logout menunjukkan urutan aksi yang dilakukan padasaat use case Logout dilaksanakan. Sequence diagram Logout terdiri dari diagramnormal flow (gambar B.15).
  13. 13. B-13 Gambar B.15 Sequence Diagram Logout Normal FlowB.3.5. Sequence Diagram Daftar Sequence diagram Daftar menunjukkan urutan aksi yang dilakukan padasaat use case Daftar dilaksanakan. Sequence diagram Daftar terdiri dari diagramnormal flow (gambar B.16) dan exception flow (gambar B.17). Gambar B.16 Sequence Diagram Daftar Normal Flow
  14. 14. B-14 Gambar B.17 Sequence Diagram Daftar Exception FlowB.3.6. Sequence Diagram Reset Password Sequence diagram Reset Password menunjukkan urutan aksi yangdilakukan pada saat use case Reset Password dilaksanakan. Sequence diagramReset Password terdiri dari diagram normal flow (gambar B.18) dan exceptionflow (gambar B.19).
  15. 15. B-15 Gambar B.18 Sequence Diagram Reset Password Normal FlowGambar B.19 Sequence Diagram Reset Password Exception Flow
  16. 16. B-16B.3.7. Sequence Diagram Reset mCode Sequence diagram Reset mCode menunjukkan urutan aksi yang dilakukanpada saat use case Reset mCode dilaksanakan. Sequence diagram Reset mCodeterdiri dari diagram normal flow (gambar B.20) dan exception flow (gambar B.21). Gambar B.20 Sequence Diagram Reset mCode Normal Flow Gambar B.21 Sequence Diagram Reset mCode Exception Flow
  17. 17. B-17B.4. Class Diagram Class diagram modAuth secara umum dapat dilihat pada gambar B.22.Adapun rincian dari masing-masing class dapat dilihat pada gambar B.23.Penjelasan terhadap class diagram modAuth dapat dilihat pada tabel B.1. Gambar B.22 Class Diagram modAuth
  18. 18. B-18Gambar B.23 Rincian Class Diagram modAuth
  19. 19. B-19Tabel B.1 Keterangan Class Diagram modAuthNo Nama Class Keterangan1 modAuth Class utama yang merupakan class yang mengatur semua proses yang berhubungan dengan class MySQL Database2 formDaftar Form untuk menambah data pengguna baru3 formLogin Form untuk melakukan otentikasi4 formKehilanganAkun Form untuk mendapatkan kembali data pengguna yang hilang.5 formUbahmCode Form untuk membuat mCode yang baru6 formUbahData Form untuk mengubah data pengguna7 myl_user Merupakan class dari Database.8 Sistem Merupakan class yang mengatur form yang akan ditampilkanB.5. Component Diagram Berikut merupakan diagram yang menggambarkan struktur komponen darimodAuth.
  20. 20. B-20 Gambar B.24 Component Diagram modAuthB.6. Statechart Diagram Statechart diagram untuk modAuth secara umum dapat dilihat padagambar B.25.
  21. 21. B-21 Gambar B.25 Statechart Diagram modAuthB.7. Deployment Diagram Deployment diagram menggambarkan struktur package dari modAuth.Pada diagram ini dapat dilihat posisi modAuth pada sebuah situs web (gambarB.26). Gambar B.26 Deployment Diagram modAuth
  22. 22. B-22B.8. Perancangan InterfaceB.8.1. Perancangan Interface Login Rancangan interface Login terdiri dari textbox yang digunakan untukmengisi username dan password. Selain itu terdapat hyperlink untuk mengaksesform Daftar dan form Kehilangan Akun. Gambar B.27 Rancangan Interface LoginB.8.2. Perancangan Interface Konfirmasi mCode Rancangan interface Konfirmasi mCode hanya terdiri dari lima buahtextbox dan satu button untuk melakukan otentikasi terhadap mCode. Gambar B.28 Rancangan Interface Konfirmasi mCode
  23. 23. B-23B.8.3. Perancangan Interface Login Sukses Rancangan interface Login Sukses menunjukkan bahwa pengguna telahberhasil melakukan otentikasi. Pada form ini pengguna dapat mengakses formUbah Data Pribadi dan Ubah mCode. Gambar B.29 Rancangan Interface Login SuksesB.8.4. Perancangan Interface Ubah Data Pribadi Rancangan interface Ubah Data Pribadi merupakan interface yangdigunakan untuk mengubah data pribadi pengguna. Sehingga interface inimenyediakan form yang dapat memfasilitasi hal tersebut (gambar B.30).
  24. 24. B-24 Gambar B.30 Rancangan Interface Ubah Data PribadiB.8.5. Perancangan Interface Ubah mCode Rancangan interface Ubah mCode hanya terdiri dari satu button ResetmCode yang digunakan untuk men-generate mCode baru. Gambar B.31 Rancangan Interface Ubah mCode
  25. 25. B-25B.8.6. Perancangan Interface Daftar Rancangan interface Daftar menyedian form isian yang memfasilitasiuntuk pendaftaran akun baru. Gambar B.32 Rancangan Interface DaftarB.8.7. Perancangan Interface Kehilangan Akun Rancangan interface Kehilangan Akun merupakan interface yangmenangani proses Reset Password dan Reset mCode.
  26. 26. B-26Gambar B.33 Rancangan Interface Kehilangan Akun

×