Jumat, 01 Mei 2015

Apa Itu IMK




KATA PENGANTAR

Puji syukur saya panjatkan kehadirat Allah SWT yang telah melimpahkan rahmat-Nya sehingga saya dapat menyelesaikan tugas makalah ini.
Tujuan yang akan di dapat dari mata kuliah ini adalah untuk memahami manusia sebagai sumber daya terpenting dalam membangun sistem dan juga manusialah yang harus diperhatikan karena nantinya ialah yang akan menggunakan sistem yang dibangun itu.
Makalah ini berisi untuk memenuhi tugas yang membahas tentang Interaksi Manusia dan Komputer”.
            Saya menyadari bahwa makalah ini masih banyak kekurangan dan hal-hal lain sehingga makalah ini dirasa belum sempurna. Hal ini disebabkan keterbatasan pengetahuan dan kemampuan menyusun. Untuk itu saya mengharapkan kritik dan saran yang sifatnya membangun demi kesempurnaan dan meningkatkan kualitas makalah ini.
           
                                                                                                Depok, Maret 2015
                                                                                                         Penulis
                                                                                                  
                                                                                                      Nurjanah










                                                                                                 
DAFTAR ISI
HALAMAN JUDUL  ………………………………………………………………    i
KATA PENGANTAR  ……………………………………………………………..    ii
DAFTAR ISI ……………………………………………………………………….    iii
BAB I PENDAHULUAN..........................................................................................    1
1.1 Latar Belakang ………………………………………………………….    1
1.2 Tujuan …………….. ……………………………………………………  1
BAB II LANDASAN TEORI………………………………………………………    2
2.1 Komputer  ………………………………………………………………  2
BAB III INTERAKSI MANUSIA DAN KOMPUTER…………………………….   3
3.1 Perancang antarmuka manusia dan computer ……………………………   3
3.2 Model atau jenis interaksi ………………………………………………..  4
3.3 Pengertian interaksi………………………………………………………  5
3.4 Definisi interaksi manusia dan computer…………………………………    5
3.5 Faktor-faktor pendewasaan HCI………………………………………     5
BAB VI KESIMPULAN DAN SARAN ..................................................................   10
4.1 Kesimpulan    ..........................................................................................   10
4.2 Saran ......................................................................................................   10 
DAFTAR PUSTAKA  .............................................................................................    iii












BAB 1
PENDAHULUAN

1.1  Latar belakang

Makalah ini bertujuan untuk menghasilkan sistem yang bermanfaat (usable) dan aman (safe), artinya sistem tersebut dapat berfungsi dengan baik. Sistem tersebut bisa untuk mengembangkan dan meningkatkan keamanan (safety), utilitas (utility), ketergunaan (usability), efektifitas (efectiveness) dan efisiensinya (eficiency). Sistem yang dimaksud konteksnya tidak hanya pada perangkat keras dan perangkat lunak, tetapi juga mencakup lingkungan secara keseluruhan, baik itu lingkungan organisasi masyarakat kerja atau lingkungan keluarga. Sedangkan Ketergunaan (usability) disini dimaksudkan bahwa sistem yang dibuat tersebut mudah digunakan dan mudah dipelajari baik secara individu ataupun kelompok. Utilitas mengacu kepada fungsionalitas sistem atau sistem tersebut dapat meningkatkan efektifitas dan efesiensi kerjanya.
1.2  Tujuan
Tujuan yang ingin dicapai dalam mata kuliah ini adalah :
● Mahasiswa mampu memahami pengertian computer
● Mahasiswa mampu memahami penjelasan semua tentang interaksi manusia dan komputer
● Mahasiswa mampu memahami manusia sebagai sumber daya terpenting dalam membangun     system.





















BAB II

LANDASAN TEORI
2.1 Komputer

