A8 Seminar Nasional Teknologi Informasi 2009

40

APLIKASI KLIEN BERBASIS TCP/IP UNTUK MANAJEMEN PRESENTASI DI RUANG KELAS

Iwan Handoyo Putro 1) Petrus Santoso 2) Gerry ASP Sampetoding 3)

1,2,3) Jurusan Teknik Elektro, Fakultas Teknologi Industri, Universitas Kristen Petra Jl. Siwalankerto 121-13, Surabaya 60236

e-mail : iwanhp@petra.ac.id, petrus@petra.ac.id, m23404053@john.petra.ac.id

ABSTRACT Teaching in a class room that equipped with computer could give many benefits as well as drawbacks. While the teacher could deliver their materials in such interesting manner, on the other hand, the student could possibly lose their concentration by doing other activities, such as chatting and, browsing. Therefore an application should be developed in order to help teacher to monitor student activities.

This paper describes the development of client application that support learning and teaching process especially on teacher’s presentation management. This application was built by using Microsoft Visual C# languages and has a responsibility to present lecturer’s material on the student’s monitor which was taken from instructor computer.

The experiment result shows that the average time required by application to present lecturer’s material to student’s computer screen is 0.47 seconds.

Key words

TCP/IP Application, Presentation Management, HTTP Protocol

1. Pendahuluan

Selama ini metode penyampaian pengajaran dilakukan di dalam kelas dengan menggunakan media seperti papan tulis atau OHP. Namun dengan semakin berkembangnya teknologi, proses belajar mengajar mulai dilakukan dengan bantuan komputer sehingga materi yang disampaikan menjadi lebih menarik.

Di universitas yang sudah memiliki fasilitas kelas dengan komputer, proses perkuliahan berlangsung dengan instruktur menjelaskan materi perkuliahan serta memperlihatkan materi yang diajarkan dengan komputer yang terhubung dengan LCD proyektor di depan kelas. Di lain sisi, mahasiswa dapat memperhatikan materi yang

diberikan sambil mencari bahan pendukung lain dengan komputer di hadapannya masing-masing.

Meskipun model pengajaran ini menguntungkan, namun, tidak dapat disangkal terdapat beberapa kelemahan. Di antaranya adalah konsentrasi mahasiswa dalam proses perkuliahan kadang tidak terfokus kepada materi yang diajarkan oleh instruktur di depan kelas. Hal ini terjadi karena mahasiswa lebih tertarik untuk melakukan hal yang lainnya dengan komputer di depannya yang tidak berhubungan dengan materi dan perkuliahan.

Selanjutnya, instruktur kesulitan memonitor dan mengetahui hal yang dilakukan oleh mahasiswa, karena fokus pada penyampaian materi. Kendala lain adalah ketika seorang mahasiswa menemukan materi yang menarik di internet yang berhubungan dengan materi kuliah tersebut, instruktur tidak dapat menunjukkan layar komputer mahasiswa tersebut ke semua mahasiswa secara langsung.

2. Dasar Teori

2.1. Protokol TCP/IP

Protokol TCP/IP memberikan dukungan jaringan untuk menghubungkan seluruh tempat dan host serta mengikuti aturan standar tentang bagaimana komputer-komputer berkomunikasi dan bagaimana jaringan-jaringan diinterkoneksikan.

Protocol TCP/IP mengikuti model konsep empat layer yang dikenal sebagai model Department of Defense (DOD), yaitu Application Layer, Transport Layer, Internet Layer, dan Network Interface Layer [3, 5]. Perbandingan konsep OSI dan konsep empat lapisan TCP/IP dapat dilihat pada Gambar 1.

Seminar Nasional Teknologi Informasi 2009 A8

41

Gambar 1. Perbandingan model konsep OSI dan TCP/IP [3]

2.2. Application Layer

Aplication Layer terletak di atas pada model TCP/IP konsep empat layer dan merupakan layer di mana program atau aplikasi memperoleh akses ke jaringan [3]. Layer ini kira-kira sesuai dengan Session Layer, Presentation Layer, dan Application Layer pada model OSI [7].

Beberapa layanan TCP/IP beroperasi pada Layer Application. Layanan tersebut meliputi HyperText Transfer Protocol (HTTP), File Transfer Protocol (FTP), Simple Mail Transfer Protocol (SMTP), Telnet, Domain Name System (DNS) dan Simple Network Management Protocol (SNMP) [6].

2.3. Network Application API

