Hasil Design Phase

4.3 Hasil Design Phase

Pada tahapan ini akan dijelaskan tentang perancangan desain antarmuka dan database yang merupakan satu kesatuan yang sangat penting. Database berfungsi sebagai tempat penyimpanan data (data storage) untuk diolah sebagai sumber informasi yang diperlukan oleh sistem. Sedangkan tampilan antarmuka digunakan untuk mempermudah dan mempercantik halaman yang akan digunakan.

4.3.1 Desain Basis Data

Berikut adalah rancangan tabel yang akan digunakan untuk menyimpan data dalam pembuatan sistem yang akan penulis bangun, nama database kehati dengan

10 tabel.

Tabel 4.21 Rancangan tabel pada database kehati No Nama Tabel Deskripsi

1 user master

2 famili master

3 spesies master

1. Tabel famili DBMS yang digunakan

: MySQL

Nama Basisdata

: kehati

Nama Tabel

: famili

Fields Kunci

: fam_id

Indeks Primer

: fam_id

Indeks Sekunder

Metode Pengurutan Data : asc Tipe Tabel

: master

Tabel 4.22 Rancangan tabel famili

No Nama Fields

Ukuran Deskripsi 1 fam_id

Tipe

4 No ID famili 2 fam_name

Nama famili

2. Tabel species DBMS yang digunakan

: MySQL

Nama Basisdata

: kehati

Nama Tabel

: spesies

Fields Kunci

: spec_id

Indeks Primer

: spec_id

Indeks Sekunder

Metode Pengurutan Data : asc Tipe Tabel

: master

Tabel 4.23 Rancangan tabel spesies

No Nama Fields

Deskripsi 1 spec_id

Tipe

Ukuran

10 No ID user 2 spec_name

varchar

82 Nama spesies 3 fam_id

varchar

7 No ID famili 4 spec_native_name

varchar

Nama lokal spesies 5 spec_info

varchar

Info spesies 6 spec_photo

Foto spesies

3. Tabel plants DBMS yang digunakan

: MySQL

Nama Basisdata

: kehati

Nama Tabel

: tumbuhan

Fields Kunci

: plant_id

Indeks Primer

: plant_id

Indeks Sekunder

Metode Pengurutan Data : asc Tipe Tabel

: transaksi

Tabel 4.24 Rancangan tabel plants

No Nama Fields

Deskripsi 1 plant_id

Tipe

Ukuran

6 No ID tumbuhan 2 plant_code

smallint

8 Kode tumbuhan 3 spec_id

varchar

10 No ID spesies 4 fam_id

varchar

2 No ID famili 5 plant_habit

varchar

13 Kode habitat 6 plant_status

varchar

32 Status tumbuhan 7 plant_ele

varchar

Lokasi ketinggian 8 plant_time

decimal

20 Lokasi dalam waktu 9 plant_lat

varchar

40 Lokasi latitude 10 plant_long

varchar

40 Lokasi longitude 11 plant_fid

varchar

4 Fid tumbuhan 12 plant_area

tinyint

4 Area tumbuhan 13 plant_zone

tinyint

4 Zona lokasi 14 block_id

varchar

2 Blok lokasi 15 veg_id

varchar

varchar

2 Type vegetasi

4. Tabel user DBMS yang digunakan

: MySQL

Nama Basisdata

: kehati

Nama Tabel

: user

Fields Kunci

: user_id

Indeks Primer

: user_id

Indeks Sekunder

Metode Pengurutan Data : asc

Tipe Tabel

: master

Tabel 4.25 Rancangan tabel user

No Nama Fields

Deskripsi 1 user_id

Tipe

Ukuran

10 No ID user 2 user_pswd

varchar

Sandi user 3 user_name

Nama user

5. Tabel glosarium DBMS yang digunakan

: MySQL

Nama Basisdata

: kehati

Nama Tabel

: glosarium

Fields Kunci

: glo_id

Indeks Primer

: glo_id

Indeks Sekunder

Metode Pengurutan Data : asc Tipe Tabel

: master

Tabel 4.26 Rancangan tabel glosarium

No Nama Fields

Deskripsi 1 glo_id

Tipe

Ukuran

2 No ID istilah 2 glo_judul