Ketika komputer pertama kali diperkenalkan secara komersial pada tahun 50-an, mesin ini sangat sulit dipakai dan sangat tidak praktis. Hal demikian karena waktu itu komputer merupakan mesin yang sangat mahal dan besar, hanya dipakai dikalangan tertentu, misalnya para ilmuwan atau ahli-ahli teknik.
Setelah komputer pribadi (PC) diperkenalkan pada tahun 70-an, maka berkembanglah penggunaan teknologi ini secara cepat dan mengagurnkan ke berbagai penjuru kehidupan (pendidikan, perdagangan, pertahanan, perusahaan, dan sebagainya). Kemajuan-kemajuan teknologi tersebut akhirnya juga mempengaruhi rancangan sistem. Sistem rancangan dituntut harus bisa memenuhi kebutuhan pemakai, sistem harus mempunyai kecocokkan dengan kebutuhan pemakai atau suatu sistem yang dirancang harus berorientasi kepada pemakai. Pada awal tahun 70-an ini, juga mulai muncul isu teknik antarmuka pemakai (user interface) yang diketahui sebagai Man-Machine Interaction (MMI) atau Interaksi Manusia-Mesin.
Pada Man-Machine Interaction sudah diterapkan sistem yang “user friendly”. Narnun, sifat user friendly pada MMI ini diartikan secara terbatas. User friendly pada MMI hanya dikaitkan dengan aspek-aspek yang berhubungan dengan estetika atau keindahan tampilan pada layar saja. Sistem tersebut hanya menitik beratkan pada aspek rancangan antarmukanya saja, sedangkan faktor-faktor atau aspek-aspek yang berhubungan dengan pemakai baik secara organisasi atau individu belum diperhatikan [PRE94].
Para peneliti akademis mengatakan suatu rancangan sistem yang berorientasi kepada pemakai, yang memperhatikan kapabilitas dan kelemahan pemakai ataupun sistem (komputer) akan memberi kontribusi kepada interaksi manusia-komputer yang lebih baik. Maka pada pertengahan tahun 80-an diperkenalkanlah istilah Human-Computer Interaction (HCI) atau Interaksi Manusia-Komputer.





BAB III
INTERAKSI MANUSIA DAN KOMPUTER


3.1 Perancang antarmuka manusia dan komputer
Para perancang antarmuka manusia dan komputer berharap agar sistem komputer yang dirancangnya dapat bersifat akrab dan ramah dengan penggunanya (user friendly).

Untuk membuat antarmuka yang baik dibutuhkan pemahaman beberapa bidang ilmu, antara lain :

1. Teknik elektronika & ilmu komputer
  memberikan kerangka kerja untuk dapat merancang sistem HCI

2. Psikologi
 memahami sifat & kebiasaan, persepsi & pengolahan kognitif, ketrampilan motorik               pengguna

3. Perancangan grafis dan tipografi
sebuah gambar dapat bermakna sama dengan seribu kata. Gambar dapat digunakan sebagai sarana dialog cukup efektif antara manusia & komputer

4. Ergonomik
berhubungan dengan aspek fisik untuk mendapatkan lingkungan kerja yang nyaman, misal : bentuk meja & kursi kerja, layar tampilan, bentuk keyboard, posisi duduk, pengaturan lampu, kebersihan tempat kerja

5. Antropologi
ilmu pengetahuan tentang manusia, memberi suatu pandangan tentang cara kerja berkelompok yang masing – masing anggotanya dapat memberikan konstribusi sesuai dengan bidangnya

6. Linguistik
merupakan cabang ilmu yang mempelajari tentang bahasa. Untuk melakukan dialog diperlukan sarana komunikasi yang memadai berupa suatu bahasa khusus, misal bahasa grafis, bahasa alami, bahasa menu, bahasa perintah