TCP/IP Microsoft menyediakan dua interface bagi aplikasi-aplikasi jaringan untuk memakai layanan-layanan stack protocol TCP/IP [1, 2, 4], yaitu:

• WinSock, merupakan implementasi pada aplikasi jaringan sangat banyak memakai Socket API (application programming interface). Socket API adalah mekanisme standar untuk mengakses layanan-layanan datagram dan session pada TCP/IP.

• NetBIOS, merupakan suatu API standar yang dipakai sebagai suatu mekanisme inter-process communication (IPC) di lingkungan Windows. Meskipun NetBIOS dapat dipakai untuk menyediakan koneksi standar ke protokol-protokol yang mendukung layanan-layanan penyampaian pesan dan penamaan NetBIOS, misalnya TCP/IP dan NetBEUI, namun NetBIOS disertakan di dalam Windows terutama sekali untuk mendukung aplikasi-aplikasi lama.

3. Perancangan Aplikasi

Aplikasi ini terdiri dari aplikasi pada komputer instruktur dan aplikasi pada komputer yang digunakan oleh mahasiswa, di mana terjadi pertukaran informasi tentang tampilan layar masing-masing. Pada paper ini

pembahasan hanya difokuskan pada pengembangan aplikasi di sisi klien/komputer mahasiswa. Blok diagram sistem diperlihatkan pada Gambar 2.

Gambar 2. Blok Diagram Sistem

Aplikasi ini merupakan aplikasi yang bertujuan untuk mengirimkan dan menerima pesan mengenai informasi tampilan layar, baik tampilan layar pada komputer instruktur maupun tampilan layar pada komputer mahasiswa. Batasan wilayah yang akan dikerjakan di sini adalah dalam satu jaringan lokal dengan jumlah komputer mahasiswa hingga 20 komputer mahasiswa.

Syarat utama yang harus dimiliki dalam pembuatan aplikasi ini adalah tersedianya beberapa komputer yang sudah terhubung dengan jaringan lokal. Interaksi antara aplikasi pada komputer instruktur dengan aplikasi pada komputer mahasiswa dibagi menjadi 3 kategori, yaitu broadcast, monitor dan lock.

Komunikasi antara aplikasi pada komputer instruktur dan aplikasi pada komputer mahasiswa dilakukan dengan protokol TCP/IP, di mana untuk pertukaran semua data menggunakan Hyper Text Transfer Protocol (HTTP). Komputer instruktur bertugas sebagai web server untuk menyediakan data yang diperlukan oleh aplikasi pada komputer mahasiswa untuk menampilkan tampilan layar komputer instruktur pada layar komputer mahasiswa.

Sedangkan aplikasi di komputer mahasiswa mengambil data pada komputer instruktur dengan metode GET. Ketika komputer instruktur memonitor semua komputer mahasiswa, maka aplikasi pada komputer mahasiswa mengaktifkan web server untuk menyediakan data-data yang dibutuhkan oleh aplikasi pada komputer instruktur untuk melakukan proses pengawasan terhadap tampilan komputer mahasiswa. Untuk melakukan semua interaksi atau proses yang diinginkan oleh instruktur, maka pada komputer instruktur disediakan sebuah file yang berisi perintah yang akan dilakukan oleh aplikasi pada komputer mahasiswa. Secara periodik aplikasi pada komputer mahasisswa mengakses file tersebut pada web server untuk mengetahui proses yang harus dilakukan.

Proses yang akan dilakukan dalam aplikasi ini dapat dilihat pada Gambar 3.

A8 Seminar Nasional Teknologi Informasi 2009

42

Gambar 3. Proses Kerja Sistem

Perencanaan sistem ini melingkupi 4 bagian besar yaitu membangun web server baik pada sisi mahasiswa maupun instruktur agar dapat digunakan untuk pertukaran data, proses pembacaan file kontrol yang terdapat pada sisi komputer instruktur, proses capture screen baik pada komputer instruktur maupun komputer mahasiswa, dan proses menampilkan tampilan layar baik untuk komputer instruktur maupun komputer mahasiswa.

3.1. Desain Aplikasi pada Komputer Mahasiswa

Aplikasi pada sisi mahasiswa kebanyakan bertugas sebagai web client untuk mengakses data yang diperlukan pada web server. Walaupun demikian, aplikasi di sisi mahasiswa juga bertugas sebagai web server ketika aplikasi di sisi instruktur dalam mode Monitor, di mana komputer mahasiswa menyediakan image file tampilan layarnya yang akan diminta oleh komputer instruktur.