int

Nama istilah 3 glo_artikel

text

text

Artikel penjelasan

6. Tabel kordinat DBMS yang digunakan

: MySQL

Nama Basisdata

: kehati

Nama Tabel

: kordinat

Fields Kunci

: id

Indeks Primer

: id

Indeks Sekunder

: node

Metode Pengurutan Data : asc Tipe Tabel

: master

Tabel 4.27 Rancangan tabel kordinat

No Nama Fields

Deskripsi 1 id

Tipe

Ukuran

11 Id lokasi 2 node

int

30 Kode lokasi 3 Latitude

varchar

30 Kordinat latitude 4 Longitude

varchar

varchar

30 Kordinat longitude

7. Tabel relasi DBMS yang digunakan

: MySQL

Nama Basisdata

: kehati

Nama Tabel

: relasi

Fields Kunci

: rel_id

Indeks Primer

: rel_id

Indeks Sekunder

Metode Pengurutan Data : asc Tipe Tabel

: transaksi

Tabel 4.28 Rancangan tabel relasi

No Nama Fields

Deskripsi 1 Rel_id

Tipe

Ukuran

4 No ID relasi 2 node

int

4 Kode lokasi 3 next

varchar

varchar

4 Kode lokasi yang terhubung

8. Tabel block DBMS yang digunakan

: MySQL

Nama Basisdata

: kehati

Nama Tabel

: blok

Fields Kunci

: block_id

Indeks Primer

: block_id

Indeks Sekunder

Metode Pengurutan Data : asc Tipe Tabel

: master

Tabel 4.29 Rancangan tabel block

No Nama Fields

Ukuran Deskripsi 1 block_id

Tipe

4 No ID blok 2 block_loc

tinyint

11 Kode blok 3 block_name

varchar

varchar

20 Nama blok

9. Tabel vegetasi DBMS yang digunakan

: MySQL

Nama Basisdata

: kehati

Nama Tabel

: vegetasi

Fields Kunci

: veg_id

Indeks Primer

: veg_id

Indeks Sekunder

Metode Pengurutan Data : asc Tipe Tabel

: master

Tabel 4.30 Rancangan tabel vegetasi

No Nama Fields

Ukuran Deskripsi 1 veg_id

Tipe

4 No ID blok 2 veg_name

int

varchar

40 Kode blok

10. Tabel legend DBMS yang digunakan

: MySQL

Nama Basisdata

: kehati

Nama Tabel

: legenda

Fields Kunci

: id

Indeks Primer

: id

Indeks Sekunder

Metode Pengurutan Data : asc Tipe Tabel

: master

Tabel 4.31 Rancangan tabel legend

No Nama Fields

Ukuran Deskripsi 1 id

14 Lattitude 3 lon

varchar

14 Longitude 4 teks

Nama user

4.3.1.1 Normalisasi

Tabel-tabel yang telah penulis rancang kemudian di normalisasi. Tabel- tabel yang akan di normalisasi adalah sebagai berikut:

Bentuk tidak normal: {fam_id*, fam_name, spec_id*, spec_name, fam_id, fam_name, spec_native, spec_info,

spec_photo, plant_id*, plant_code, spec_id, spec_name, fam_id, fam_name, plant_habit, plant_status, plant_ele, plant_time, plant_lat, plant_long, plant_fid, plant_area, plant_zone, block_id, block_name, veg_id, veg_name, user_id*, user_pswd, user_name, glo_id*, glo_judul, glo_artikel, id*, node, latitude, longitude, rel_id*, node, next, block_id*, Bl_kode, Bl_name, veg_id*, veg_name, id*, lat, lon, teks}

Bentuk normalisasi pertama: Familia

= { fam_id*, fam_name} Spesies

= { spec_id*, spec_name, fam_id, fam_name, spec_native, spec_info, spec_photo} Plant = { plant_id*, plant_code, spec_id, spec_name, fam_id, fam_name, plant_habit, plant_status, plant_ele, plant_time, plant_lat, plant_long, plant_fid, plant_area, plant_zone, block_id, block_name, veg_id, veg_name } User = { user_id*, user_pswd, user_name}

Glosarium = { glo_id*, glo_judul, glo_artikel} Kordinat