7. Sosiologi
studi tentang pengaruh sistem manusia-komputer dalam struktur sosial, misal adanya PHK karena adanya otomasi kantor.
3.2 Model atau jenis interaksi
Manusia pada umumnya tidak pernah tahu apa yang terjadi pada saat data dimasukkan ke dalam kotak cpu melalui keyboard. Manusia (user) selalu terfokus pada monitor/printer sebagai keluaran.Manusia jarang sekali menyadari proses interaksi dengan komputer. Manusia baru menyadari proses interaksi tersebut saat menemukan masalah dan tidak menemukan solusi pemecahannya. Biasanya manusia menyalahkan antarmuka yang kurang inovatif, kurang menarik, kurang komunikatif.
           Interaksi bisa dikatakan dialog antara user dengan komputer.
           Model atau jenis interaksi, antara lain :
              1. Command line interface (perintah baris tunggal)
                  contoh : unix, linux, dos
             2. Menu (menu datar dan menu tarik)
                  contoh : hampir semua software menggunakan menu
             3. Natural language (bahasa alami)
                 contoh : bahasa pemrograman terstruktur (belum objek)
             4. Question/answer and query dialogue
                 contoh : mysql, dbase interaktif, dll
             5. Form-fills and spreadsheets
                 contoh : excel, lotus, dll
             6. WIMP
              - Windows Icon Menu Pointer
            - Windows Icon Mouse Pulldown Menu
            yang termasuk komponen WIMP : button, dialogue boxes, pallettes, dll.

3.3 Pengertian interaksi
Bidang ilmu interaksi manusia dan komputer adalah ilmu yang mempelajari tentang bagaimana mendesain, mengevaluasi, dan mengimplementasikan sistem komputer yang interaktif sehingga dapat digunakan oleh manusia dengan mudah.
Komunikasi 2 arah antara manusia (user) dan sistem komputer.
Interaksi menjadi maksimal apabila kedua belah pihak mampu memberikan stimulan dan respon (aksi & reaksi) yang saling mendukung, jika salah satu tidak bisa, maka interaksi akan mengalami hambatan atau bahkan menuju pembiasan tujuan.

3.4 Definisi interaksi manusia dan komputer
         Interaksi manusia dan komputer adalah sebuah hubungan antara manusia dan komputer yang mempunyai karakteristik tertentu untuk mencapai suatu tujuan tertentu dengan menjalankan sebuah sistem yang bertopengkan sebuah antarmuka (interface).
         Prinsip kerja komputer = input proses output
Kepada komputer diberikan data yang umumnya berupa deretan angka dan huruf. Kemudian diolah didalam komputer yang menjadi keluaran sesuai dengan kebutuhan dan keinginan manusia.
         Tanpa disadari kita (manusia/user) telah berinteraksi atau berdialog dengan sebuah benda (layar monitor), yaitu dalam bentuk menekan tombol berupa tombol angka dan huruf yang ada pada keyboard atau melakukan satu sentuhan kecil pada mouse.
Yang kemudian hasil inputan ini akan berubah bentuk menjadi informasi atau data yang seperti diharapkan manusia dengan tertampilnya informasi baru tersebut pada layar monitor atau bahkan mesin pencetak (printer).

3.5 Faktor-faktor pendewasaan HCI
Ada berbagai faktor yang ikut mendewasakan dan mengembangkan interaksi manusia dan komputer, khususnya kecerdasan buatan (artificial intelligence), rekayasa perangkat lunak (software engineering) dan matematika (mathematics)

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhTZk8YZwxof4fnIavnc13O6-qtafXJ78NrsIq4DAZLkSOToV9MFFCV6SsNvlrZo9RNNhcc75vdo-YBc9Jd3A-OMlH_xg9WKW-fabzUxrYxMI5cWbHcrw2MbNeYmKssxQ116gdW-IaSzg/s320/gf.bmp

●  Faktor rekayasa perangkat lunak
Rakayasa perangkat lunak dapat didefinisikan sebagai berikut :
  1. Instruksi-instruksi yang bila dieksekusi akan memberikan fungsi dan kerja yang diinginkan
  2. Struktur data yang memungkinkan suatu program memanipulasi informasi secara proposional
  3. Dokumen yang menggambarkan operasi dan kegunaan program
