P. 1
BAB 3 E-Learning (Irwan)

BAB 3 E-Learning (Irwan)

|Views: 435|Likes:
Dipublikasikan oleh Irwan Saputra

More info:

Published by: Irwan Saputra on Jul 01, 2011
Hak Cipta:Attribution Non-commercial

Availability:

Read on Scribd mobile: iPhone, iPad and Android.
download as PDF, TXT or read online from Scribd
See more
See less

11/14/2013

pdf

text

original

BAB 3 ANALIS DAN PERANCANGAN SISTEM

3.1

Analisis Sistem Analisis sistem yang sedang berjalan merupakan penguraian dari suatu

informasi yang utuh ke dalam bagian-bagian komponennya yang dimaksudkan untuk mengidentifikasi dan mengevaluasi permasalahan-permasalahan, hambatanhambatan yang terjadi dan kebutuhan-kebutuhan yang diharapkan sehingga dapat diusulkan perbaikannya. Untuk memahami alur dari informasi dalam sistem, diperlukan pendokumentasian dalam merancang suatu mulimedia pembelajaran bahasa Inggris menggunakan konsep jejaring sosial sehingga akan mempermudah tahap pengembangan sistem. Sistem yang dibangun dalam aplikasi ini adalah sebuah sistem pembelajaran yang dapat berkolaborasi, berkomunikasi dan belajar tentang bahasa Inggris. Sistem tersebut menggunakan metode collaborative learning dan multimedia sebagai bahan ajarnnya dan jejaring sosial sebagai sarana berkomunikasi dan bersosialisasi. Gambaran umum dari sistem yang akan dibangun adalah sebagai berikut : 1. Aplikasi ini berbentuk social web menggunakan bahasa server scripting PHP 2. Untuk memudahkan pengerjaan dan perawatan maka apikasi ini dibagun menggunakan framework Codeigniter dengan metode MVC.

3. Dalam aplikasi ini pengguna pertama-tama harus mendaftar sebagai anggota dari website ini. Setelah itu pengguna dapat langsung mengakses materi baik tulisan ataupun multimedia, pengguna dapat mencoba latihanlatihan yang telah diberikan, setiap latihan yang diselesaikan pengguna mendapat score. Pengguna dapat berinteraksi dengan pengguna lainnya memberi komentar, menyumbangkan tulisan, mengikuti forum dan chat room. 4. Penggunaan multimedia sebagai bahan ajar yang dapat membantu peroses pemahaman materi. 5. Pengguna dalam aplikasi ini dibagi menjadi tiga yaitu Student, Administratoristrator, dan Moderator. Student adalah pengguna biasa yang memanfaat website tersebut sebagai sarana pembelajaran bahasa Inggris. Aministrator adalah seseorang yang bertugas mengatur website dan mempunyai hak penuh pada website. Sedangkan Moderator bertanggung jawab memberikan dan mengatur materi serta melakukasn pengawasan bahasa yang dipakai pada user. 6. Konten dalam aplikasi ini adalah comment writing practice,

Administratoristrator access controls, moderator access conrols, user profiles, forum, collaborative community blogs, create 'friends', seccoring, multimedia, and chat. 3.1.1 Analisis Masalah Beberapa analisis yang dilakukan ditempat penelitian dapat dirumuskan beberapa permasalahan yaitu :

1. Bagaimana menangani adanya keterbatasan ruang, jarak, dan waktu karena pembelajaran hanya terpaku dalam kegiatan belajar mengajar disekolah atau ditempat les yang memerlukan biaya yang biasanya relatif mahal. 2. Bagaimana membuat suatu sistem pembelajaran bahasa Inggris sebagai sarana belajar, berkomunikasi, dan berbagi pengetahuan sehingga tercipta peroses belajar mengajar yang menyenangkan. 3. Bagaimana meningkatkan kemampuan belajar bahasa Inggris baik secara akademik maupun diluar akademik. 3.1.2 Analisis perbandingan sebuah website Analisis ini bertujuan untuk membandingan website yang serupa dengan website yang akan dibuat dilakukan berdasarkan lima komponen usability yang dikemukakan oleh Jacob Neilsen, tujuh belas prinsip user interface yang dikemukakan oleh Deborah J.Mayhew dalam General Principle of UI Design. Dalam analisis perbandingan ini website yang diambil untuk dianalisis adalah livemocha. Dengan adanya analisis perbandingan ini diharapkan akan menghasilkan suatu konsep yang lebih baik. 3.1.2.1 Analisis website serupa (www.livemocha.com) Livemocha adalah salah satu situs pembelajaran bahasa online gratis dan terbesar di seluruh dunia. Livemocha memiliki lebih dari Sembilan juta pengguna dari 195 negara dan menawarkan kursus bahasa dasar gratis dalam 38 bahasa dan program. Livemocha menawarkan berbagai penjelasan tata bahasa, latihan

1 Halaman Utama Livemocha Beberapa hal yang akan dibahas berkitan dengan analisis desain pada website livemocha. yaitu : a.reading comprehension. . interactive role playing. b. Desain halaman yang konsisten dengan tema mocha diambil dari varietas kopi di yaman memberberi kesan bahwa website tersebut didesain untuk kalangan remaja keatas. Brikut ini adalah gambaran dari analisis website tersebut : 1. Pada saat website di akses livemocha sudah mencerminkan sebuah website komunitas jejaring social dengan selogan welcome to the world’s largest language learning community ditambah dengan banner beberapa wajah orang yang saling berhubungan. interaksi live dan asynchronous dengan penutur asli lainya dalam komunitas livemocha. Analisis desain Gambar 3.

Gambar 3. Desain teknologi website livemocha sudah memenuhi syarat dalam hal invisible technology misalnya pada saat scoring. Form pendaftaran yang disajikan pada saat website pertamakali diakses. Desain pada halaman user sesuai dengan product compatibility. System juga handal dalam mengkordinir kesalahan misalnya pada saat pendaftaran atau transaksi pada halaman store.2 Halaman Pengguna Livemocha f. . user tidak perlu tahu detail bagaimana sistem melakukan proses perhitungan penilaian. menampilkan score hingga menyimpanya data score pada basis data user. dibuat seminimal mungkin agar pengunjung tertarik untuk mendaftar d.c. Menu-menu yang digunakan juga konsisten dengan fungsionalistas yang berjalan ditambah icon yang familiar memudahkan user untuk berinteraksi terhadap sistem website tersebut. dimana terlihat jelas fungsionalitas penggabungan e-learning dan social networking.

Dynamic lesson content : rencana pembelajaran yang mencakup lebih dari 160 jam untuk pemula dan konten pembelajaran bahasa percakapan sehari-hari lengkap dengan peraktik membaca. Analisis sistem pembelajaran a.3 Halaman Pembelajaran Livemocha c. interaksi live dan asynchronous dengan penutur asli lainya. Livemocha menawarkan berbagai penjelasan tata bahasa. menulis. mendengar. Untuk basic Engish livemocha menyajikan pembelajaran secara interaktif yang disajikan dengan cara drag and drop. interactive role playing. Gambar 3. b. latihan reading comprehension. dan latihan berbicara dengan tingkat menengah . menulis pesan singakat yang akan di koreksi para native speakers.2. dan perekam suara dalam bahasa Inggris yang nanti akan diberikan umpan balik dalam komunitas.

Untuk itu website ini menyediakan alat-alat untuk menjaga pelajar berkomunikasi saling memberikan dorongan semangat untuk membuat kemajuan yang baik . Global community : Anggota-anggota Livemoca diseluruh dunia dapat memanfaatkan kemahiran bahasa asli mereka untuk mengajar dan belajar dari anggota-anggota lain dari komunitas tersebut. Motivational System : Livemocha menyadari bahwa belajar bahasa bagi kebanyakan orang yang mempunyai sediki waktu luang mungkin akan mengganggu kehidupan mereka yang sibuk. Gambar 3. Para pengguna memiliki pilihan unuk berlatih percakapan tersetruktur dengan para penutur asli atau menyampaikan tulisan atau audio pada penutur asli untuk kemudian diperiksa atau diedit.4 Halaman Interaksi Livemocha e.d.

c. atau memberikan sebuah hadiah virtual. Untuk berkomunikasi secara langsng Livemocha menawarkan sebuah fasilitas chat.5 Halaman Pertemanan Livemocha b. Livemocha juga menawarkan fasilias berbagi budaya. pegguna juga dapat berkomentar mengenai gambar-gambar tersebut. Gambar 3. Mereka dapat mengundah sebuah foto mengenai alam atau budaya mereka sebagai ajang berbagi pengetahuan kepada pengguna lainya. Fasilitas ini dapat membantu pengguna melatih kecakapan komunikasi yang dimilikinya . Seperti website-wibsite jejaring social lainya pertemanan berupakan hal yang harus terjadi sebagai syarat terjadinya jejaring social.3. Pengguna dapat mengirim pesan kepada pengguna lainya melalui sebuah fasilitas kirim pesan. Analisis sistem jejaring social a.

Tabel 3.Gambar 3.1 Lima Komponen Usability Nama komponen Hal yang dinilai Laernabilty untuk website ini mudah button dan link sudah pada fungsinya. Tabel lima komponen usability Berikut adalah hasil penilaian terhadap website livemocha berdasarkan lima komponen usability yang dikemukakan oleh Jakob Nelsen. pengguna tidak menemukan kesulitan apabila melakukan kesalahan. apalagi didukung dengan icon yang sesuai pada content didalamnya sehingga penggunjung dapat mengerti tanpa diajarkan terlebihbahulu Pengguna dapat menyelesaikan tugas-tugas dengan baik setelah mereka mempelajari hasil rancanganya Memorability dalam website ini bagus namun masih butuh perbaikan karena banyaknya tugas dan fungsi yang ada sehingga pengguna harus mengingat kembali kegunaan tugas dan fungsi website ini apa bila lama tidak digunakan Penangannan kesalahan pada website ini baik sekali. Misalnya pada pembelian token. Dengan mengambil dari penilaian-penilaian sebelumnya kepuasan dalam rancangan website sudah cukup bagus.6 Halaman komunikasi Chat Livemocha 4. Penilaian Learnability Eficciency Memorability Error Statisfaction Keterangan nilai : Bagus sesuai : Bagus butuh perbaikan : Buruk .

Tabel tujuh belas komponen user interface Berikut adalah hasil penilaian terhadap website livemocha berdasarkan lima komponen yang usability yang dikemukakan oleh Deborah J. .5.Mayhew.

sistem yang mudah digunakan untuk expert user. Seperti menampilkan Progress Bar.Tabel 3. Seperti memberikan komentar pada saat user melakukan kesalahan dengan bahasa yang tidak membuat user merasa dikontrol oleh sistem tersebut. artinya adanya korespondensi satu ke satu antara informasi di layar dengan informasi di printed-output atau file. maka dari itu gunakan system default pada aplikasi yang dirancang. misalkan mampu mengorbankan user interface yang memungkinkan sistem lebih kompatibilitas Rancanglah interface sistem sesuai dengan tugas dari user. maka Office akan secara otomatis memberikan konfirmasi untuk menyimpannya atau tidak. Hal ini akan memberikan motivasi kepada user tersebut untuk menggunakannya. jangan samapi user kesulitan untuk menggunakannya. sistem yang mudah dipelajari bagi user novice (awam). Penilaian User Compatibility Product Compatibility Task Compatibility Work Flow Compatibility Consistency Familiarity Simplicity Direct Manipulation Control WYSIWYG Flexibility Responsiveness Invisible Technology Robustness Protection Ease of Learning Ease of Use Keterangan nilai : Bagus sesuai : Bagus butuh perbaikan : Buruk . Seperti ikon atau gambar “review” pada fungsi latihan. Sistem harus mampu mentolerir kesalahan manusia baik disengaja maupun tidak disengaja dan yang umunya tidak dapat dihindari. Seperti pada saat kita menutup lembar kerja Microsoft Office yang belum kita simpan sebelumnya. Sistem harus selalu merespon dengan cepat apa yang di inputkan oleh user. ini membuktikan bahwa fokus user terhadap gambar tersebut sebagai latihan setelah memahami teori Kompleksitas suatu aplikasi akan menimbulkan frustasi pada user itu sendiri. pada saat kita menekan mengetikkan huruf “A” maka di layar akan langsung muncul huruf “A”.2 Tujuh belas Komponen Usability Nama komponen Hal yang dinilai Sistem harus paham benar tentang pengetahuan. Sistem yang digunakan oleh user jangan sampai membuat user merasa frustasi dan dikontrol oleh user. mengijinkan banyak kontrol dari user yang mendukung untuk menggunakan aplikasi yang kita rancang dan mampu mengakomodir kemampuan user yang lain. Menyembunyikan detail teknis dari suatu sitem merupakan hal yang sangat direkomendasikan dalam membuat User Interface. cara berfikir dan cara menerima informasi dari user sehingga sistem yang nantinya digunakan oleh user dapat membuat user lebih produktif Penilaian ini memperhatikan dan mempertahankan kompatibilitas antar produk. karena pada prinsip ini sistem seharusnya memproteksi kesalahan-kesalahan umum manusia. karena hal ini dapat menyebabkan aplikasi yang kita buat tidak akan terpakai dan akhirnya tidak dapat membantu pekerjaan / tugas user. WYSIWYG (What You See Is What You Get). Selalu mengorganisasikan setiap fungsinya sesuai dengan kategori fungsinya sehingga dapat memfasilitasi segala perubahan tugas user. Maksudnya adalah sediakan dan utamakanlah fungsi – fungsi yang benarbenar sesuai dengan tugas dari user. penggunaan konsep. Sehingga sistem yang kita bangun tidak hanya dipakai untuk novice user tetapi bisa juga dipakai untuk user yang sudah ahli (berpengalaman). user dapat langsung menyaksikan aksi sistem pada suatu objek. Contoh sederhananya adalah ketika user menekan tombol “save” maka proses yang terjadi adalah penyimpanan bukan hapus data. Contoh sederhana. Prinsip ini berbeda dengan prinsip Robustness. terminologi dan pengaturannya yang mudah dipahami oleh user. sistem harus konsisten terhadap fungsionalitas / kegunaan dari sistem tersebut.