Aplikasi di sisi mahasiswa diusahakan didesain sesederhana mungkin, di mana diusahakan pengguna tidak perlu berinteraksi secara langsung dengan aplikasi, melainkan hanya melihat proses yang dilakukan oleh aplikasi. Fungsi utama aplikasi ini adalah menampilkan layar komputer instruktur dalam layar penuh (fullscreen) ketika komputer instruktur sedang dalam kondisi broadcast.

Fungsi aplikasi di sisi mahasiswa sebagai web server dijalankan di belakang layar, sehingga pengguna tidak perlu mengetahui kegiatan yang sedang dilakukan oleh aplikasi ini. Karena aplikasi di sisi mahasiswa tidak dioperasikan secara langsung oleh pengguna, maka aplikasi ini dijalankan secara otomatis, berdasarkan file kontrol yang disediakan oleh komputer instruktur.

Ada dua tujuan utama aplikasi pada sisi mahasiswa, yaitu menampilkan tampilan layar komputer instruktur pada layarnya, dan menyediakan image file tampilan layar

komputer mahasiswa untuk pengawasan yang dilakukan oleh instruktur. Sama seperti aplikasi pada sisi instruktur, pada aplikasi yang ada di komputer mahasiswa dilakukan penyimpanan image file tampilan layar di direktori web server. Aplikasi di sisi mahasiswa hanya menyediakan satu file saja, yaitu image file tampilan layarnya, karena hanya file tersebut yang dibutuhkan oleh komputer instruktur untuk melakukan pengawasan. Proses kerja aplikasi dapat dilihat pada Gambar 4.

Gambar 4. Proses Kerja Sederhana dari Aplikasi di Sisi Mahasiswa

3.2. Desain Proses Menampilkan Layar Komputer Instruktur

Proses menampilkan tampilan layar komputer layar instruktur pada layar komputer mahasiswa dilakukan jika pada file kontrol terdapat perintah untuk menampilkan layar komputer instruktur. Ketika proses broadcast terjadi, aplikasi di sisi instruktur melakukan capture pada tampilan layarnya dan meletakkan pada direktori web server. Untuk memperoleh file tersebut dan menampilkannya, komputer mahasiswa melakukan request terhadap file itu melalui web server yang aktif pada komputer instruktur.

Desain awal proses menampilkan tampilan layar komputer instruktur dapat dilihat pada Gambar 5.

Seminar Nasional Teknologi Informasi 2009 A8

43

Gambar 5. Proses Menampilkan Layar Komputer Instruktur

Dari desain awal proses menampilkan layar komputer instruktur pada Gambar 5 maka untuk menampilkan tampilan layar komputer instruktur dilakukan langkah-langkah sebagai berikut:

• Pertama-tama melakukan pemeriksaan apakah web server yang berada pada komputer instruktur sedang aktif.

• Jika web server tersebut aktif, maka komputer mahasiswa melakukan request terhadap file kontrol yang ada pada web server dan membaca isinya.

• Jika isi file kontrol tersebut adalah proses broadcast sedang dilakukan oleh komputer instruktur, maka komputer mahasiswa akan meminta image file tampilan layar komputer instruktur.

• Image file tersebut kemudian ditampilkan pada layar komputer mahasiswa.

3.3. Desain Proses Komunikasi Web Server

Web server pada komputer mahasiswa digunakan ketika aplikasi di sisi instruktur dalam kondisi melakukan proses monitor atau pengawasan terhadap tampilan layar komputer mahasiswa. Web server pada komputer mahasiswa hanya digunakan untuk meletakkan sebuah file saja, yaitu image file dari tampilan layar komputer mahasiswa. Oleh karena itu, dalam mendesain web server pada komputer mahasiswa, jenis file yang dilayani oleh web server hanya yang bertipe image/jpg. Oleh karena itu, proses komunikasi yang terjadi pada web server pada sisi komputer mahasiswa hanya terjadi ketika aplikasi di sisi instruktur dalam proses monitor.

Proses komunikasi yang terjadi pada web server pada komputer mahasiswa adalah sebagai berikut:

• Pertama-tama aplikasi di sisi instruktur yang bertindak sebagai web client melakukan

pemeriksaan apakah web server pada komputer mahasiswa sedang berjalan. Jika web server sedang berjalan, maka akan dikirimkan HTTP respone.