Faktor ini dapat menciptakan suatu program yang efektif, efisien dan user friendly sehingga dapat dihasilkan suatu mesin yang betul-betul diinginkan oleh user.
● Faktor kecerdasan buatan
Kecerdasan buatan  bertujuan agar komputer dapat melakukan pekerjaan seperti dan sebaik yang dilakukan manusia serta menggabungkan cara berpikir manusia dan mesin, untuk mengambil keputusan, memecahkan masalah dan pembelajaran.

Faktor kecerdasan buatan mempunyai peran untuk menciptakan suatu sistem yang betul-betul andal, canggih dan menyerupai pola berpikir manusia, misalnya Robot. Selain itu faktor ini menyebabkan perkembangan HCI semakin sulit dibayangkan.
● Faktor linguistic komputasional
Peran bahasa yang digunakan sebagai antar muka agar user lebih mudah menggunakan sistem tersebut dan tidak terjadi kesalah pahaman di dalam menggunakannya. Dibutuhkan suatu komposisi bahasa yang sangat baik dan dapat dengan mudah dimengerti oleh user.
● Faktor Psikologi
Pemahaman akan psikologi orang yang akan menggunakan  software sangat dibutuhkan mengingat setiap user memiliki sifat dan kelakuan yang berbeda. Didalam merancang progran faktor ini harus dipikirkan terlebih dahulu, seperti siapa target pengguna program, bagaimana suasana lingkungan, perilaku pengguna secara umum dan sebagainya agar program yang dirancang lebih user friendly.
Faktor ini juga mencakup pengetahuan dan keahlian pengguna dalam mempersepsikan  dan memecahkan masalah (problem solving)
● Faktor multimedia
Konteks multimedia digunakan sebagai sarana dialog yang sangat efektif antara manusia dan komputer untuk menghasilkan tampilan yang lebih menarik dan lebih mudah dimengerti oleh pengguna misalnya dengan gambar, suara, teks, grafik dan sebagainya.
● Faktor Antropologi
Faktor ini memberikan gambaran tentang tata cara kerja kelompok yang masing-masing anggotanya diharapkan dapat memberikan kontribusi sesuai bidang masing-masing. Faktor antropologi dapat memberikan pandangan yang mendalam tentang tata cara kerja dari setiap kelompok karyawan yang ada, dimana terjadi komunikasi antara manusia dan peralatan yang mereka gunakan.
●Faktor Ergonomik
Faktor ini berhubungan dengan aspek fisik untuk mendapatkan lingkungan kerja yang nyaman. Letak meja, kursi, monitor, keyboard, mouse, posisi duduk, pengaturan pencahayaan, kebersihan dan berbagai aspek lain akan sangat berpengaruh terhadap interaksi manusia dengan komputer yang digunakan.
● Faktor Sosiologi
Faktor ini berhubungan dengan pengaruh sistem komputer dalam struktur sosial. Pada intinya faktor ini merupakan konteks dari suatu interaksi.
● Teknik penulisan
Suatu program aplikasi yang dibuat membutuhkan manual agar orang yang belum biasa menggunakan aplikasi tersebut bisa mempelajarinya terlebih dahulu agar terjadi interaksi yang baik.
● Faktor matematika
Pembuatan suatu software haruslah efisien dalam perhitungan matematika. Jika suatu software bisa dijalankan oleh semua orang yang baru belajar maupun pakar,  unsur kemudahan dalam segi hitungan matematika akan membuat software tersebut disukai oleh banyak orang.
● Faktor bisnis
Faktor ini mempengaruhi perkembangan dan semakin memudahkan terjadinya interaksi manusia dan komputer. Persaingan bisnis yang semakin ketat menghasilkan produk yang lebih mudah digunakan.
Perusahaan hardware berusaha membuat produk yang memudahkan manusia dalam memenuhi kebutuhannya, misalnya alat elektronik seperti ponsel, PDA, dan komputer yang makin fleksibel. Hal ini juga memacu perkembangan perangkat lunak yang lain yang juga semakin memudahkan manusia berinteraksi dengan mesin. Prinsip ekonomi juga berlaku, semakin banyak permintaan pasar, para penyuplai pun akan berusaha untuk memenuhinya.
● Manusia
Manusia dipandang sebagai sistem yang memproses informasi sebagai berikut :
  1. Informasi disimpan dalam ingatan (memory)
  2. Informasi diproses dan diaplikasikan dengan berbagai cara