live interaction. writing practice 3. Aspek bisnis Menyediakan versi gratis dan berbayar Seluruh pembelajaran bebas biaya. review. video learning.1. Video. live chat. Karakteristik dari Student yang ada . Berikut ini adalah tabel kesimpulan bahan yang diambil dari hasil analisis.1 Analisis Pengguna (user) Pengguna dalam website ini dibagi menjadi tiga yang peratama adalah pengguna umum atau bisa disebut Student.1. audio Media komunikasi Pertemanan.3 kesimpulan analisis website Livemocha Media pembelajaran reading comprehension.3. blog. form diskusi Hasil perbandingan Text material. review. analisis perangkat keras.2 Kesimpulan analisis website Dari hasil paparan analisis diatas maka dapat diambil beberapa kesimpulan mengenai hal apa saja yang dapat diambil dan dijadikan sebagai bahan acuan terbentuknya suatu multimedia pemembelajaran bahasa Inggris menggunakan konsep jejaring social berbasis web. Spesifikasi kebutuhan melibatkan analisis user. dan analisis perangkat lunak. writing practice. Pertemanan.3. Live chat. interactive role playing.1. Tabel 3. audio lerning.2. sharing culture.3 Analisis Kebutuhan Sistem Non Fungsional Analisis kebutuhan dilakukan untuk mengetahui spesifikasi kebutuhan untuk sistem. 3.

dan mengamankan website.saat ini tidak ditentukan karena dalam proses pembelajaran kolaboratif setiap orang bisa belajar dan mengajar tetapi dalam target Student yang dipilih adalah pelajar para siswa atau mahasiswa dengan umur diatas 15 tahun. Administratoristrator memiliki jenjang pendidikan sarjana ilmu komputer. Pengguna kedua adalah Administratoristrator yang mengatur system dalam website ini. Pengguna yang ketiga adalah Moderator seorang sarjana sastra Inggris yang bertugas memberikan materi dalam website tersebut dan memberikan mengawasi penggunaan bahasa pada student. Untuk melihat lebih jelas tentang karak teristik pengguna dapat dilihat pada tabel dibawah ini : . Administratoristrator bertugas mengatur. Pengalaman student berbeda-beda sesuai dengan bidang pendidikan yang ingin diikuti di situs ini tetapi secara umum student bisa menggunakan komputer dan menjalankan internet dengan baik.

S1 Min. SD Moderator 1. . 1. berpartisipasi dalam blog 3. mengolah blog 4.4 Karakterisik Pengguna Pengguna Student Tanggung Jawab 1. Bisa mengikuti petunjuk yang ada pada sistem 2. Aktif menguasai bahasa Inggris 1. Min. Pernah membuat tulisan bahasa Inggris dalam Blog Administrator Mengecek kevalidan 1. mnegedit materi. mengolaj pembelajaran 3. berpartisipasi dalam blog 3. Membantu temannya dalam penguasaan materi yang diberikan Hak Akses 1. 2. sarjana Informatika atau manajemen Informatika mempunyai portpolio dibidang web Dari penjelasan diatas. mampu mengoprasikan komputer dan menggunakan internet 2. Mengikuti latihan yang telah diberikan 3. S1 Sastra Inggris 1. Aktif dan terlibat dalam kegiatan belaja. mampu mengoprasikan komputer dan menggunakan internet Min. membuat kategori. Menguasai materi menghapus materi yang ada dalam system 2. Melakukan kegiatan Pembelajaran 2. berdiskusi dalam forum Tingkat Pendidikan Tingkat Keterampilan Bisa mengikuti petunjuk yang ada pada sistem Pengalaman Min.berkomunikasi dalam jejaring sosial 4. dan topik diskusi Min. mengolah forum 5. mengolah user data dan sistem 2. dapat diambil kesimpulan bahwa karakteristik user yang telah ada saat ini sudah memenuhi kriteria untuk dapat menggunakan program aplikasi yang akan dibangun karena sebagian besar user sudah dapat menggunakan internet dengan baik.Tabel 3. Min. Aktif dan terlibat dalam kegiatan belajar 2. Mengawasi penggunaan bahasa 3. mengolah data statistik Min. S1 Bisa menguasai bahasa pemrograman web dan menguasai tentang internet. mengolah pembelajaran menambah.