• Web server memberikan respone terhadap setiap request yang menggunakan GET method. Dalam hal ini, web client hanya mengakses image file tampilan layar komputer mahasiswa.

• Tipe file yang didukung oleh web server adalah image/jpg.

Gambaran proses komunikasi web server dan web

client jika proses monitor sedang berlangsung dapat dilihat pada Gambar 6.

Gambar 6. Time Sequence Diagram Komunikasi Web Server dan Web

Client

3.4. Desain Proses Capture Layar Komputer Mahasiswa

Proses capture tampilan layar komputer mahasiswa tidak melibatkan web server. Web server hanya berperan dalam pertukaran image file dari hasil capture tampilan layar. Image hasil capture tampilan layar diletakkan pada direktori web server, tepatnya pada \webserver\clientScreen.jpg. Untuk memperoleh file tersebut, aplikasi di sisi instruktur tinggal melakukan request melalui web server yang ada pada komputer mahasiswa. Desain awal dari proses capture tampilan layar komputer mahasiswa dapat dilihat pada Gambar 7.

A8 Seminar Nasional Teknologi Informasi 2009

44

Gambar 7. Proses Capture Tampilan Layar Komputer Mahasiswa

Langkah-langkah untuk melakukan capture tampilan layar dilakukan sebagai berikut:

• Pertama-tama melakukan pemeriksaan apakah web server yang berada pada komputer instruktur sedang aktif.

• Jika web server tersebut aktif, maka komputer mahasiswa melakukan request terhadap file kontrol yang ada pada web server dan membaca isinya.

• Jika isi file kontrol tersebut menyatakan proses monitor sedang dilakukan oleh aplikasi di sisi instruktur, maka komputer mahasiswa akan melakukan capture terhadap tampilan layarnya kemudian menyimpannya pada direktori web server di komputer mahasiswa, tepatnya pada \webserver\clientScreen.jpg.

• Kemudian proses ini melakukan pembacaan file kontrol dari komputer instruktur lagi.

4. Pengujian

Pengujian aplikasi ini dilakukan dari satu komputer instruktur yang terhubung dengan 20 komputer mahasiswa melalui Local Area Network (LAN). Gambar konfigurasi jaringan dapat dilihat pada Gambar 8.

Gambar 8. Konfigurasi Jaringan untuk Pengujian

Pada pengujian, sistem komputer yang digunakan memiliki spesifikasi seperti diperlihatkan pada Tabel 1.

Tabel 1. Spesifikasi Komputer yang Digunakan dalam Pengujan

Spesifikasi Komputer Instruktur Komputer Klien

Processor Intel Core 2 Duo T5600 – 1.83 GHz

Intel Core 2 Duo E4400 – 2GHz

Memory 512 MBytes 1 GBytes Operating

System Windows XP Service

Pack 3 Windows XP Service

Pack 2

Untuk melakukan pengujian pada aplikasi di sisi mahasiswa, maka perlu dijalankan aplikasi terlebih dahulu. Tampilan aplikasi yang telah dijalankan dapat dilihat pada Gambar 9.

Gambar 9. Tampilan Aplikasi di Sisi Mahasiswa

4.1. Mengaktifkan Web Server

Ketika aplikasi di sisi mahasiswa dijalankan, secara otomatis web server diaktifkan. Waktu yang diperlukan untuk mengaktifkan web server dapat dilihat pada Tabel 2.

Tabel 2. Waktu untuk Mengaktifkan Web Server

Seminar Nasional Teknologi Informasi 2009 A8

45

Percobaan Waktu (detik)

1 0.32

2 0.16

3 0.15

4 0.16

5 0.16

6 0.15

7 0.15

8 0.16

9 0.15

10 0.16

Rata-rata 0.17

Dari Tabel 2 diperoleh waktu rata-rata untuk mengaktifkan web server adalah 0.17 detik.

4.2. Pemeriksaan Status Komputer Instruktur

Ketika aplikasi di sisi mahasiswa sudah dijalankan, secara otomatis akan melakukan pemeriksaan terhadap status komputer instruktur. Waktu yang diperlukan untuk mengetahui status komputer instruktur dapat dilihat pada Tabel 3.

Tabel 3. Waktu untuk Mengetahui Status Komputer Instruktur

Percobaan Waktu (detik)

1 0.145

2 0.154

3 0.125

4 0.183

5 0.125

6 0.134