Proses pemasukan dan pengeluaran yang terjadi pada manusia merupakan suatu pandangan (vision). Proses ini mempunyai dua tahap, yaitu :
  1. Pemasukan secara fisik dari stimulus
  2. Pengelolaan dan interpretasi dari stimulus
Alat fisik yang dugunakan untuk mendapat kan visi adalah mata. Proses yang terjadi pada mata untuk mendapatkan visi adalah sebagai berikut :
  1. Merupakan suatu mekanisme penerimaan cahaya yang ditransformasikan ke dalam energi elektrik
  2. Cahaya memantul dari obyek yang dipandang dan citranya difokuskan secara terbalik pada retina
  3. Retina mengandung rod (organ berbentuk batang) untuk pandangan cahaya lemah dan cone (organ yang berbentuk kerucut) untuk pandangan berwarna
  4. Sel ganglion (pusat syaraf) berfungsi untuk mendeteksi pola dan pergerakan



















BAB VI
KESIMPULAN DAN SARAN
4.1  Kesimpulan
Untuk menghasilkan sistem yang bermanfaat (usable) dan aman (safe), artinya sistem tersebut dapat berfungsi dengan baik. Sistem tersebut bisa untuk mengembangkan dan meningkatkan keamanan (safety), utilitas (utility), ketergunaan (usability), efektifitas (efectiveness) dan efisiensinya (eficiency). Sistem yang dimaksud konteksnya tidak hanya pada perangkat keras dan perangkat lunak, tetapi juga mencakup lingkungan secara keseluruhan, baik itu lingkungan organisasi masyarakat kerja atau lingkungan keluarga. Sedangkan Ketergunaan (usability) disini dimaksudkan bahwa sistem yang dibuat tersebut mudah digunakan dan mudah dipelajari baik secara individu ataupun kelompok. Utilitas mengacu kepada fungsionalitas sistem atau sistem tersebut dapat meningkatkan efektifitas dan efesiensi kerjanya.
4.2  Saran
Untuk kemajuan teknologi computer maka diharapkan agar perkembangan computer kedepan mampu mengubah pola fikir dan menjadikan masyarakat Indonesia menjadi manusia yang kreatif dan inovatif. Serta tumbuhnya kratifitas hingga menghasilkan suatu karya yang berguna bagi manusia.
Diharapkan dengan adanya Interaksi manusia dan komputer dapat dimanfaatkan sesuai dengan kegunaan.
 Kemajuan computer dimasa mendatang diharapkan dapat membantu semua jenis pekerjaan manusia sehingga mereka mampu menyelesaikan pekerjaan mereka dengan cepat karena dimasa depan teknologi akan semakin canggih dan semua pekerjaan dikerjakan dengan system komputerisasi




DAFTAR PUSTAKA


Analisa tampilan aplikasi



Modul Pembuatan Aplikasi Berbasis Web

“Perpustakaan” ( SMK RPL )