3.2 Fakta Pengguna Komputer Dan Internet Dari hasil data penelitian yang dilaksanakan pada tahun 2007 dengan metode survey yang dikemukakan oleh Hanif Hoesin dan Baso Saleh dalam jurnalnya Penggunaan Komputer dan Internet di Indonesia.6% 6.1 tingkat pengguna Internet Pengalaman menggunakan internet Kurang dari 6 bulan Antara 6-12 bulan Antara 1-3 tahun 4-6 tahun Lebih dari 6 tahun 6.5% .2% 20. Tabel 3.3% penggunaan internet (682 orang) dalam enam bulan terakhir.1.1% 9.500 orang) yang terdistribusu secara purposive random sampling di 16 kota di Indonesia hanya 1168 orang atau 46. Berikut adalah tabel presentase tingkat pengguna komputer dan tinggkat pengguna internet.3.5% 4% 2.5%s Tabel 3.1 Tingkat pengguna komputer Pertanyaan Jawaban responden Seberapa penting 15 komputer penting Lebih dari 90% responden menyatakan bagi kehidupan penting Pemanfaatan computer bagi kehidupan Penggunakan untuk menggetik Mengolah data Sarana multimedia Mendengarkan musik 91.70% yang sempat menggunakan computer dan 27. Dari total responden (2.2% 5.5% 49.

Sistem oprasi : Windows XP SP2. 2. Google Chrome. XAMPP sebagai web server. .0. PHP sebagai bahasa pemerograman yang digunakan.8% 4. 4. Savari versi 4. Adapun minimum spesifikasi kebutuhan perangkat lunak dari client untuk menjalankan aplikasi ini adalah sebagai berikut : 1. Windows vista.6% Kurang dari 2% Dari hasil survei tabel diatas dapat diambil kesimpulan bahwa pada tahun 2007 penggunaan fasiltas komputer dan internet pada masyarakat masih rendah hal ini bisa karena akses terhadap sarana tidak terjangkau . Berikut ini adalah spesifikasinya : 1. 3. Windows 7. Browser : Mozilla Firefox versi 3.1.3 Kebutuhan Perangkat Lunak Analisis perangkat keras dimaksudkan untuk mengetahui minimum spesifikasi perangkat keras yang digunakan untuk mengakses website pembelajaran bahasa Inggris ini.1 keatas. ketersediaan sarana TIK (Teknologi Informasi dan Komunikasi) yang belum merata diseluruh wilayah penelitian. dan daya beli masyarakat relative lebih rendah berbanding mahalnya akses terhadap sarana TIK. Sistem oprasi Windows 7 Untimate. 3. 2.3.Intensitas responden dalam menggunakan internet dalam seminggu 1-5 jam 6-10 jam Lebih dari 5 jam 12. MySQL sebagai media penyimpanan basis data .

Processor Hard disk RAM VGA Card Monitor Keyboard Mouse Client 1 GHz 80 GHz 512 Mb 128 Mb 1024x768 Terpasang Terpasang Server 2. MySql databases Versi 5. 4. PHP Versi 5.4 Analisis Perangkat Keras Analisis perangkat keras dimaksudkan untuk mengetahui spesifikasi perangkat keras yang digunakan pada website Englishku. 3. 6.3.0 Keatas 3.14 2. Framework Codeigniter versi 2. 7.2 Minimal Spesifikasi perangkat keras Client dan Server No 1.1.com dan perangkat keras client serta server yang mampu menjalankan aplikasi elearning yang sedang dibangun. Berkut adalah minimal spesifikasi Perangkat keras client.0 3.2.com : Tabel 3. 2.7 GHz 120 GB 512 Mb 512 Mb 1024x768 Terpasang Terpasang .Minimum spesifikasi kebutuhan perangkat lunak pada server adalah sebagai berikut: 1. 5. server dan website Englishku.

4. digunakan alat bantu yaitu diagram E-R. Analisis Basis Data Untuk menggambarkan data dan menggambarkan hubungan antara data yang ada. Usulan untuk perancangan diagram E-R yaitu dapat dibedakan dengan atribut lainnya sehingga table tersebut dapat dijadikan referensi table lain. Adapun diagram E-R tentang proses akses informasi ini ditujukan pada gambar dibawah ini: .

7 ERD (Entity Relation Diagram) .id_akun_login id_shootbox id_level_pengguna 1 1 N blog N terdapat blog_komentar N id_blog shootbox N id_blog id_blog_komentar memiliki id_level_pengguna memiliki membuat N memberikan id_forum_komentar N shootbox_ komentar level_pengguna 1 N mengomentari forum_komentar N id_forum_topik id_akun_login id_akun_login id_shootbox_komentar 1 1 1 1 1 N mempunyai 1 id_forum_topik id_forum_ketegori id_akun_login memiliki 1 1 1 akun_login 1 1 membuat forum_topik N id_profile_pengguna 1 id_level_pengguna memiliki 1 profile_pengguna 1 memiliki Id_akun_login id_kategori melakukan N N forum_kategory Id_chat id_latihan_soal Id_materi id_pilihan_ganda id_hasil review id_hasil_latihan N memiliki Id_negara N mengirim chat 1 id_detail_hasil_latihan mengerjakan N latihan_soal 1 1 menampilkan N abjad_pilihan_ ganda negara pesan id_hasil_latihan id_pesan id_akun_login id_soal_pilihan detail_Hasil_ latihan 1 1 menghasilkan memiliki 1 menghasilkan id_latihan_soal id_materi id_bab_pelajaran materi N terdapat pada id_pelajaran id_bab_pelajaran id_pelajaran 1 N 1 bab_pelajaran mengacu pelajaran Gambar 3.

judul_bab} {id_materi. nama_depan. sandi_pengguna. id_bab_pelajaran. telepon. jenis_kelamin. tgl_lahir. id_akun_pengguna. nama_melajaran} {id_bab_pelajaran. kode_pos. id_shootbox. tgl_pesan} shootbox {id_shootbox. akun_pengguna. tentang saya} akun_login {id_akun_login. isi_pesan. id_pelajaran. id_negara. tgl_shootbox} shootbox_komentar {id_shootbox_komentar. namalevel} {id_negara. email. tempat_lahir. tgl_shootbox_komentar} pelajaran bab_pelajaran materi {id_pelajaran. isi_komentar. id_akun_login. namadile_foto. id_level_pengguna. isi_shootbox.4 Entitas dan Atribut Entitas profile_pengguna Atribut {id_profile_pengguna. nama_kota. . judul_materi. alamat. id_akun_pengguna. login_terakhir.Entitas dan Atribut : Tabel 3. nama_belakang. nama Negara} {id_pesan. aktif} level_pengguna negara pesan {id_level_pengguna.

id_akun_pengguna.text_materi. tgl_posting. id_soal_pilihan_ganda. namafile_materi_audio. nilai_persoal} hasil_review {id_hasil_review. tgl_posting. id_akun_login. artikel_blog. tgl_latihan. id_akun_login. tgl_komentar} forum_kategori forum_topik {id_forum_kategori. id_akun_login. banyak_dilihat} blog_komentar {id_blog_komentar. id_akun_login. id_forum_topik. total_nilai} blog {id_blog. judul_blog. komentar. pesan_forum} forum_komentar {id_forum_komentar. nilai_review} hasil_latihan {id_hasil_latihan. id_blog. aktif} abjad_pilihan_ganda detail_hasil_latihan {id_abjad_pilihan_ganda. id_hasil_latihan. topik_forum. id_materi. id_latihan_soal. komentar_forum} . id_latihan_soal. id_login_akun. soal. abjad} {id_detail_hasil_latihan. tipe_soal. namafile_materi_video} latihan_soal {id_latihan_soal. kategori_forum} {id_forum_topik. jawaban. tgl_komentar. id_forum_kategori.

Diagram konteks dalam wesite pembelajaran ini dapat dilihat pada gambar dibawah ini : Webmail Data email dan kode aktifasi Info data email dan kode aktifasi Info user Info course Info blog Info forum User Data user Data course Data blog Data forum Multimedia pembelajaran bahasa Inggris Info moderator Info course Info blog Info forum Moderator Data moderator Data course Data blog Data forum Data admin Data course Data blog Data forum Info admin Info course Info blog Info forum Administrator Gambar 3. Pendekatan struktur ini untuk menggambaarkan system secara gatis besar atau secara keseluruhan.1 Analisis Kebutuhan Fungsional Perancangan Diagram Konteks Diagram konteks merupakan alat untuk struktur analisis. Pada diagram konteks ini system informasi yang dibuat akan menghasilkan sumber informasi yang dibutuhkan dan tujuan yang ingin dihasilkan.1.3.4 3.8 Diagram Konteks .1.

3.1. berikut data flow diagram selengkapnya : .2 Data Flow Diagram (DFD) Data Flow Diagram (DFD) merupakan suatu media yang digunakan untuk menggambarkan aliran data yang mengalir pada suatu system informasi. DFD sistem pembelajaran bahasa Inggris yang di usulkan ini terdiri dari beberapa bagian.

9 DFD Level 1 Multimedia Pembelajaran Bahasa Inggris Menggunakan Konsep Jejaring Sosial Data forum komentar Data forum kategori Info forum Data pesan blog Data forum Info forum Info statistik 9.0 Forum Data forum komentar Data forum kategori Forum_kategori Data forum topik Forum_topik Data forum topik Forum_komentar Gambar 3.0 Jejaring sosial Info jejaring sosial Data pesan pertemanan Data pertemanan Pesan Data pesan Data blog Data blog Info blog Data blog komentar Info blog 7.0 Pengaturan akun Info akun Info akun Data akun Data akun Moderator info kusus Data pelajaran Data pelajaran pelajaran Data bab pelajaran bab_pelajaran Data bab pelajaran Data materi materi 5.0 Kursus Data kursus Data abjad pilihan ganda Data abjad pilihan ganda Info jajaring sosial abjad_pilihan_ganda Data hasil review Data hasil review hasil_review Data hasil latihan hasil_latihan Data hasil latihan Data chat chat Data chat Data jejaring sosial Data materi Data jejaring sosial Info jejaring sosial Data pertemanan 6.0 Blog Data blog Data pesan Info blog Data forum Data jejaring sosial blog_komentar Data blog komentar Data forum Info forum 8.0 Lupa password Data lupa password Info lupa password data lupa password Info lupa password Admin 4.0 Olah pengguna Data statistik Data pengguna .0 Sign up Data pengguna Negara 10.Data negara Data sign up Info sing up Data akun Data akun Data negara 1.0 Sign in Data lupa password Data sign in Info sign in Info lupa password Data lupa password Data akun Info akun Data hasil latihan detail hasil latihan Data hasil latihan Info kursus Data kurus 3.0 Info statistik Data statistik Pelajar Data sign in Info sign in Data sign in Data pengguna Profile_pengguna Data pengguna Data pengguna data_statistik Data statistik Info pengguna Data lupa password Akun_login Data sign in Data lupa password 2.

3.4 DFD Level 2 Proses Sign In Proses Sign in adalah pintu masuk untuk halaman-halaman berikutnya. Proses sign in ini memastikan bahwa pengguna sudah menjadi member pada website tersebut.10 DFD Level 2 Proses 1 Sign up 3.2 Aktifasi akun Gambar 3.1 Daftar member Pelajar akun_login profile pengguna Data aktivasi Info aktivasi 1.1.10 Data pendaftaran Info pendaftaran 1.1. proses tersebut dapat terlihat pada gambar 3. .3 DFD Level 2 Proses Sign Up Proses sign up adalah proses pendaftaran untuk pengguna yang belum menjadi anggota pada sistem pembelajaran website ini.

2 Kirim password Web mail Data email Gambar 3.1 verifikasi email Data email Data email Data email Info email invalid Data email valid Moderator Pelajar akun_login Email valid Admin Data password Data password 3.Data sign in pelajar Info sign in pelajar valid info sign in moderator valid Data sign in 2. Proses tersebut dapat erlihat pada gambar 3.2 Verifikasi data sign in Data sign in vaid info sign in moderator invalid Gambar 3.11 DFD level 2 Proses 3 Lupa password .11 Info email invalid Data email Info email invalid 3.1.1 Input data sign in Data sign in valid Moderator Data sign in moderator Data sign in Data sign in administrator Pelajar akun_login Administrator info sign in administrator valid info sign in administrator invalid Info sign in pelajar invalid 2.10 DFD Level 2 Proses 2 Sign up 3.5 DFD Level 2 Proses Lupa Password Proses lupa password bertujuan untuk mengirim password yang terlupa pada email pengguna.

Proses tersebut dapat dilihat pada gambar 3.2 Ganti password Gambar 3.7 DFD Level 2 Proses Kursus Pada proses kursus ini menunjukan dimana pengguna dapat melakukan proses apa saja yang dapat dilakukan pada sistem pembelajaran elearning bahasa inggris ini. Proses tersebut dapat dilihat pada gambar 3.6 DFD Level 2 Proses Pengaturan Akun Pada proses pengaturan akun ini pengguna dapat mengatur profile pengguna atau mengganti password lama pengguna dengan password baru pengguana.1.3.12 n Sig in lid va Data Edit profile Info edit profile Data profile pengguna Data edit profile 4.13 .1.1 Edit profile Data edit profile Info edit profile info edit profile Pelajar Data profile pengguna profil pengguna Moderator n Sig in lid va Admin Data ganti password admin Info password admin Data ganti password Info ganti password akun_login Data ganti password Data ganti password Data ganti password Info ganti password 4.12 DFD Level 2 Proses 4 pengaturan 3.

Info review Info pelajaran data latihan menulis Pelajaran n Sig in lid va Data materi Info score 5.1. Proses tersebut dapat dilihat pada gambar 3.5 score abjad_pilihan_ganda .2 Pelajari materi Data soal pilihan ganda 5.3 Ikut latihan latihan_soal Data abjad pilihan ganda Data materi pelajaran Data materi Data abjad pilihan ganda Data soal pilihan ganda Sig n in Data abjad pilihan ganda Data abjad pilihan ganda Data latihan soal Data olah pelajaran Data olah pelajaran bab_pelajaran Data bab pelajaran Data bab pelajaran Soal_pilihan_ganda materi Data soal pilihan ganda Data soal pilihan ganda Data materi 5.7 Olah Pelajaran Data materi Sig n in Sig n in Data olah pelajaran val id val id 5.4 Laihan menulis tbox Data hasil latihan n Sig in lid va n Sig in lid va hasil_review 5.8 DFD Level 2 Proses jejaring sosial Proses jejaring social ini adalah proses yang digunakan pengguna untuk besosialisasi sesama pengguna lainya dalam website pembelajaran bahasa inggris ini.13 DFD Level 2 Proses 5 kursus 3.14 Data latihan soal Data latihan soal Data latihan soal val id 5.1 Lihat pelajaran Data pelajaran Data pelajaran n Sig in lid va n Sig in lid va hasil_latihan Data latihan soal Data latihan soal Data bab pelajaran Data bab pelajaran 5.8 Olah review Sig n in val id Data olah review 5.9 Olah write Info olah review Info olah write Moderaor Data olah write Info olah pelajaran Admin Olah pelajaran Data olah pelajaran Gambar 3.6 Review activity Data hasil latihan Data hasil review Data hasil review Data score Data hasil latihan Data latihan sh o o 5.

5 6.2 pessan pessan 6.4 pertema pertema nan nan Data pertemana 6.2 6. Proses tersebut dapat dilihat pada gambit 3.4 6.5 Chat Chat n Sig Info chat an Ja w ab Data massage Data pertemana Data massage 3.3 pemberit pemberit ahuan ahuan Data notification Data notification Data shootbox Data chat 6.14 DFD Level 2 Proses 6 Jearing Sosial .Info shootbox Data shootbox Info chat Data chat Data notification Info notification Pelajar Pelajar Data shootbox Info shootbox Data massege Info massege Data notification Info notification Moderator Moderator Data friends Info friends Info friends Info massage Data review Data massage 6.9 berbagi pengetahuan berupa artikel yang dapat dililhat pengunajung lainya.1 Shootbox Shootbox Data shootbox Data chat w rit e Data chat 6.1.3 6.1 6.15 n Sig in id va komentar komentar DFD Level 2 Proses blog Proses blog adalah proses yang digunakan student dan moderator untuk n Sig in id va n Sig in id va in lid va n Sig in id va chat chat pesan pesan pertemaan pertemaan notification notification Gambar 3. sedangkan Administratoristrator bertugas mengatur jalanya proses tersebut.

15 DFD Level 2 Proses 7 blog .4 Delete blog Comment blog 3.2 Create blog 7.1.3 Edit blog n Sig in Blog_komentar lid va n Sig Edit data blog Edit data blog Delete Data blog Delete Data blog Delete data blog Delete data blog n Sig in lid va in lid va View data blog Info view blog Administrator Gambar 3. Proses forum tersebut dapat dilihat pada gambar 3.16 n Sig in lid va View data blog DFD Level 2 Proses Forum Proses forum adalah menggambarkan proses apa saja yang dapat n Sig View data blog Blog in lid va 7.Data view blog Info view blog Info comment blog Data comment blog Data edit blog Info edit blog Pelajar Data edit blog Info edit blog Moderator Data comment blog Data view blog Data create blog Info view blog Info create blog Info delete blog Info create blog Data delete blog Data create blog 7.5 7.1 View blog Data comment blog 7.10 dilakuakan dalam kegiatan forum pada sistem pembelajaran bahasa Inggris ini.

2 Edit kategori 8.16 DFD Level 2 Proses 8 forum 3. Peroses tersebut dapat dilihat pada gambar 3.5 Edit Topik Sig n Data edit topik in va lid n Sig in lid va .11 DFD Level 2 Proses Olah Pengguna Proses olah pengguna adalah proses yang memungkinkan Administratoristrator menggelolah pengguna.7 Hapus topik in va lid Data hapus topik Info hapus topik Administrator Info hapus topik Gambar 3.3 Cari topik Data cari forum Data cari forum Data hapus kategori Data hapus kategori forum_ topik 8.17 Sig ni nv ali d Sig n Data hapus topik Data edit blog Sig ni nv ali d 8.8 komentar Topik Info komentar Data edit topik Info edit topik Info edit topik Info edit blog Data edit blog Data edit kategori Data buat topik Data buat topik Data buat kategori Data edit kategori forum_ kategori Sig ni nv ali d 8.4 Buat topik Data edit blog 8.info komentar Data komentar Forum_komentar Data komentar Data buat kategori Info buat kategori Info edit topik data edit topik Data cari topik Info cari topik Pelajar Data cari topik Info cari topik Moderator Data komentar 8.1.6 hapus Kategori Info cari forum Data cari forum 8.1 buat kategori Sig ni nv ali d 8.

1 Lihat Pengguna n Sig in Info hapus pengguna Info hapus penggguna Data Luhat pengguna Data lihat pengguna Data hapus pengguna Data hapus pengguna Data hapus pengguna profile pengguna Data blokir pengguna akun_login Data atur sebagai moderator Gambar 3.12 DFD Level 2 Proses statistik Proses statistik adalah proses yang memebrerikan informasi kepada Administratoristrator mengenai statistik isi dalam sistem pembelajaran.Info lihat pengguna Data lihat pengguna Data set sebagai moderator Administrator Info atur data sebagai moderator Data blokir pengguna Info blokir pengguna 9.4 Atur sebagai moderator 9.2 Blokir pengguna Data atur sebagai moderator n Sig in lid va .1. Peroses tersebut dapat dilihat pada gambar 3.18 Data blokir pengguna n Sig in lid va lid va n Sig in lid va 9.3 Hapus pengguna Data hapus pengguna 9.17 DFD Level 2 Proses 9 Olah Pengguna 3.

19 . Proses tersebut dapat dilihat pada gambar 3.1.4 Statistik forum va lid Data statistik Data statistik Data statistik Data statistik Data statistik Data statistik 10.13 DFD Level 3 Proses Olah pelajaran Proses olah pelajaran adalah proses yang menunjukan hal apa saja yang bisa dilakukan moderator dan Administratoristrator mengenai pengolahan pembelajaran.3 Statistik Blog Data statistik Data statistik Data_statisltik Gambar 3.1 Statistik pengguna Sig n in va lid Sig n in 10.18 DFD Level 2 Proses 10 statistik 3.Info data tratistik pengguna Info statistik forum Sig n Administrator in Data statistik kursus Info statistik kursus va lid Data statistik pengguna Data statistik forum Data statistik blog Info statistik blog Sig n in va lid 10.2 Statistik kursus 10.

7.7.2 Hapus Kursus Administrator Data hapus pelajaran Moderator Data hapus pelajaran Info hapus pelajaran 5.19 DFD Level 3 Proses 5.7.7.7 Olah Pembelajaran .7.4 Tambah pelajaran Data tambah pelajaran Data tambah pelajaran Sig n in Data edit pelajaran va lid Data tambah kursus Data tambah kursus 5.7.9 Hapus materi Data hapus materi Data hapus materi Gambar 3.7.7.5 Edit pelajaran bab_pelajaran Data edit pelajaran Sig n in Data hapus kursus va lid Sig n in va lid Data hapus kursus pelajaran 5.7.3 Edit Kursus Data edit kursus Info edit kursus Data tambah materi info tambah materi Data edit kursus 5.1 Tambah kursus Data tambah kursus Data edit pelajaran Info tambah kursus Info edit pelajaran 5.7 Tambah Materi Data tambah materi Data tambah materi Sig n in va lid Data edit materi Data edit materi Info edit materi 5.6 Hapus pelajaran Data hapus pelajaran Data hapus pelajaran Sig n Info hapus kursus in va lid Info hapus pelajaran Sig n in va lid Data edit kursus 6.8 Edit materi Materi Data edit materi Sig n in va lid Data hapus materi Info hapus materi 5.Sig n in va lid Data tambah pelajaran Info data tambah pelajaran in va lid Sig n 5.

8 Review .1 Buat soal Sign Data edit soal in va Soal_pilihan_ganda lid Data edit soal Data info soal 5.14 DFD Level 3 Proses Review Review adalah sebuah proses mengenali latihan pembelajaran.20 Data buat latihan soal in va lid Sig n Data buat latihan soal Data buat soal Data buat soal Data edit soal Data edit soal Data buat soal Data info soal 5.8. Proses tersebut dapat dilihat pada gambar 3.1.8.8.8.8.3 Hapus soal Hapus soal Moderator Data hapus soal dan pilihan ganda Sign in va lid Info hapus pilihan ganda Data hapus pilihan ganda 5.3.8.19 DFD Level 3 Proses 5.5 Buat pilihan ganda Data buat pilihan ganda Data buat pilihan ganda Info kunci jawaban Data kunci jawaban 5.6 Kunci jawaban dan solusi Data kunci jawaban dan solusi Data kunci jawaban dan solusi Gambar 3.2 Edit soal Data edit soal latihan_soal Sign in va Data hapus soal Info hapus soal lid Hapus soal 5.4 Hapus pilihan ganda Data hapus pilihan ganda Data hapus pilihan ganda abjad_pilihan_ganda Sign in va lid Info buat pilihan ganda Data buat pilihan ganda Sign in va lid 5.

9.2 Edit pertanyaan Write latihan_soal Si Data edit write gn in Data edit pertanyaan va lid Data hapus write Info hapus write 5.20 Sig n in va lid Data tambah write 5.3 hapus pertanyaan Write Data hapus pertanyaan Data hapus pertannyaan Gambar 3.1 Buat pertanyaan write Data buat pertanyaan Info tambah write Data pertanyaan Info data write Data edit perannyaan Sig n in va lid Moderator 5.1.9 write 3.15 DFD Level 3 Proses Write Review adalah sebuah proses mengenali latihan yang berupa tulisan.19 DFD Level 3 Proses 5. Speifikasi proses dari gambaran DFD diatas akan dijelaskan pada table dibawah ini.9.3. .9.5 Spesifikasi Proses Spesifikasi proses digunakan untuk menggambar proses model aliran yang terdapat pada DFD (Data Flow Diagram).1. Proses tersebut dapat dilihat pada gambar 3.

Tabel 3.1 Input data sign in Pengguna (pelajar. moderator. Proses Nama Proses Source Input Output Destination 1 Logika 1.5 Spesifikasi Proses NO Proses No. No.1 Daftar member pengunjung Data pendaftaran Info pendaftaran Pengunjung Pengunjung memilih menu sign up Sistem menampilkan form pendaftaran Pengunjung mengisi data pendaftaran Sistem melakukan validasi data pendaftaran yang telah diisi oleh pengunjung Jika data pendaftaran valid maka sistem akan menyimpan data pendaftaran dan mengirim link aktifasi ke email pengunjung untuk melakukan aktifasi No. Proses Nama Proses Source Input Output 2 Destination Logika 1.2 Aktifasi akun Pengunjung Data link aktifasi Info link aktifasi valid Pengunjung Pengunjung membuka email yang didaftarkan pengunjung melakukan klik link aktivasi yang disediakan Sistem meng-update status pendaftaran member menjadi aktif. Administratoristrator) Keterangan . Proses 3 Nama Proses Source 2.

moderator. moderator.1 Verifikasi email pelajar. Proses Nama Proses Source Input Output 4 Destination Logika 2. moderator. Administratoristrator) Input email dan password Apa bila format email salah maka akan menampilkan pesan kesalahan No. Administratoristrator Data email Email valid pelajar. Administratoristrator Data email. Administratoristrator Sistem akan memeriksa email dalam database table akun pengguna Jika data ditemukan maka sistem akan melanjutkan ke proses kirim password Jika data email yang dimasukan tidak ditemukan dalam database maka akan menampilkan pesan email invalid 6 No.Input Output Destination Logika data sign in Info sign in Pengguna (pelajar.2 Verifikasi data sign in pelajar. Administratoristrator Sistem memeriksa data kedalam table akun pengguna Jika sistem menemukan kesesuaian data maka sistem akan membawa kehalaman pengguna Jika data tidak ditemukan dalam database table akun pengguna maka akan menamapilkan pesan kesalahan No. Proses Nama Proses Source Input Output 5 Destination Logika 3. moderator. password Info pesan kesalahan pelajar. Proses 3. moderator.2 .

moderator. Proses Nama Proses Source Input Output Destination 7 Logika Kirim password pelajar.Nama Proses Source Input Output Destination Logika No. maka sistem akan menampilkan pesan kesalahan No. moderator. Administratoristrator Sistem mengirim data password kepada email pengguna 4.1 Lihat pelajaran Pelajar Data pelajaran yang dipilih Info pelajaran yang dipilih pelajar Pelajar memilih kategori kursus Sistem menampilkan pelajaran yang ada pada kategori tersebut Pelajar memilih pelajaran Sistem menampilkan judul materi-materi yang ada pada . Administratoristrator) Data edit profile Info edit prodile Pengguna (pelajar. Proses Nama Proses Source Input Output 8 Destination Logika 5. Administratoristrator) Pelajar memilih menu edit profile Sistem menampilkan form edit profile Pengguna merubah profile yang sebelumnya Jika data yang dirubah benar maka sistem akan mengupdate data pengguna Jika data yang dirubah salah. moderator. moderator. Administratoristrator Data email valid Kirim password ke email pengguna pelajar.1 Edit profile Pengguna (pelajar.

Proses Nama Proses 11 Source Input Output Destination 5.3 Ikut latihan Pelajar Data latihan Info latihan Pelajar Pelajar memlilih menu review Sistem menampilkan soal dan pilihan ganda Pelajar menjawab pertanyaan dengan memilih pilihn ganda Sistem memeriksa jawaban dan memberikan kunci jawaban pada setiap pertanyaan yang dijawab pelajar.5 No.2 Pelajari materi Pelajar Data materi yang dipilih Info materi yang dipilih Pelajar Pelajar memilih materi yang akan dipelajarinnya Sistem menampilkan materi teks. dan materi video sesuai dengan judul materi yang dipilihnya No. Jika pertanyaan sudah habis diberikan maka sistem akan melanjutkan ke proses 5. materi audio .4 Laihan menulis pelajar Data latihan menulis Info latihan menulis pelajar . Proses Nama Proses Source Input 9 Output Destination Logika 5. Proses Nama Proses Source Input Output Destination 10 Logika 5.pelajarang tersebut No.

1 No. Proses Nama Proses Source Input 13 Output Destination Logika 5.6 No.Logika Pelajar memilih menu write Sistem menampilkan pertanyaan latihan menulis sesuai dengan materi sebelumnya Pelajar menjawab pertanyaan Sistem melanjutkan ke proses 6. Proses 14 Nama Proses Source Input 5.5 score Pelajar Data score Info score Pelajar pelajar mengklik finish setelah selesai menjawab semua soal yang diberikan sistem sistem memeriksa jawaban dari setiap soal yang diberikan setelah mendapat hasilnya sistem melanjutkan ke proses 5.6 Review activity Pelajar Data review Info review Pelajar Pelajar memasukan data review ke sistem Sistem memeroses dan menampilkan kembali kapada pelajar No.7 Olah pelajaran Pengguna (moderator. Proses Nama Proses Source Input Output 12 Destination Logika 5. Administratoristrator) Data olah pembelajaran .

9 Olah write Moderator Data write Info data write Moderator Moderator memilih menu olah write Sistem menampilkan beberapa menu yang dapat digunakan untuk mengelolah write No. Proses Nama Proses Source Input 16 Output Destination Logika 5.1 shootbox pelajar Data shootbox Info shootbox pelajar Pelajar member komentar pada menu shootbox .Output Destination Logika Info data olah pelajaran Pengguna (moderator. Administratoristrator) Pengguna memilih menu olah pelajara Sistem menampilkan peruses apa saja yang bisa dilakukan sesuai level pengguna No.8 Olah review Moderator Data olah review Info olah review Moderator Moderator memilih menu olah review Sistem menampilkan beberapa menu yang dapat digunakan untuk mengelolah review No. Proses Nama Proses Source 17 Input Output Destination Logika 6. Proses Nama Proses Source Input 15 Output Destination Logika 5.

Sistem menampilkan komentar pada shootbox Pelajar menghapus komentarnya Sistem menghapus komentar dari shootbox No. moderator) Data pesan Info data pesan Pengguna (pelajar.2 Pesan Pengguna (Pelajar.4 Pertemanan Pengguna (pelajar. Proses Nama Proses Source Input 18 Output Destination Logika 6.3 Pemberitahuan Pengguna (pelajar moderator) Data pemberitahuan Info pemberitahuan Pengguna (pelajar. Proses Nama Proses Source 20 Input Output Destination Logika 6. moderator) Data pertemanan Info pertemanan Pengguna (pelajar. moderator) Pengguna memilih teman yang akan menjadi temannya . moderator) Pengguna menglihat pemberitahuan Sistem menampilkan pemberitahuan Pengguna mengklik salah satu link pemberitahuan Sistem menampilkan halaman yang diklik No. moderator) Pengguna mengirim pesan Sistem mengirim pesan pada alamat yang dituju Pengguna megnhapus pesan Sistem menghapus pesan dalam database table pesan No. Proses Nama Proses Source Input 19 Output Destination Logika 6.

Moderator Pengguna mengklik pengguna lainya untuk mengajak berbincang Pengguna lainnya menyetujui permintaan temanya Sistem menampilkan pasilitas chat No. moderator) Data artikel blog Info artikel blog Pengguna (pelajar. Proses Nama Proses Source 23 Input Output Destination Logika 7.1 View blog Pengguna(Pelajar. Proses Nama Proses Source 22 Input Output Destination Logika 7. moderator) Pengguna mengklik create blog Sistem menampilkan form untuk membuat blog . Modorator Data chat Info chat Pelajar.Sistem menyampaikan data pertemanan ke pengguna lain Pengguna menyetujui pertemanan Sistem menampilkan info data pertemanan No. Proses Nama Proses Source Input 21 Output Destination Logika 6.5 Chat Pelajar. Modorator) pengguna memilih blog mana yang ingin dilihatnya sistem menampilkan blog yang dipilih pengguna No. Modorator) Data view blog Info view blog Pengguna (Pelajar.2 Create blog Pengguna (pelajar.

Proses Nama Proses Source Input 26 Output Destination Logika 7.No. moderator) Data komentar blog Info komentar blog Pengguna (pelajar. Administratoristrator) .3 Edit blog Pengguna (pelajar. Proses Nama Proses Source Input 25 Output Destination Logika 7. moderator) Pengguna menulis komentar pada salah satu artikel blog Sistem menampilkan komentar pada artikel blog tersebut No. No. moderator) Data edit blog Info edit blog Pengguna (pelajar.5 comment blog Pengguna (pelajar. moderator) Data delete blog Info delete blog Pengguna (pelajar. Proses Nama Proses Source 24 Input Output Destination Logika 7. moderator) Pengguna memlilih blog mana yang mau dihapus Sistem menghapus data blog dalam database table blog Sistem menampilkan info database telah terhapus.4 Delete blog Pengguna (pelajar. moderator) Pengguna memilih blog mana yang mau diedit Sistem menampilkan form untuk mengedit blog No. Proses 27 Nama Proses Source 8.1 Buat kategori Pengguna (moderator.

3 Cari topic Pengguna (pelajar. moderator) Data cari topik Topic yang dicari Pengguna (pelajar .2 Edit kategori Pengguna (moderator.Input Output Destination Logika Data buat kategori Info buat kategori Pengguna (moderator.4 Buat topik Pengguna (pelajar. moderator) Pengguna memilih menu buat topic . Administratoristrator) Data edit kategori Info edit Pengguna (moderator. moderator) Pengguna mamasukan kunci yang dicari Sistem menmpilkan data sesual kata kunci No. Administratoristrator) Penguna melilih menu edit kategori Sistem menampilkan kategori yang akan diedit No. Proses Nama Proses Source 29 Input Output Destination Logika 8. Proses Nama Proses Source 28 Input Output Destination Logika 8. Proses Nama Proses Source 30 Input Output Destination Logika 8. Administratoristrator) Pengguna memilih buat kategori Sistem menampilkan form buat kategori Pengguna mengisi data form Sistem menampilkan data form yang telah dibuat No. moderator) Data topik Info data topik Pengguna (pelajar.

No.6 Hapus ketegori Administratoristrator Data hapus kategori Info dat hapus kategori Administratoristrator Administratoristrator memilih untuk menghapus kategori Sistem member peringatan untuk memastikan apakah kategori yakin dihapus Administratoristator menjawab ya Sistem menghapus kategori beserta topik-topik yang ada didalamnya. Proses Nama Proses Source Input Output Destination 32 Logika 8.Sistem menampilkan form untuk buat topik No. Proses Nama Proses 33 Source Input Output 8. moderator) Penggguna memilih mengu edit topic Sistem menampilkan form edit topic Pengguna meng-update forum topic Sistem menyimpan perubahan dn menampilkanya dalam forum No.5 Edit topik Pengguna (pelajar. moderator) Data edit topic Info edit topic Pengguna (pelajar. pelajar) Data hapus topik Info hapus topik . Proses Nama Proses Source Input Output 31 Destination Logika 8.7 Hapus Topik Pengguna (moderator.

Proses Nama Proses Source 36 Input Output Destination Logika 9.1 Lihat pengguna Administratoristrator Data olah pengguna Info olah pengguna Administratoristrator Administratoristrator melihat user yang akan ditampilkan Sistem menampilkan profile user No.2 Blokir pengguna Administratoristrator Data blokir pengguna Info blokir pengguna Administratoristrator Administratoristrator memilih pengguna mana yang ingin diblokirnya Sistem menonaktifkan user yang dipilih Administratoristrator untuk dibelokir No. Proses Nama Proses Source Input 35 Output Destination Logika 9.Destination Logika Pengguna (moderator.3 Hapus Pengguna Administratoristrator Data hapus pengguna Info hapus pengguna Administratoristrator Moderator memilih data pengguna yang ingin dihapusnya . pelajar) Pengguna memilih untuk menghapus sebuah topic Sistem menghapus sebuah topik No. Proses Nama Proses Source Input 34 Output Destination Logika 9.

Sistem menghapus akun pengguna sesuai dengan data yang dihapusnya.2 Statistik kursus Administratoristrator data statistic kursus Info data statistik kursus Administratoristrator Administrator memilih data statistik kursus Sistem menghitung data statistic kursus dan menampilkannya pada halaman statistik 40 No.3 . No. Proses Nama Proses Source Input 38 Output Destination Logika 10. Proses 10.4 Atur sebagai moderator Administratoristrator Data atur sebagai moderator Info atur sebagai moderator Administratoristarot Administrator meilih pengguna mana yang ingin dijadikan moderator Sistem merubah hakakses pengguna menjadi moderator No. Proses Nama Proses Source Input 37 Output Destination Logika 9.1 Statistik pengguna Administratoristrator Data statistik pengguna Info statistik pengguna Administratoristrator Administrator memilih statistic pengguna Sistem menghitung data statistik pengguna dan menampilkannya pada halaman statistik No. Proses Nama Proses Source Input 39 Output Destination Logika 10.

7.1 Tambah kursus Administratoristrator Data tambah kursus Info data tambah kursus Administratoristrator Administratoristrator memilih menu tambah kursus Sistem menampilkan form tambah kursus Administratoristrator mengisi data form yang telah disediakan Sistem menyimpan data kursus yang baru dibuat. Proses Nama Proses Source Input Output 42 Destination Logika 5.Nama Proses Source Input Output Destination Logika Statistik blog Administratoristrator Data statistik blog Info data statistic blog Administratoristrator Administrator memilih data statistik blog Sistem menghitung data statistic blog dan menampilkannya pada halaman statistik No. . Proses Nama Proses Source Input 41 Output Destination Logika 10.4 Data statistik forum Administratoristrator Data statistik forum Info data statistik forum Administratoristrator Administrator memilih data statistik forum Sistem menghitung data statistik forum dan menampilkannya pada halaman statistik No.

Proses Nama Proses Source Input 43 Output Destination Logika 5.7. Proses Nama Proses Source 45 Input Output Destination 5.No.7.7.4 Tambah pelajaran Moderator Data tambah pelajaran Info tambah pelajaran Moderator .2 Data hapus kursus Administratoristrator Data hapus Administratoristrator Info Administratoristarot Administratoristrator Administrator memlih data kursus mana yang ingin dihapusnya Sistem menghapus semua data yang berhubungan dengan data hapus kursus No.3 Edit kursus Administratoristrator Data edit kursus Info edit kursus Administratoristrator Administratoristrator memilih data kursus mana yang mau di edit Sistem menampilkan form data edit kursus Administratoristrator memperbaharui data kursus Sistem menyimpan perubahan pada data kursus No. Proses Nama Proses Source Input Output 44 Destination Logika 5.

5 Edit pelajaran Moderator Data edit pelajaran Info data edit pelajaran moderator Moderator memilih data edit pelajaran Sistem menampilkan form data edit pelajaran yang dipilih Moderator mengubah data pembelajaran Sistem menyimpan perubahan yang dilakukan moderator terhadap data pembelajaran No.Logika Moderator memilih menu tambah pelajaran Sistem menampilkan form tambah data pelajaran Moderator mengisi data tambah pelajaran Sistem menyimpan data tambah pelajaran No.7.6 Hapus pembelajaran Administratoristratr dan Moderator Data hapus pembelajaran Info hapus pembelajaran Administratoristrator dan Moderator Administrator atau moderator memilih data pelajaran yang ingin dihapus Sistem merespon dengan menghapus data pelajaran yang dipilih pengguna No.7 Tambah materi .7.7. Proses 48 Nama Proses 5. Proses Nama Proses Source Input 47 Output Destination Logika 5. Proses Nama Proses Source Input Output 46 Destination Logika 5.

Proses Nama Proses Source Input Output 49 Destination Logika 5.Source Input Output Destination Logika Moderator Data tambah materi Info tambah materi Moderator Moderator ingin menambah materi sesuai dengan tema pembelajaran sebelumnya Sistem menyimpan penambahan materi baru sesuai dengan id pembelajaranya. 51 No.1 .8. Proses Nama Proses Source 50 Input Output Destination Logika 5. Proses 5. No.9 Hapus materi moderator Data hapus materi moderator Info hapus materi moderator moderator Moderator memilih data materi Sistem merespon dengan menghapus data materi.7.8 Edit materi Moderator Data edit maeri Info edit materi Moderator Moderator memilih data edit materi Sistem menampilkan form data edit materi yang dipilih Moderator mengubah data materi Sistem menyimpan perubahan yang dilakukan moderator terhadap data pembelajaran No.7.

2 Edit soal Moderator Data edit soal Info edit soal Moderator Moderator memilih menu edit soal Sistem menampil form edit soal yang dipilihnya Moderator merubah soal Sistem menyimpan perubahan dan menampilkan pada halaman olah pelajaran No. Proses Nama Proses Source 53 Input Output Destination 5.8.8. Proses Nama Proses Source Input Output 52 Destination Logika 5.Nama Proses Source Input Output Destination Logika Buat soal Moderator Data buat soal Info boat soal Moderator Moderator memilih menu untuk membuat soal Sistem menampilkan form membuat soal Moderator mengisi data buat soal Sistem menyimpan data soal yang telah dibuat dan menampilkannya pada halaman olah pelajaran No.3 Hapus soal Moderator Data hapus soal Info hapus soal Moderator .

Proses Nama Proses Source Input 54 Output Destination Logika 5.6 Kunci jawaban dan solusi Moderator Data kunci jawaban dan solusi Info kunci jawaban dan solusi .5 Buat pilihan ganda Moderator Data pilihan ganda Info pilihan ganda Moderator Moderator memilih menu untuk membuat pilihn ganda Sistem menampilkan form untuk membuat pilhan ganda Moderator mengisi form yang telah disediakan untuk membuat pilihan ganda Sistem menyimpan data pilihan ganda yang baru dibuat No. Proses Nama Proses 56 Source Input Output 5.8.8. Proses Nama Proses Source Input Output 55 Destination Logika 5.8.Logika Moderator memilih soal yang dihapus Sistem merespon dengan menghapus soal yang ada dalam tabel soal No.4 Hapus pilihan ganda Moderator Data hapus pilihan ganda Info hapus pilihan ganda Moderator Moderator menilih pilihan ganda yang ingin dihapus Sistem merespon dengan menghapus pilihan ganda pada database tabel abjad pilihan ganda No.

9.9.Destination Logika Moderator Moderator memilih menu untuk membuat kunci jawaban dan solusinya Sistem menampilkan form untuk membuat jawaban dan solusi jawaban Moderator mengisi form yang telah disediakan Sistem menyimpan jawaban dan solusi soal tersebut No. Proses Nama Proses Source 58 Input Output Destination Logika 5.1 Buat pertanyaan write Moderator Data pertanyaan write Info pertanyaan write Moderator Moderator memilih menu untuk membuat pertanyaan write Sistem menampilkan data untuk membuat pertanyaan write Moderator mengisi data untuk membuat pertanyaan write Sistem menyimpan pertanyaan yang telah dibuat No.2 Edit pertannyaan write Moderator Data edit pertannyaan write Info edit pertannyaan write Moderator Moderator memilih menu edit pertanyaan write Sistem merespon dengan menampilkan form edit . Proses Nama Proses Source Input Output Destination 57 Logika 5.

pertannyaan write Moderator mengisi filed form untuk membua pertannyaan Sistem menyimpan data pertanyaan write yang dibuat No. 3. Proses Nama Proses Source Input Output Destination Logika 5.1. Kamus data diagram untuk diagram alir data pada aplikasi e-learning ini akan dijelaskan sebagai tabel 3.9.6 Kamus Data Nama Aliran data Digunakan pada Deskripsi Strukur data Data Sign up Pelajar proses 1.3 Hapus pertanyaan write Moderator Data hapus pertanyaan write Info hapus data pertannyan write Moderator Moderator memilih data pertanyaan write yang ingin dihapus Sistem merespon dengan menghapus pertannyaan write.6 Kamus Data Kamus data merupakan definisi formal mengenai selurus element yang tercakup dalam DFD.0 Berisikan data profile pengguna id_akun_login + nama_depan + nama_belakang + namafile_foto + jenis_kelamin + tempat_lahir + tgl_lahir + id_negara + nama_kota + email + telepon+ alamat + kode_pos + tentang_saya + online + aktif id_akun_login [0-9] .6 berikut : Tabel 3.

Moderator.nama_depan nama_belakang namafile_foto jenis_kelamin tempat_lahir tgl_lahir id_negara nama_kota email telepon alamat kode_pos tentang saya online aktif Nama Aliran data Digunakan pada Deskripsi Strukur data [A-Z|a-z] [A-Z|a-z] [A-Z|a-z|0-9] [A-Z|a-z] [A-Z|a-z] [0-9] [0-9] [A-Z|a-z] [A-Z|a-z|0-9] [0-9] [A-Z|a-z|0-9] [0-9] [A-Z|a-z|0-9] [0-9] [0-9] Data Sign In Pelajar.0 Berisikan data emal untuk mengirimkan password id_level_pengguna + akun_pengguna + sandi_pengguna + aktif email [A-Z|a-z|0-9] .0 Berisikan data informasi Sign in id_level_pengguna + akun_pengguna + sandi_pengguna + aktif id_level_pengguna akun_pengguna sandi_pengguna aktif Nama Aliran data Digunakan pada Deskripsi Strukur data [0-9] [A-Z|a-z|0-9] [A-Z|a-z|0-9] [0-9] Data Lupa Password Pelajar. Administratoristrator – Proses 2. Moderator. Administratoristrator – Proses 3.

7 . Administratoristrator – Proses 4. Administratoristrator – Proses 3. Moderator.3 Moderator proses 5.2 Berisikan data password baru untuk menggantikan password yang lama Strukur data Sandi_pengguna Nama Aliran data Digunakan pada Sandi_pengguna [A-Z|a-z|0-9] Data Materi Pelajar proses 5.Nama Aliran data Digunakan pada Deskripsi Strukur data Data Edit Profile Pelajar. Moderator.7 Administrator proses 5.1 Berisikan data untuk mengubah isi profile nama_depan + nama_belakang + namafile_foto + jenis_kelamin + tempat_lahir + tgl_lahir + id_negara + nama_kota + email + telepon+ alamat + kode_pos + tentang_saya nama_depan nama_belakang namafile_foto jenis_kelamin tempat_lahir tgl_lahir id_negara nama_kota email telepon alamat kode_pos tentang saya Nama Aliran data Digunakan pada Deskripsi [A-Z|a-z] [A-Z|a-z] [A-Z|a-z|0-9] [A-Z|a-z] [A-Z|a-z] [0-9] [0-9] [A-Z|a-z] [A-Z|a-z|0-9] [0-9] [A-Z|a-z|0-9] [0-9] [A-Z|a-z|0-9] Data Ganti Password Pelajar.

8 Deskripsi Berisi data mengenai tampilan dan pengolahan pilihan ganda Strukur data id_laihan_soal + id_abjad_pilihan_ganda + desc_pilihan_ganda + set_kunci_jawaban id_laihan_soal [0-9] id_abjad_pilihan_ganda [0-9] desc_pilihan_ganda set_kunci_jawaban [A-Z|a-z] [A-Z|a-z] .Deskripsi Berisikan data pengolahan materi.7 Deskripsi Strukur data id_bab_pelajaran id_pelajaran judul_bab Nama Aliran data Digunakan pada Berisi data mengenai bab pelajaran id_bab_pelajaran + id_pelajaran + judul_bab [0-9] [0-9] [A-Z|a-z] Data Soal Pilihan Ganda Pelajar proses 5.3 Moderator proses 5.1 Administrator. dan bahan belajar untuk pelajar Strukur data id_materi + id_bab_pelajaran + judul_materi + teks_materi + namafile_materi_audio+ namafile_materi_video id_materi id_bab_pelajaran judul_materi teks_materi namafile_materi_audio namafile_materi_video Nama Aliran data Digunakan pada [0-9] [0-9] [A-Z|a-z|0-9] [A-Z|a-z|0-9] [A-Z|a-z|0-9] [A-Z|a-z|0-9] Data Bab Pelajaran Pelajar proses 5. Moderator proses 5.

6 Berisi data hasil latihan id_hasil_latihan + id_akun_login + tgl_latihan + total_nilai id_hasil_latihan id_akun_login tgl_latihan total_nilai Nama Aliran data Digunakan pada Deskripsi Strukur data [0-9] [0-9] date [0-9] Data Hasil Review Pelajar proses 5.Nama Aliran data Digunakan pada Data Abjad Pilihan Ganda Pelajar proses 5.3 Moderator proses 5.6 Berisi data hasil review id_hasil_review + id_hasil_latihan_soal + id_akun_login + jawaban + nilai_review .4 Moderator proses 5.8 Deskripsi Strukur data abjad Nama Aliran data Digunakan pada Berisi data mengenai abjad pilihan ganda abjad [A-Z|a-z] Data Latihan soal Pelajar proses 5.9 Deskripsi Strukur data id_latihan_soal id_materi soal tipe_soal aktif Nama Aliran data Digunakan pada Deskripsi Strukur data Berisi data latihan soal id_latihan_soal + id_materi + soal + tipe_soal + aktif [0-9] [0-9] [A-Z|a-z|0-9] [A-Z|a-z] [0-9] Data Hasil Latihan Pelajar proses 5.

6 Deskripsi Berisi data topik forum yang dapat digunakan untuk membuat.id_hasil_review id_hasil_latihan_soal id_akun_login jawaban nilai_review Nama Aliran data Digunakan pada [0-9] [0-9] [0-9] [A-Z|a-z] [0-9] Data Kategori Forum Administrator.5 Administrator proses 8.4 Pelajar.3 . Moderator proses 8. Moderator. mengubah dan menghapus kategori forum Strukur data Id_forum_kategori Kategori_forum Nama Aliran data Digunakan pada Id_forum_kategori + Kategori_forum [0-9] [A-Z|a-z|0-9] Data Topik Forum Pelajar.2 Administrator proses 8.1 Moderator proses 8. mengubah dan menghapus topik forum Strukur data id_forum_topik + id_forum_kategori + id_akun_login + tgl_posting + topic_forum + pesan_forum id_forum_topik id_forum_kategori id_akun_login tgl_posting topic_forum pesan_forum Nama Aliran data Digunakan pada [0-9] [0-9] [0-9] Date and time [A-Z|a-z|0-9] [A-Z|a-z|0-9] Data Cari Topik Pelajar. Moderator proses 8.3 Deskripsi Berisi data kategori forum yang dapat digunakan untuk membuat. Moderator proses 8. Administrator proses 8.

Deskripsi Strukur data topik_forum Nama Aliran data Digunakan pada Deskripsi Strukur data

Berisi data kata kunci pencarian topik forum topik_forum [A-Z|a-z] Data Komentar Topik Moderator, Pelajar proses 8.8 Berisi data komuntar topik id_forum_komentar + id_forum_topik + id_akun_login + tgl_komentar + komentar_forum

id_forum_komentar id_forum_topik id_akun_login tgl_komentar komentar_forum Nama Aliran data Digunakan pada

[0-9] [0-9] [0-9] Date and time [A-Z|a-z|0-9] Data Blog Moderator, Pelajar, Administrator proses 7.1 Pelajar, Moderator proses 7.2 Pelajar, Moderator proses 7.3 Pelajar, Moderator, Administrator Proses 7.4

Deskripsi Strukur data

Berisi data blog id_blog + id_akun_login + judul_blog + tgl_posting + banyak_dilihat + aktif

id_blog id_akun_login judul_blog tgl_posting banyak_dilihat aktif Nama Aliran data Digunakan pada Deskripsi

[0-9] [0-9] [A-Z|a-z|0-9] Date and time [0-9] [0-9] Data Komentar blog Moderator, Pelajar proses 7.5 Berisi data komuntar blog

Strukur data

id_blog_komentar + id_blog + id_login + komentar + tgl_komentar

id_blog_komentar id_blog id_login komentar tgl_komentar Nama Aliran data Digunakan pada Deskripsi Strukur data Judul_blog

[0-9] [0-9] [0-9] [A-Z|a-z|0-9] Date and time Data Pencarian Blog Moderator, Pelajar, Administrator proses 7.6 Berisi data pencarian blog Judul_blog [A-Z|a-z|0-9]

3.2

Perancangan Sistem Pada tahap perancangan sistem akan dilakukan perancangan yang

diantaranya adalah sebagai berikut : perancangan basis data, dan perancangan antar muka. 3.2.1 Perancangan Basis Data Perancangan basis data adalah menciptakan atau merancang kumpulan data yang terhubungdan tersimpan secara bersama-sama. Perancangan basis data terdiri dari struktur tabel dan diagram relasi. 3.1 Diagram Relasi Diagram relasi menggambarkan hubungan antara data, arti data dan batasannya dijelaskan dengan baris dan kolom. Adapun keterkaitan tabel relasi

yang digunakan dalam multimedia pembelajaran bahasa Inggris digambarkan sebagai berikut:
blog_komentar level_pengguna PK id_level_pengguna FK1 nama_level id_blog id_login komentar tgl_komentar PK id_blog_komentar

ini dapat

pertemanan PK FK1 id_pertemanan id_profile_pengguna id_profile_teman status_pertemanan

akun_login profile_pengguna PK FK1 id_profile_pengguna FK1 id_akun_login nama_depan nama_belakang namafile_foto jenis_kelamin tempat_lahir tgl_lahir id_negara nama_kota email_telepon alamat kode_pos tentang_saya online aktif pesan negara PK id_negara nama_negara PK FK1 id_pesan id_akun_login kepada isi_pesan tgl_kirim hasil_review hasil_latihan PK FK1 id_hasil_latihan id_akun_login tgl_latihan total_nilai PK FK2 FK1 id_hasil_review id_latihan_soal id_akun_login jawaban nilai_review PK latihan_soal detail_hasil_latihan PK FK1 FK2 FK3 id_detail_hasil_latihan id_hasil_latihan id_latihan_soal id_soal_pilihan_ganda nilai_persoal PK id_latihan_soal id_materi soal tipe_soal aktif FK1 id_level_pengguna akun_pengguna sandi_pengguna tgl_daftar login_terakhir online aktif PK id_akun_login PK FK1 Blog id_blog id_akun_login judul_blog artikel_blog tgl_posting banyak_dilihat aktif

FK2

forum_topik PK FK1 FK2 id_forum_topik id_forum_kategori id_akun_login tgl_posting topik_forum pesan_forum PK forum_kategori id_forum_kategori kategori_forum

Forum_komentar PK FK1 FK2 id_forum_komentar id_forum_topik id_akun_login tgl_komentar komentar_forum

materi id_materi id_bab_pelajaran judul_materi teks_materi namadile_materi_audio namafile_materi_video

soal_pilihan_ganda abjad_pilihan_ganda PK id_abjad_pilihan_ganda abjad FK1 FK2 id_latihan_soal id_abjad_pilihan_ganda desc_pilihan_ganda set_kunci_jawaban PK id_soal_pilihan_ganda PK FK1

bab-pelajaran id_bab_pelajaran PK id_pelajaran judul_bab pelajaran id_pelajaran bab-pelajaran id_akun_login

Gambar 3.20 Diagram Relasi

Male Key PK FK Keterangan Not null Not null.7 Profile Pengguna Nama Field id_profile_pengguna id_akun_login nama_depan nama_belakang namafile_foto jenis_kelamin tempat_lahir tgl_lahir id_negara nama_kota email telepon alamat kode_pos tentang_saya online aktif Type int int varchar varchar varchar enum varchar date int varchar varchar varchar varchar int tinytext tinyint tinyint 2 2 11 100 225 20 225 14 FK 100 Length 11 11 40 40 225 Female.3. unique .2 Struktur Tabel Tabel-tabel yang terdapat dalam basis data yang digunakan dalam sistem ini adalah sebagai berikut: Tabel 3.8 Akun Login Nama Field id_akun_login id_level_pengguna akun_pengguna Type int tinyint varchar Length 11 4 30 Key PK FK Keterangan Not null Not null Not null. unique Tabel 3.

11 Pertemanan Nama Field id_pertemanan id_profile_pengguna id_profile_teman status _pertemanan Type int int int tinyint Length 11 11 11 2 Key PK FK Keterangan Not null Not null Tabel 3.12 Pelajaran Nama Field id_pelajaran bab_pelajaran Type int varchar Length 11 80 Key PK Keterangan Not null .9 level pengguna Nama Field id_level_pengguna nama_level Type tinyint varchar Length 4 100 Key PK Keterangan Not null Tabel 3.10 Negara Nama Field id_negara nama_negara Type int varchar Length 11 100 Key PK Keterangan Not null Tabel 3.sandi_pengguna tgl_daftar login_terakhir online aktif varchar datetime datetime tinyint tinyint 60 Not null 2 2 Tabel 3.

13 Bab Pelajaran Nama Field id_bab_pelajaran id_pelajaran judul_bab Type int int varchat Length 11 11 225 Key PK FK Keterangan Not null Tabel 3.15 Latihan Soal Nama Field id_latihan_soal id_materi soal tipe_soal Type int int tinytext Enum Multiple choose. write aktif tinyint 2 Length 11 11 Key PK FK Keterangan Not null Tabel 3.16 Soal Pilihan Ganda Nama Field id_soal_pilihan_ganda id_latihan_soal Type int int Length 11 11 Key PK FK Keterangan Not null .Tabel 3.14 Materi Nama Field id_materi id_bab_pelajaran judul_materi teks_materi namafile_materi_audio namafile_materi_video Type int int varchar text varchar varchar 225 225 Length 11 11 225 Key PK FK Keterangan Not null Tabel 3.

18 Abjad Pilihan Ganda Nama Field id_abjad_pilihan_ganda abjad Type int char Length 11 2 Key PK Keterangan Not null Tabel 3.17 Hasil Review Nama Field id_hasil_review id_latihan_soal id_akun_login jawaban nilai_review Type int int int varchar tiny Length 11 11 11 225 2 Key PK FK FK Keterangan Not null Tabel 3.id_abjad_pilihan_ganda desc_pilihan_ganda set_kunci_jawaban int varchar tiny 11 225 2 FK Tabel 3.19 Detail Hasil Latihan Nama Field id_detail_hasil_latihan id_hasil_latihan id_latihan_soal id_soal_pilihan_ganda nilai_persoal Type int int int int float Length 11 11 11 11 2 Key PK FK FK FK Keterangan Not null Tabel 3.20 Hasil Latihan Nama Field id_ hasil_latihan id_akun_login Type int int Length 11 11 Key PK FK Keterangan Not null .

tgl_latihan total_nilai datetime float Tabel 3.23 Forum Kategori Nama Field id_ forum_kategori kategori_forum Type int varchar Length 11 100 Key PK Keterangan Not null Tabel 3.21 Blog Nama Field id_ blog id_akun_login judul_blog tgl_posting banyak_dilihat aktif Type int int varchar datetime int tinyint 11 2 Length 11 11 225 Key PK FK Keterangan Not null Tabel 3.22 Blog Komentar Nama Field id_ blog_komentar id_blog id_akun_login komentar tgl_komentar Type int int int tinytext datetime Length 11 11 11 Key PK FK FK Keterangan Not null Tabel 3.24 Forum Topik .

26 Pesan Nama Field id_ pesan id_akun_login kepada isi_pesan tgl_kirim Type int int int varchat datetime Length 11 11 11 225 Key PK FK Keterangan Not null 3.1 Perancangan Arsitektur Perancangan Antar Muka Interface atau antarmuka merupakan tampilan dari suatu program aplikasi yang berperan sebagai media komunikasi yang digunakan sebagai sarana .3.Nama Field id_ forum_topik id_forum_kategori id_akun_login tgl_posting topic_forum pesan_forum Type int int int datetime varchar text Length 11 11 11 Key PK FK FK Keterangan Not null 225 Not null Tabel 3.3 3.25 Forum Komentar Nama Field id_ forum_komentar id_forum_topik id_akun_login tgl_komentar komentar_forum Type int int int datetime varchar 225 Not null Length 11 11 11 Key PK FK FK Keterangan Not null Tabel 3.

Arial.berdialog antara program dengan user.Klik Sign in jika data valid maka akan menuju halaman H01 namun jika tidak valid maka akan menampilkan pesan M01 .21 Antarmuka Index i00 . Perancangan interface untuk aplikasi pembelajaran bahasa Inggris menggunakan konsep jejaring social adalah sebagai berikut : 1. Perancangan Antarmuka Index (pertama kali website di akses) Keterangan : Sign in Email image Password Sign in Header . sans-serif Warna background : Puih Gambar 3. Helvatica. Sistem yang akan dibangun diharapkan menyediakan interface yang mudah dipahami dan digunakan oleh user.Klik Sign up jika data invalid maka akan menampilkan pesan kesalahan namun jika data valid menampilkan pesan M02 Lupa password Sign Up First name : Email : Last_name : Password : Confirm password : I am : Birthday : Sign up Footer Nama Layar : I00 Ukuran Layar : 960 pixel X 600 pixel Font : Verdana.

sans-serif Warna background : Puih Gambar 3. Helvatica.Klik Nama Student menuju halaman P01 .22 Antarmuka Index H01 . Perancangan Antarmuka Home Keterangan : .Klik Course Menuju ke halaman C01 .Klik Message menuju halaman H02 .Klik Forum menuju ke halaman F01 Header Home | Profile | course | Blog | Forum | Account Nama student photo photo Nama student Isi status Isi status Isi status Isi status Isi status Isi status Isi status Isi status Date post Write comment photo Course information Comment status EDIT PROFILE MESSAGE FRIENDS [2] [20] photo Comment status Friends online [2] photo photo photo Nama student Isi status Isi status Isi status Isi status Isi status Isi status Isi status Isi status Date post Write comment photo Comment status photo Comment status Footer Nama Layar : H01 Ukuran Layar : 960 pixel X 600 pixel Font : Verdana.Klik Profile menuju ke halaman P01 .Klik Friends Menuju halaman H03 .2.Klik Blog menuju ke halaman B01 .Klik Edit Profile menuju halaman P02 . Arial.

perancangan antarmuka pesan Keterangan : .Klik Course Menuju ke halaman C01 .Klik Friends Menuju halaman H03 . Helvatica.Klik Profile menuju ke halaman P01 .23 Pesan H02 .Klik Message menuju halaman H02 . sans-serif Warna background : Puih Gambar 3.3. Arial.Klik Forum menuju ke halaman F01 Header Home | Profile | course | Blog | Forum | Account Massages Nama user Judul pesan Nama user Judul pesan Nama user Judul pesan Nama user Judul pesan Course information photo photo date X X X X photo date photo date EDIT PROFILE MESSAGE FRIENDS [2] [20] photo date Friends online [2] photo photo Footer Nama Layar : H02 Ukuran Layar : 960 pixel X 600 pixel Font : Verdana.Klik Blog menuju ke halaman B01 .

Klik Blog menuju ke halaman B01 .Klik Friends menuju halaman H03 . Arial.Klik Course menuju ke halaman C01 . Helvatica.Klik Edit Profile menuju ke halaman P02 .4. sans-serif Warna background : Puih Gambar 3.Klik Forum menuju ke halaman F01 Header Home | Profile | course | Blog | Forum | Account Friends photo Nama Teman Score [400] Nama Teman Score [400] Nama Teman Score [400] Nama Teman Score [400] View X X X X photo photo View Course information photo EDIT PROFILE MESSAGE FRIENDS [2] [20] View photo View Friends online [2] photo photo Footer Nama Layar : H03 Ukuran Layar : 960 pixel X 600 pixel Font : Verdana. Perancangan antarmuka pertemanan Keterangan : .Klik Message menuju halaman H02 .Klik Profile menuju ke halaman P01 .24 Antarmuka petemanan H03 .

Klik Nama Student menuju halaman P01 .Klik Blog menuju ke halaman B01 . sans-serif Warna background : Puih Gambar 3.Klik Message menuju halaman H02 .Klik Profile menuju ke halaman P01 . Arial.Klik Forum menuju ke halaman F01 Header Home | Profile | course | Blog | Forum | Account Nama student photo Nama student Isi status Isi status Isi status Isi status Isi status Isi status Isi status Isi status Date post Write comment Course information photo photo Comment status EDIT PROFILE MESSAGE FRIENDS [2] [20] photo Comment status Friends online [2] photo photo photo Nama student Isi status Isi status Isi status Isi status Isi status Isi status Isi status Isi status Date post Write comment photo Comment status photo Comment status Footer Nama Layar : P01 Ukuran Layar : 960 pixel X 600 pixel Font : Verdana.Klik Course Menuju ke halaman C01 .5.Klik Edit Profile menuju halaman P02 . Perancangan antarmuka profile Keterangan : . Helvatica.25 Antarmuka Profile P01 .Klik Friends Menuju halaman H03 .

Perancangan antarmuka course Keterangan : Klik profile menuju P01 Klik Course menuju C01 Klik Blog menuju B01 Klik Forum menuju F01 Klik learn menuju C02 Klik review menuju C03 Klik write menuju C04 Klik Account->Sign out menuju H01 Header Home | Profile | course | Blog | Forum | Account Judul Course Judul lesson Judul lesson Review activity Write activity learn review write Judul Course Judul lesson Judul lesson learn review write Footer Nama Layar : C01 Ukuran Layar : 960 pixel X 600 pixel Font : Verdana.26 Antarmuka Course C01 . sans-serif Warna background : Puih Gambar 3. Arial. Helvatica.6.

7. Perancangn antarmuka learn Keterangan : Klik profile menuju P01 Klik Course menuju C01 Klik Blog menuju B01 Klik Forum menuju F01 Klik learn menuju C02 Klik review menuju C03 Klik write menuju C04 Klik Account->Sign out menuju H01 Header Home | Profile | course | Blog | Forum | Account TEXT VIDEO AUDIO Review activity Judul materi Write activity Isi materi back review write Footer Nama Layar : C02 Ukuran Layar : 960 pixel X 600 pixel Font : Verdana. Helvatica. sans-serif Warna background : Puih Gambar 3. Arial.27 Antarmuka Learn C02 .

8. Arial. Perancangan antarmuka review student Keterangan : Klik profile menuju P01 Klik Course menuju C01 Klik Blog menuju B01 Klik Forum menuju F01 Klik learn menuju C02 Klik review menuju C03 Klik write menuju C04 Klik Account->Sign out menuju H01 Header Home | Profile | course | Blog | Forum | Account TEXT VIDEO AUDIO Review activity Review Question : Number Pertanyaan pertanyaan pertanyaan __________ A. sans-serif Warna background : Puih Gambar 3.28 Antarmuka Review C03 . Helvatica. pilihan jawaban D. pilihan jawaban C. pilihan jawaban B. pilihan jawaban Write activity Next Footer Nama Layar : C03 Ukuran Layar : 960 pixel X 600 pixel Font : Verdana.

Arial...9. Perancangan antarmuka write student Keterangan : Klik profile menuju P01 Klik Course menuju C01 Klik Blog menuju B01 Klik Forum menuju F01 Klik learn menuju C02 Klik review menuju C03 Klik write menuju C04 Klik Account->Sign out menuju H01 Header Home | Profile | course | Blog | Forum | Account TEXT VIDEO AUDIO Review activity Write Question : Number Pertanyaan pertanyaan pertanyaan?.29 Antarmuka Write Sudent . Write activity Next Footer Nama Layar : C04 Ukuran Layar : 960 pixel X 600 pixel Font : Verdana. sans-serif Warna background : Puih Gambar 3. Helvatica.

Klik Blog menuju ke halaman B01 .Klik Forum menuju ke halaman F01 Popula articles Image blog Judul Artikel Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Judul Blog Thursday.Klik Profile menuju ke halaman P01 . 21 april 11 – 14:31 wib [47] comment [7] comment By name user By name user Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog oto Ph er us User name | profile user | blog user Thursday. 21 april 11 – 14:31 wib [87] comment By name user Keterangan : -Klik judul Artikel menuju ke halaman B02 .10. Perancangan antarmuka blog Header Home | Profile | course | Blog | Forum | Account Search blog go View my blog | All user blog | create article | manage blog Judul Blog Thursday.Klik Edit Profile menuju halaman P02 . Arial. 21 april 11 – 14:31 wib [59] comment Judul Blog Thursday. 21 april 11 – 14:31 wib [59] comment Judul Blog Thursday. 21 april 11 – 14:31 wib Footer Nama Layar : B01 Ukuran Layar : 960 pixel X 600 pixel Font : Verdana. 21 april 11 – 14:31 wib Image blog Judul Artikel Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Recent comment Judul Blog Thursday. 21 april 11 – 14:31 wib [7] comment [59] comment By name user By name user Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog Deskeripsi blog oto Ph er us User name | profile user | blog user Thursday. Helvatica. sans-serif Warna background : Puih Gambar 3.Klik Course Menuju ke halaman C01 .30 Antarmuka Blog B01 .

Perancangan anarmuka content blog Keterangan : Header Home | Profile | course | Blog | Forum | Account Search blog go View my blog | All user blog | create article | manage blog Judul Article Thursday. Footer Nama Layar : B02 Ukuran Layar : 960 pixel X 600 pixel Font : Verdana. 21 april 11 – 14:31 wib [87] comment By name user Popula articles Image blog Judul artikel Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi Judul Article Thursday.31 Antarmuka Content Blog B02 .Klik Forum menuju ke halaman F01 . 21 april 11 – 14:31 wib Write comment .Klik Blog menuju ke halaman B01 . 21 april 11 – 14:31 wib oto Ph er us Nama User komentar komentar komentar komentar komentar komentar komentar komentar komentarkomentar komentar komentar Posted on Thursday. 21 april 11 – 14:31 wib [59] comment By name user By name user oto Ph er us Nama User komentar komentar komentar komentar komentar komentar komentar komentar komentarkomentar komentar komentar Posted on Thursday. sans-serif Warna background : Puih Gambar 3.Klik Course Menuju ke halaman C01 .. Arial.Klik Create article menuku ke halaman B03 -Klik manage blog menuju kehalaman B04 Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog Isi blog [3] Comment Posted on Thursday.11.Klik Edit Profile menuju halaman P02 . Helvatica.Klik Profile menuju ke halaman P01 . 21 april 11 – 14:31 wib Recent comment Judul Article Thursday. 21 april 11 – 14:31 wib [59] comment Judul Article Thursday. 21 april 11 – 14:31 wib [47] comment By name user By name user -Klik judul Artikel menuju ke halaman B02 .. 21 april 11 – 14:31 wib [59] comment Judul Article Thursday.

12. 21 april 11 – 14:31 wib [59] comment By name user By name user Footer Nama Layar : B03 Ukuran Layar : 960 pixel X 600 pixel Font : Verdana. 21 april 11 – 14:31 wib [59] comment By name user Wyswyg (small word editor) Judul Blog Thursday. Helvatica. sans-serif Warna background : Puih Gambar 3.Klik Course Menuju ke halaman C01 .Klik Edit Profile menuju halaman P02 .Klik Profile menuju ke halaman P01 . Arial.Klik Blog menuju ke halaman B01 .32 Antarmuka Membuat Blog B03 . 21 april 11 – 14:31 wib [87] comment Judul Blog By name user Title article Key word Content article Thursday.Klik Forum menuju ke halaman F01 . 21 april 11 – 14:31 wib [47] comment By name user Recent comment Image article Active Save search Judul Blog Thursday.Klik Create article menuku ke halaman B03 -Klik Manage Blog Menuju kehalaman B04 Header Home | Profile | course | Blog | Forum | Account Popula articles View my blog | All user blog | create article | manage blog Judul Blog Thursday. Perancangan antarmuka buat blog Keterangan : -Klik judul Artikel menuju ke halaman B02 . 21 april 11 – 14:31 wib [59] comment Judul Blog Thursday.

Klik Forum menuju ke halaman F01 . Perancangan antarmuka manage blog student Keterangan : -Klik judul Artikel menuju ke halaman B02 .Klik Profile menuju ke halaman P01 . Helvatica. Arial.13.33 Antarmuka Manage Blog B04 .Klik Edit Profile menuju halaman P02 .Klik Create article menuku ke halaman B03 -Klik Manage Blog Menuju kehalaman B04 Header Home | Profile | course | Blog | Forum | Account View my blog | All user blog | create article | manage blog Send on Edit | view | remove Edit | view | remove Edit | view | remove date date date time time time Title Article Title Title Title Status Active Active Active < 1 2 3 Page 10 > Footer Nama Layar : B04 Ukuran Layar : 960 pixel X 600 pixel Font : Verdana.Klik Course Menuju ke halaman C01 .Klik Blog menuju ke halaman B01 . sans-serif Warna background : Puih Gambar 3.

Klik judul kategori menuju kehalaman F02 Posting You can discuss anything here about your study or something interesting Category discussion Judul kategori This category is talk about how to learn grammar correctly.Klik Blog menuju ke halaman B01 . herry 7 90 Footer Nama Layar : F01 Ukuran Layar : 960 pixel X 600 pixel Font : Verdana. People can help you to solve problem about grammar Moderated by Irwan. Arial.14. herry Topik 20 170 Judul kategori This category is talk about conversation like travel.Klik Forum menuju ke halaman F01 .Klik Profile menuju ke halaman P01 . People can help you to solve this problem Moderated by Irwan. sans-serif Warna background : Puih Gambar 3. saputra. Helvatica.Klik Account->sign out menuju kehalaman I00 . Perancangan antarmuka forum student Keterangan : Header Home | Profile | course | Blog | Forum | Account . saputra. novie. novie. office and so on.Klik Course Menuju ke halaman C01 .34 Antarmuka Forum student F01 .

15. Perancangan antarmuka topik forum student
Keterangan:
- Klik Profile menuju ke halaman P01 - Klik Course Menuju ke halaman C01 - Klik Blog menuju ke halaman B01 - Klik Forum menuju ke halaman F01 - Klik Account->sign out menuju kehalaman I00

Header Home | Profile | course | Blog | Forum | Account

back

Add topic / tread

Title category
Title / Thread Starter Replays / views Replies : 3 Views : 20 Replies : 3 Views : 20 Replies : 3 Views : 20 Replies : 3 Views : 20 Replies : 3 Views : 20 Last post By Last post by name user Date and time Last post by name user Date and time Last post by name user Date and time Last post by name user Date and time Last post by name user Date and time

Judul topik
Start by name user, date and time

Judul topik
Start by name user, date and time

Judul topik
Start by name user, date and time

Judul topik
Start by name user, date and time

Judul topik
Start by name user, date and time

<123 ...page.. 10 >

Footer

Nama Layar : F02 Ukuran Layar : 960 pixel X 600 pixel Font : Verdana, Arial, Helvatica, sans-serif Warna background : Puih

Gambar 3.35 Antarmuka Topik Forum Student F02

16. Perancangan antarmuka content forum student

Header Home | Profile | course | Blog | Forum | Account Title category > title topic Title topik
Nama User
Photo user Join date : date Location : city Post : jlm post

Keterangan:
- Klik Profile menuju ke halaman P01 - Klik Course Menuju ke halaman C01 - Klik Blog menuju ke halaman B01 - Klik Forum menuju ke halaman F01 - Klik Account->sign out menuju kehalaman I00

Content Topic content topic Content Topik content topik Content Topik content topik Content Topik content topik Content Topik content topik Content Topik content topik Content Topik content topik Content Topik content topik Content Topik content topik

Nama User
Photo user Join date : date Location : city Post : jlm post

Replay topic Replay topic Replay topic Replay topic Replay topic Replay topic Replay topic Replay topic Replay topic Replay topic Replay topic Replay topic Replay topic Replay topic Replay topic Replay topic Replay topic Replay topic

Post Replay

Footer

Nama Layar : F03 Ukuran Layar : 960 pixel X 600 pixel Font : Verdana, Arial, Helvatica, sans-serif Warna background : Puih

Gambar 3.36 Antarmuka Content Forum F03

17. Perancangan antarmuka replay forum student
Keterangan:
- Klik Profile menuju ke halaman P01 - Klik Course Menuju ke halaman C01 - Klik Blog menuju ke halaman B01 - Klik Forum menuju ke halaman F01 - Klik Account->sign out menuju kehalaman I00 - Klik Post menuju ke halaman F03

Header Home | Profile | course | Blog | Forum | Account

< Back
Title Topik Content Topik

Wyswyg (small word editor)

Image Topik Post

search

Footer

Nama Layar : F04 Ukuran Layar : 960 pixel X 600 pixel Font : Verdana, Arial, Helvatica, sans-serif Warna background : Puih

Gambar 3.37 Replay Forum F04 3.3.2 Perancangan Struktur Menu

1. Struktur Menu Pelajar
Menu

Home

Profile

Course

Blog

Forum

Setting account

Lihat

Hapus

Tambah

Edit

Gambar 3.38 Struktur Menu Pelajar

40 Struktur Menu Administrator 3. Struktur Menu Moderator Menu Home Profile Course Blog Forum Setting account Lihat Hapus Tambah Edit Gambar 3.3.2. Struktur Menu Administrator Menu Home Statistik Manage course Manage blog Manage forum Manage user Setting account Lihat Hapus Tambah Edit Gambar 3.3 Perancangan Pesan Pesancangan pesan yang terdapat pada sistem ini dapat dilihat pada gambar berikut : .39 Struktur Menu Moderator 3.

3.M01 You must fill in all of the fields M02 Enter the fields M03 Format Email Invalid M04 Confirmation Password Invalid M05 Registration success please cek your email for activation M06 Email or password invalid M07 Confirmation email invalid Confirmation email invalid M08 email not found M09 Are you sure want to delete Are you sure want to delete this category course ? this category course ? Yes No M10 Are you sure want to delete this Lesson ? Yes No M11 Are you sure want to delete this Material ? Yes No M12 Are you sure want to delete Are you sure want to delete this blog ? this blog ? Yes No M13 Are you sure want to delete this category forum ? Yes No M14 Are you sure want to delete this topik forum ? Yes No M15 Data 0 result Gambar 3.4 Jaringan Sematik Aliran dari menu-menu yang ada pada program akan dijelaskan pada jaringan sematik berikut : H02 H03 M09 B04 H01 P01 M01 B01 B03 P02 M04 M02 C01 C03 F02 F03 M10 Keterangan : I : Halaman utama H : Halaman home P : Halaman Profile C : Halaman course B : Halaman blog F : Halaman forum C04 C02 M04 M08 C05 M06 i00 M03 B02 F04 F01 Gambar 3.42 Jaringan Sematik .41 Perancangan Pesan 3.

Adapun perancangan prosedural multimedia pembelajaran bahasa Inggris menggunakan konsep jejaring sosial berbasis web adalah sebagai berikut : 1.3.43 Perancangan Prosedural Sign UpPelajar . Perancangan prosedural sign up pelajar mulai Input data Sign up tidak Data valid ? ya Simpan data Daftar sukses silakan aktifasi Selesai Gambar 3.3.5 Perancangan Prosedural Perancangan proseduran digunakan sebagai algoritma dasar dalam langkah mengkodekan prosedur yang ada.

44 Perancangan Prosedural Sign in 3. Perancangan prosedural kursus Mulai Pilih kategori kursus Pilih pelajaran Pilih Materi Ikut latihan Periksa dan simpan hasil latihan Data latihan Tampilkan hasil latihan selesai Gambar 3.2.45 Perancangan Prosedural Kusus . Perancangan prosedural Sign in mulai Input data Sign in tidak Data valid ? ya Tampilkan halaman user Selesai Gambar 3.

Perancangan procedural edit data Mulai Cari data yang diubah tidak pencarian Tabel data Ketemu ? ya Edit data invalid Ubah data Cek data? valid Ubah data Tampil data Selesai Gambar 3. Perancangan procedural tambah data mulai Input data invalid Cek data valid Simpan data Tabel data Tampil data Selesai Gambar 3.4.46 Perancangan Prosedural Tambah Data 5.47 Perancangan Prosedural Edit Data .

48 Perancangan Prosedural Hapus data .6. Perancangan procedural hapus data Mulai Pilih data Pastikan hapus tidak Yakin data dihapus ya Hapus Tabel data Selesai Gambar 3.

You're Reading a Free Preview

Mengunduh
scribd
/*********** DO NOT ALTER ANYTHING BELOW THIS LINE ! ************/ var s_code=s.t();if(s_code)document.write(s_code)//-->