= { id*, node, latitude, longitude } Relasi

= { rel_id*, node, next } Blok

= { block_id*, block_kode, block_name } Vegetasi

= { veg_id*, veg_name } Legend

= { id*, lat, lon, teks }

Bentuk normalisasi kedua: Famili

= { fam_id*, fam_name} Spesies

= { spec_id*, spec_name, fam_id**, spec_native, spec_info, spec_photo}

Tumbuhan = { plant_id*, plant_code, spec_id**, fam_id**, plant_habit, plant_status, plant_ele, plant_time, plant_lat, plant_long, plant_fid, plant_area, plant_zone, block_id**, veg_id** }

User = { user_id*, user_pswd, user_name} Glosarium

= { glo_id*, glo_judul, glo_artikel} Kordinat

= { id*, node, latitude, longitude } Relasi

= { rel_id*, node, next } Blok

= { block_id*, block_kode, block_name } Vegetasi

= { veg_id*, veg_name } Legend

= { id*, lat, lon, teks } Keterangan :

* = Kunci Primer (Primary Key) **

= Kunci Tamu (Foreign Key)

4.3.1.2 Relasi Antar Tabel

Relasi antar tabel merupakan hubungan antar tabel yang merepresentasikan hubungan antar objek di dunia nyata dan berfungsi untuk mengatur operasi suatu database

Gambar 4.34 Relasi antar tabel

4.3.2 Desain Proses

Pada gambar 4.35 Berikut ini adalah rancangan desain proses berupa flowchart yang menggambarkan sistem :

Gambar 4.35 Rancangan desain proses

4.3.3 Desain Antar Muka

Desain antar muka dibuat sebagai acuan atau purwarupa bagi pembuat program maupun sebagai gambaran tampilan sistem untuk pengguna. Berikut ini adalah rancangan antarmuka sistem:

4.3.3.1 Desain Antar Muka (Input)

1. Desain antar muka Login

Username

Password

Gambar 4.36 Desain antarmuka Login

2. Desain antar muka pencarian Pencarian tumbuhan:

Cari rute V

Gambar 4.37 Desain antarmuka Pencarian

3. Desain antar muka famili baru

ID Familia Save Clear

Gambar 4.38 Desain antarmuka Pencarian

4. Desain antar muka spesies baru

ID Species

Familia

Species Native Name

Speciemen Photo

Gambar 4.39 Desain antarmuka spesies baru

5. Desain antar muka tumbuhan baru

Gambar 4.40 Desain antarmuka Tumbuhan baru

4.3.3.2 Desain Antar Muka (Output)

1. Desain antar muka peta kawasan

Gambar 4.41 Desain antarmuka peta kawasan

Plant Code Species

Familia Habitus Status

Elevation

Save

Time Latitude

Longitude FID_ppk_kj Area Zona

Block Vegetasi

Menu 1 | Menu 2 | | Menu 3 | Menu 4 | Menu 5 | Menu 6 | Menu 7

Pencarian

PETA KAWASAN

Clear

2. Desain antar muka famili

Lihat Familia

No ID FAMILIA COUNT

Gambar 4.42 Desain antarmuka famili

3. Desain antar muka spesies

Lihat Spesies

No ID SPECIES NATIVE FAMILIA COUNT

Gambar 4.43 Desain antarmuka spesies

4. Desain antar muka detail spesies

Detail Spesies

Species

Famili Photo

Native Name Information

Gambar 4.44 Desain antarmuka detail spesies

5. Desain antar muka glosarium

Judul

Artikel

Gambar 4.45 Desain antarmuka glossarium

6. Desain antar muka pengelolaan famili

Pengelolaan Familia

No ID FAMILIA OPTION

Gambar 4.46 Desain antarmuka pengelolaan famili

7. Desain antar muka pengelolaan spesies

Penglolaan Spesies

No ID SPECIES VATIVE FAMILIA OPTION

Gambar 4.47 Desain antarmuka pengelolaan spesies

8. Desain antar muka pengelolaan tumbuhan

Penglolaan Spesies Plant

No Species Familia Status Zona Blok Vegetasi Cordinate ID Option

Gambar 4.48 Desain antarmuka pengelolaan tumbuhan