A. Gambaran Aplikasi
Aplikasi Perpustakaan adalah aplikasi yang terinstall pada suatu webserver di suatu lembaga (sekolah, kampus, kantor) yang berfungsi melayani kebutuhan peminjaman buku bagi para anggotanya. Aplikasi ini dioperasikan oleh petugas perpustakaan, dan menggunakan database seperti pada diagram di bawah.
Software yang dibutuhkan antara lain :
– Web Server, Database Server, dan Database Manager (dapat menggunakan Xampp, Wamp, dll, atau install satu-persatu)
– Software desain web (Corel Draw, Photoshop, Gimp, dll)
– Software web development (Dreamweaver, Notepadd++, Sublime, dll)
B. Database
Rancangan database dari aplikasi ini telah disediakan oleh pemberi tugas, dengan perincian sebagai berikut
http://webmediacenter.com/wp-content/uploads/2013/11/web.png
Dapat dilihat dari diagram di atas, database tersebut sebenarnya masih belum sempurna. Misalnya, untuk memasang fitur security dan login, maka pada tabel “petugas” perlu ditambahkan field “password”. Field ini akan kita tambahkan sendiri nanti (lihat video tutorialnya).
C. Tahapan Pembuatan
Tahapan pembuatan aplikasi dapat diuraikan sebagai berikut :
1. Pembuatan database (PHPMyAdmin)
2. Desain tampilan aplikasi (Photoshop)
3. Slicing terhadap desain (Dreamweaver)
4. Integrasi program PHP (Dreamweaver)
D.1. Pembuatan database
Untuk pembuatan database, dapat menggunakan :
– Software database manager, baik yang berupa aplikasi desktop (seperti Navicat) maupun aplikasi web (seperti PHPMyAdmin)
– Langsung ke database server melalui MySQL console (command prompt)
Cara yang akan kita gunakan dalam modul ini (dan juga merupakan cara yang sering dipakai pada umumnya) adalah dengan menggunakan PHPMyAdmin.
D.2. Desain tampilan aplikasi
Sebelum mendesain, biasanya ada tahapan-tahapan analisa dan konsep yang terlebih dahulu dilakukan. Tahapan-tahapan tersebut meliputi, konsep flowchart, activity diagram, analisa kebutuhan user, dan lain sebagainya. Tetapi karena media yang terbatas, tahapan-tahapan tersebut tidak kita bahas. Jika ingin lebih memperdalamnya lagi, referensinya dapat dicari di internet.
Untuk menyederhanakan pembahasan, kita rancang aplikasi web ini memiliki halaman-halaman berikut :
– Halaman Login
– Halaman Peminjaman Buku
– Halaman Pengembalian Buku
– Halaman Administrasi – Pengelolaan Daftar Penerbit
– Halaman Administrasi – Pengelolaan Daftar Kategori
– Halaman Administrasi – Pengelolaan Daftar Buku
– Halaman Administrasi – Pengelolaan Daftar Peminjam
– Halaman Administrasi – Pengelolaan Daftar Petugas
– Halaman Administrasi – Laporan (Report)
Contoh gambar desain yang ditunjukkan cara pembuatannya di dalam Video Tutorial.
http://webmediacenter.com/wp-content/uploads/2013/11/web1.png
Gambar 1 Halaman Login
Gambar 2 Halaman Peminjaman
D.3. Slicing terhadap desain
Setelah desain di Photoshop selesai, selanjutnya pelu dilakukan proses slicing untuk memetakan areal desain menjadi halaman web. Slicing dapat dilakukan langsung di dalam Photoshop, tetapi lebih baik dilakukan secara manual dengan menggunakan Dreamweaver untuk mendapatkan hasil yang efektif, yaitu halaman web yang tidak bloated (menggunakan gambar secara berlebihan). Dengan cara manual kita dapat mengambil gambar secara partial (sebagian kecil saja) dari desain aslinya tetapi diatur supaya tampil penuh di dalam halaman web yang dihasilkan.
D.4. Integrasi program PHP
Tahapan slicing menghasilkan halaman web statis, yaitu web yang belum dapat menampilkan informasi berdasarkan input tertentu. Untuk itu perlu diintegrasikan rutin PHP di dalam web tersebut agar dapat menampilkan data yang dinamis, dan juga terhubung dengan database.
Sylllabus / Outline Tahapan Pembuatan (per Video)
1. Pembuatan database (PHPMyAdmin)
Video 1.1  Menjelaskan cara pembuatan database Perpustakaan, dan beberapa tabel di dalamnya, beserta cara penentuan type field dan fungsinya.
Video 1.2  Menjelaskan cara membuat sisa tabel yang belum dibuat, dan cara menghubungkan Foreign Key, serta cara menampilkan relasinya dalam bentuk diagram.
2. Desain tampilan aplikasi (Photoshop)
Video 2.1  Menjelaskan cara men-setting dokumen Photoshop untuk desain web, dan cara mendesain bagian headernya.
Video 2.2  Menjelaskan cara merancang logo (menggunakan Flash) menggunakan tools-tools yang ada, dan cara mengexportnya untuk dijadikan logo dalam desain Photoshop.
Video 2.3  Menjelaskan sifat dan cara membuat menu web di dalam Photoshop, dan cara memencari dan menggunakan symbol-symbol untuk dipergunakan dalam mendesain web.
Video 2.4  Menjelaskan cara mendesain bagian konten di dalam web, seperti misalnya bagian judul, tabel, dan form.
Video 2.5  Menjelaskan maksud, tujuan dan cara mendesain bagian footer di dalam web.
Video 2.6  Menunjukkan cara mendesain halaman yang berbeda, yaitu Halaman Peminjaman.
Isi video menunjukkan cara mendesain bagian tabel yang dari tampilan desainnya dapat menunjukkan bahwa isi tabel tersebut berupa data dinamis yang berasal dari database.
Video 2.7  Melanjutkan desain halaman Peminjaman, dan menunjukkan cara mendesain halaman yang berisi banyak form, dan tabel.
3. Slicing terhadap desain (Dreamweaver)
BAGIAN A : Membuat Template Halaman
Video 3.A.1  Menunjukkan cara mempersiapkan Dreamweaver sebelum memulai project pembuatan website, yaitu setting Site Manager.
Video 3.A.2  Menjelaskan cara membuat dua file utama yaitu file index dan file css, dan cara menghubungkan keduanya.
Video 3.A.3  Menjelaskan cara menterjemahkan desain Photoshop menjadi sebuah halaman web, dimulai dari bagian headernya, dan diuji dengan ditampilkan dalam browser.
Video 3.A.4  Menunjukkan cara mengisi bagian header, yang meliputi tulisan dan gambar.
Video 3.A.5  Menjelaskan cara membuat menu dan link.
Video 3.A.6  Menjelaskan cara membuat bagian konten, dimana hanya kerangkanya saja yang dibuatkan. Karena isinya nanti akan berbeda-beda antara satu halaman web dengan yang lainnya.
Video 3.A.7  Menjelaskan cara membuat bagian footer.
Video 3.A.8  Menjelaskan cara memperlakukan halaman web yang sudah sempurna kerangkanya untuk dijadikan sebagai template desain. Gunanya adalah untuk mempermudah langkah membuat halaman-halaman berikutnya nanti.
BAGIAN B : Membuat Konten Template