7 0.142

8 0.105

9 0.140

10 0.149

Rata-rata 0.14

Dari Tabel 3, dapat dilihat bahwa tidak diperlukan waktu yang cukup lama untuk mengetahui status web server.

4.3. Capture Layar dan Penyimpanan File

Jika proses Monitor sedang berlangsung, maka komputer mahasiswa akan melakukan capture terhadap tampilan layar dan menyimpannya menjadi image file. Waktu yang dibutuhkan untuk capture tampilan layar dan menyimpannya dapat dilihat pada Tabel 4.

Tabel 4. Waktu untuk Melakukan Capture Layar dan Menyimpannya

Percobaan Waktu (detik)

1 0.94

2 0.94

3 0.94

4 0.94

5 0.94

6 0.94

7 0.94

8 0.94

9 0.94

10 0.94

Rata-rata 0.94 Dari Tabel 4 dapat dilihat bahwa waktu rata-rata yang diperlukan untuk melakukan capture tampilan layar dan menyimpannya dalam bentuk file adalah 0.94 detik.

Sedangkan ukuran file hasil capture dapat dilihat pada Tabel 5. Pembagian kategori untuk kondisi layar adalah layar dengan dominan warna putih dan layar dengan banyak komposisi warna.

Tabel 5. Besar Ukuran File Capture

Percobaan Layar putih Layar berwarna

1 37.5 KB 102.7 KB

2 40.4 KB 103 KB

3 40.7 KB 97 KB

4 40.4 KB 97 KB

5 40.3 KB 97.3 KB

6 40.5 KB 104 KB

7 40.3 KB 103 KB

8 40.5 KB 97 KB

9 40.3 KB 97 KB

10 40.5 KB 97 KB

Rata-rata 40.14 KB 99.5 KB

4.4. Mengakses Image File pada Komputer Instruktur

Ketika terjadi proses Broadcast oleh komputer instruktur, maka komputer mahasiswa mengakses file tampilan layar komputer instruktur. Waktu yang diperlukan untuk mengakses tampilan layar komputer instruktur dapat dilihat pada tabel 4.16.

Tabel 6. Waktu untuk Mengakses Image File pada Komputer Instruktur

Percobaan Waktu (detik)

A8 Seminar Nasional Teknologi Informasi 2009

46

Percobaan Waktu (detik)

1 0.47

2 0.47

3 0.47

4 0.47

5 0.47

6 0.47

7 0.47

8 0.47

9 0.47

10 0.47

Rata-rata 0.47 Dari Tabel 6 dapat dilihat bahwa waktu rata-rata yang dibutuhkan untuk mengakses file tampilan layar komputer instruktur oleh komputer mahasiswa adalah 0.47 detik.

5. Kesimpulan

1. Hasil pengujian memperlihatkan aplikasi pada sisi komputer mahasiswa mampu bekerja dengan baik. Materi pada layar instruktur dapat ditampilkan tanpa kendala yang berarti.

2. Rata-rata besar ukuran file capture untuk layar dengan dominan warna putih dan warna dengan banyak kompisisi warna masing-masing adalah 40.14 KB dan 99.5 KB

3. Waktu yang dibutuhkan untuk mengakses tampilan layar instruktur oleh mahasiswa adalah 0.47 detik.

REFERENSI [1] Jones, Anthony, and Amol Deshpande. Windows Sockets

2.0: Write Scalable Winsock Apps Using Completion Ports. 7 November, 2008. <http://msdn.microsoft.com/en-us/magazine/cc302334.aspx>

[2] Makofske, David B., Michael J. Donahoo, and Kenneth L. Calvert. TCP/IP Sockets in C# : Practical Guide for Programmers. San Fransisco: Elsevier, 2004.

[3] Microsoft Corporation. Introduction to TCP/IP. 7 November 2008. <http://msdn.microsoft.com/en-us/library/ms810606.aspx>

[4] Microsoft Corporation. Overview of the Windows API. 7 November 2008. <http://msdn.microsoft.com/en-us/library/aa383723(VS.85).aspx>

[5] Reid, Fiach, Network Programming in .NET, Oxford: Elsevier Digital Press, 2004.

[6] Wikipedia, Application Layer, http://en.wikipedia.org/ wiki/Application_Layer, accessed date : 2 September 2009

[7] Wikipedia, Internet Protocol Suite, http://en.wikipedia. org/wiki/TCP/IP, accessed date : 2 September 2009