Desain tampilan antar muka

37

2. Identifikasi fungsional

Sistem informasi ini merupakan sebuah aplikasi yang memudahkan penggunanya dalam melakukan pencarian data dan informasi mengenai penelitian produk pangan, sehingga dapat menjembatani penerimaan informasi secara mudah dan cepat berkaitan dengan informasi judul penelitian, peneliti, lembaga, bahan baku, teknologi, produk, kelompok peta penelitian, kesiapan industrialisasi, dan status paten.

C. DESAIN SISTEM

1. Desain tampilan antar muka

Desain sistem informasi sangat menentukan kualitas. Berdasarkan kebutuhan informasi dari calon pengguna, desain antarmuka dirancang untuk menghasilkan tampilan yang menarik. Perangkat warna berbeda diberikan untuk menunjukkan menu pasif dan menu aktif. Tata letak rancangan diatur agar halaman terlihat simetri. Layout dan animasi dirancang menggunakan Macromedia Flash MX 2004 dan Swift 3D. Software lain yang juga digunakan yaitu teks editor seperti notepad untuk menyimpan data teks yang menjadi input bagi software utama yaitu Macromedia Flash MX 2004. Beberapa hal yang menjadi dasar dalam pembuatan animasi pada software Macromedia Flash MX 2004 adalah frame, layer, symbol, dan obyek. Frame merupakan kerangka-kerangka kerja sistem yang berisikan obyek-obyek. Penempatan akan obyek-obyek yang ada pada sistem diatur dalam pengaturan layer. Symbol merupakan bentuk obyek yang memiliki kelebihan-kelebihan khusus. Terdapat 3 jenis symbol, yaitu movie clip, button, dan graphic. Obyek merupakan data yang kita masukkan ke dalam sistem. Obyek yang digunakan pada sistem informasi ini terdiri dari suara dengan ekstensi MP3, gambar dengan ekstensi GIF dan JPEG, serta teks yang dimasukkan dengan text tool. Terdapat 3 jenis teks yang dihasilkan text tool, yaitu static text untuk teks yang bersifat statis, dynamic text untuk teks yang dapat berubah jika terjadi kondisi-kondisi tertentu, dan 38 input text untuk teks yang dapat diisi dengan data yang bersifat simulasi dan memiliki pengaruh terhadap data apa yang dimasukkan kedalam input text tersebut. Kemampuan software ini dalam memasukkan data berupa obyek tidak hanya sekedar berkas-berkas yang berekstensi diatas, namun juga dapat memasukkan obyek berekstensi lainnya, terutama obyek yang dibuat pada satu perusahaan yang sama yaitu Macromedia Inc. Sistem ini terdiri dari 7 berkas, SIRMAPP yang berekstensi EXE, mcOpening yang berekstensi SWF, mcAwal yang berekstensi SWF, mcBahanmcNamamcTeknologimcProduk yang berekstensi SWF, mp3 player yang berekstensi SWF, slide show yang berekstensi SWF, serta welcome yang berekstensi SWF. Tampilan ketika berkas SIRMAPP dijalankan dapat dilihat pada Gambar 3. Gambar 3. Tampilan ketika berkas SIRMAPP dijalankan. Frame dibuat untuk memudahkan pengguna dalam menggunakan sistem. Pembuatan halaman utama pada sistem informasi menggunakan dua frame, frame atas dan frame bawah. Frame atas terdiri dari dua bagian, yaitu gambar header dan menu navigasi. Sedangkan frame bawah terdiri dari halaman content isi. Hanya frame bawah yang mengalami perubahan tampilan jika terjadi pergantian halaman. Frame halaman utama dapat dilihat pada Gambar 4. 39 Gambar 4. Frame halaman utama. Sistem ini bertujuan untuk mempermudah pengguna dalam mencari data yang dibutuhkan. Untuk itu data dibagi menjadi empat menu utama, yaitu nama peneliti, produk, teknologi, dan bahan baku. a. Menu nama peneliti Menu nama peneliti berisi data abstrak beserta keterangannya yang disusun berdasarkan nama penelitinya. Susunan tersebut kemudian dikelompokkan sesuai dengan huruf alphabet awal sehingga menjadi sub menu. Terdapat 26 sub menu yang disusun secara alfabetik yaitu sub menu a sampai sub menu z. Pengguna dapat langsung mengklik teks menu yang sudah di-link ke 26 sub menu yang berupa huruf a sampai z. Untuk memunculkan data, pengguna dapat mengklik salah satu dari 26 huruf alphabet tersebut. Tampilan menu nama peneliti dapat dilihat pada Gambar 5. Gambar 5. Tampilan menu nama peneliti. Gambar header Menu navigasi halaman content 40 b. Menu produk Menu produk berisi data abstrak beserta keterangannya yang disusun berdasarkan produk. Susunan tersebut kemudian dikelompokkan sesuai dengan huruf alphabet awal sehingga menjadi sub menu. Terdapat 26 sub menu yang disusun secara alfabetik yaitu sub menu a sampai sub menu z. Pengguna dapat langsung mengklik teks menu yang sudah di-link ke 26 sub menu yang berupa huruf a sampai z. Untuk memunculkan data, pengguna dapat mengklik salah satu dari ke-26 huruf alphabet tersebut. Tampilan menu produk dapat dilihat pada Gambar 6. Gambar 6. Tampilan menu produk. c. Menu teknologi Menu teknologi berisi data abstrak beserta keterangannya yang disusun berdasarkan teknologi. Susunan tersebut kemudian dikelompokkan sesuai dengan huruf alphabet awal sehingga menjadi sub menu. Terdapat 26 sub menu yang disusun secara alfabetik yaitu sub menu a sampai sub menu z. Pengguna dapat langsung mengklik teks menu yang sudah di-link ke 26 sub menu yang berupa huruf a sampai z. Untuk memunculkan data, pengguna dapat mengklik salah satu dari 26 huruf alphabet tersebut. Tampilan menu teknologi dapat dilihat pada Gambar 7. 41 Gambar 7. Tampilan menu teknologi. d. Menu bahan baku Menu bahan baku berisi data abstrak beserta keterangannya yang disusun berdasarkan bahan baku. Susunan tersebut kemudian dikelompokkan sesuai dengan huruf alphabet awal sehingga menjadi sub menu. Terdapat 26 sub menu yaitu sub menu a sampai sub menu z. Pengguna dapat langsung mengklik teks menu yang sudah di-link ke 26 sub menu yang berupa huruf a sampai z. Untuk memunculkan data, pengguna dapat mengklik salah satu dari 26 huruf alphabet tersebut. Tampilan menu bahan baku dapat dilihat pada Gambar 8. Gambar 8. Tampilan menu bahan baku. 42

2. Desain Basis Data