Video 3.B.1 ? Menjelaskan cara membuat tabel untuk login berikut dengan cara mempersiapkan css-nya, supaya tabel-tabel yang modelnya sama nantinya dapat diciptakan ulang dengan otomatis.
Video 3.B.2 ? Menjelaskan cara membuat menu utama dan menjadikannya sebagai snippets, supaya nantinya menu-menu seperti ini dapat dipasang pada halaman-halaman lain dengan otomatis namun tetap sesuai antara isi menu dan isi halaman.
Video 3.B.3 ? Menjelaskan cara membuat tabel untuk data peminjam dengan memanfaatkan css tabel yang telah dibuatkan sebelumnya.
Video 3.B.4 ? Menunjukkan cara membuat bentuk-bentuk tabel lain yang berbeda dari sebelumnya, untuk keperluan menampilkan panel peminjaman dan data buku.
Video 3.B.5  Memperbaiki css dengan cara menguji tampilan web pada berbagai jenis browser, yaitu Firefox, Internet Explorer, dan Chrome.
Video 3.B.6  Menunjukkan cara membuat halaman khusus untuk menu Administrasi dimana nantinya halaman ini sebagai pusat maintenance database.
Video 3.B.7  Melanjutkan penyempurnaan halaman Administrasi supaya secure namun tetap nyaman diakses.
Video 3.B.8  Memasukkan menu-menu Administrasi sebagai snippets yang kedua.
4. Integrasi program PHP (Dreamweaver)

Video 4.1  Menjelaskan cara menggunakan fasilitas Dreamweaver untuk membangun koneksi antara halaman web dengan database server, dan mempraktekkannya langsung dengan membuat login user, juga dari fasilitas Dreamwever. Lalu menunjukkan cara modifikasi agar dapat menentukan sendiri cara pemeriksaan passwordnya.
Video 4.2  Menunjukkan cara memasang security halaman dengan menggunakan fasilitas dari Dreamweaver, yaitu Restict Access.
Video 4.3  Menjelaskan cara membuat halaman admin untuk menambah penerbit baru melalui fasilitas Dreamweaver, yaitu Insert Record. Lalu mengujinya di browser dan mengeceknya dalam database.
Video 4.4  Menjelaskan cara menampilkan Daftar Penerbit dengan menggunakan fasilitas Dreamweaver, yaitu Recordset, Repeat Region dan Dynamic Text.
Video 4.5  Menjelaskan cara membuat halaman Edit Penerbit dengan menggunakan fasilitas dinamis dari Dreamweaver, dan menunjukkan cara pemakaian URL Parameter String sebagai wadah komunikasi antara halaman Daftar dan halaman Edit.
Video 4.6  Memanfaatkan menu Logout dari Dreamweaver dan memodifikasinya untuk memudahkan akses dari menu yang telah kita buat.
Video 4.7  Menunjukkan cara membuat halaman Delete Penerbit, juga dengan memanfaatkan menu otomatis yang telah disediakan Dreamweaver.
Video 4.8  Menunjukkan cara menambahkan paging (navigasi data) ke halaman Daftar Penerbit, dengan menggunakan fasilitas paging dari Dreamweaver.
Video 4.9  Menjelaskan cara membuat halaman admin untuk menambah kategori buku dengan memanfaatkan fasilitas Insert Record dari Dreamweaver.
Video 4.10  Menjelaskan cara membuat daftar kategori dengan menggunakan Recordset, Repeat Region, dan Dynamic Text dari Dreamweaver.
Video 4.11  Menjelaskan cara membuat halaman admin untuk mengedit kategori buku dengan menggunakan fasilitas dinamis dari Dreamweaver.
Video 4.12  Menjelaskan catatan khusus mengenai kekhususan Primary Key dan cara penananganannya pada form Edit.
Video 4.13  Menjelaskan cara membuat halaman Delete Kategori disertai konfirmasi terlebih dahulu.
Video 4.14  Menjelaskan cara membuat form Tambah Buku dengan menyertakan dua Recordset yang terhubung dengan database Penerbit dan database Kategori, masing-masing dalam elemen Select/List yang dinamis.
Video 4.15  Menjelaskan cara membuat tabel dinamis Daftar Buku dengan menggunakan Recordset, Repeat Region, dan Dynamic Text dari Dreamweaver.
Video 4.16  Menjelaskan cara membuat form Edit Buku dan cara mengatur elemen Select/List supaya otomatis memilih row yang tepat dari Recordset Penerbit dan Kategori.
Video 4.17  Menjelaskan cara membuat halaman Tambah Peminjam, dengan form yang bisa melakukan upload picture, berikut penjelasan mengenai pilihan field blob atau text pada database.
Video 4.18  Menjelaskan cara membuat form Edit Peminjam, dan cara penanganan form Upload jika melakukan Update field Foto.
Video 4.19  Menjelaskan cara membuat halaman Peminjaman yang menampilkan gabungan data-data dari Recordset Peminjam, Buku, Penerbit, Kategori. Dan juga cara memakai ajax/javascript untuk membuat form yang dinamis jumlahnya, sesuai dengan jumlah buku yang dipinjam.
Video 4.20  Menjelaskan cara membuat halaman Pengembalian dan cara penghitungan hari keterlambatan dan jumlah denda yang harus dibayar.
Video 4.21  Menjelaskan cara membuat halaman Laporan / Report.