• Tidak ada hasil yang ditemukan

Perancangan Form

BAB 3 PEMBAHASAN

3.3 Perancangan Data

3.3.3 Perancangan Arsitektur Perangkat Lunak

3.3.3.2 Perancangan Antarmuka

3.3.3.2.1 Perancangan Form

Perancangan form meliputi form-form yang terdapat dalam web profile CV.Pramega Hanitama yakni sebagai berikut

1. Perancangan Antarmuka Admin

Perancangan antarmuka admin terdiri dari perancangan antarmuka untuk halaman login, halaman utama (home), halaman profile dengan view, hapus dan edit, halaman product dengan view, hapus dan edit, halaman service dengan view, hapus dan edit, halaman experience dengan view, hapus dan edit dan halaman admin dengan view, hapus dan edit.

1. Perancangan Menu Login

Perancangan menu login dibuat untuk admin agar dapat mengakses aplikasi yang dibuat dan melakukan pengolahan data yang dapat dilihat dari gambar 3.12.

Klik Tombol Login, Jika akun ada akan masuk ke T02, jika tidak akan muncul

Ukuran 1024 x 768

warna sesuai dengan setting windows Warna tema orange – merah marun font 12 Arial Login Username Password T01 CV. PRAMEGA HANITAMA

ENGINEERING, IT CONSULTING, TRADING

LOGIN USER

Logo

2. Perancangan Menu Utama

Perancangan menu utama dibuat untuk menampilkan halaman setelah login berhasil yang dapat dilihat dari gambar 3.13

Data Profile

- Klik Home untuk ke T02 - Klik Data Profile untuk ke T03A

- Klik Data Product untuk ke T04A

- Klik Data Service untuk ke T05A

- Klik Data Experience untuk ke T06A

- klik Data Admin untuk ke T07A

- Klik Logout untuk ke T01

Ukuran 1024 x 768

warna sesuai dengan setting windows Warna tema orange – merah marun font 12 Arial

Logout Profile CV Product/Service Experience Admin Logout Home

T02

CV. PRAMEGA HANITAMA

ENGINEERING, IT CONSULTING, TRADING

Logo

Data Service Data Admin

Data Product Data Experience

Gambar 3.13 Perancangan Menu Utama

3. Perancangan Tampil Data Profile

Perancangan menu tampil data profile menampilkan data profile CV. Pramega Hanitama yang dapat dilihat dari gambar 3.14

- Klik Home untuk ke T02 - Klik Data Profile untuk ke T03A

- Klik Data Product untuk ke T04A

- Klik Data Service untuk ke T05A

- Klik Data Experience untuk ke T06A

- klik Data Admin untuk ke T07A

- Klik Logout untuk ke T01 - Klik Add Profile untuk ke T03B

Add Profile

Profile CV Product/Service Experience Admin Logout Home

T03A

CV. PRAMEGA HANITAMA

ENGINEERING, IT CONSULTING, TRADING

Logo

List Profile

Ukuran 1024 x 768

warna sesuai dengan setting windows Warna tema orange – merah marun font 12 Arial

4. Perancangan Tampil Data Product

Perancangan menu tampil data product menampilkan data product

yang ditawarkan CV. Pramega Hanitama yang dapat dilihat dari gambar 3.15

- Klik Home untuk ke T02 - Klik Data Profile untuk ke T03A

- Klik Data Product untuk ke T04A

- Klik Data Service untuk ke T05A

- Klik Data Experience untuk ke T06A

- klik Data Admin untuk ke T07A

- Klik Logout untuk ke T01 - Klik Add Product untuk ke T04B

Add Product

Profile CV Product/Service Experience Admin Logout Home

T04A

CV. PRAMEGA HANITAMA

ENGINEERING, IT CONSULTING, TRADING

Logo

List Product

Ukuran 1024 x 768

warna sesuai dengan setting windows Warna tema orange – merah marun font 12 Arial

Gambar 3.15 Perancangan Tampil Data Product

5. Perancangan Tampil Data Service

Perancangan menu tampil data service menampilkan data service yang ditawarkan CV. Pramega Hanitama yang dapat dilihat dari gambar 3.16

- Klik Home untuk ke T02 - Klik Data Profile untuk ke T03A

- Klik Data Product untuk ke T04A

- Klik Data Service untuk ke T05A

- Klik Data Experience untuk ke T06A

- klik Data Admin untuk ke T07A

- Klik Logout untuk ke T01 - Klik Add Service untuk ke T05B

Add Service

Profile CV Product/Service Experience Admin Logout Home

T05A

CV. PRAMEGA HANITAMA

ENGINEERING, IT CONSULTING, TRADING

Logo

List Service

Ukuran 1024 x 768

warna sesuai dengan setting windows Warna tema orange – merah marun font 12 Arial

6. Perancangan Tampil Data Experience

Perancangan menu tampil data experience menampilkan data

experience yang telah dikerjakan oleh CV. Pramega Hanitama yang dapat dilihat dari gambar 3.17

- Klik Home untuk ke T02 - Klik Data Profile untuk ke T03A

- Klik Data Product untuk ke T04A

- Klik Data Service untuk ke T05A

- Klik Data Experience untuk ke T06A

- klik Data Admin untuk ke T07A

- Klik Logout untuk ke T01 - Klik Add Experience untuk ke T06B

Add Experience

Profile CV Product/Service Experience Admin Logout Home

T06A

CV. PRAMEGA HANITAMA

ENGINEERING, IT CONSULTING, TRADING

Logo

List Experience

Ukuran 1024 x 768

warna sesuai dengan setting windows Warna tema orange – merah marun font 12 Arial

Gambar 3.17 Perancangan Tampil Data Experience

7. Perancangan Tampil Data Admin

Perancangan menu tampil data admin menampilkan data admin yang mengelola CV. Pramega Hanitama yang dapat dilihat dari gambar 3.18

- Klik Home untuk ke T02 - Klik Data Profile untuk ke T03A

- Klik Data Product untuk ke T04A

- Klik Data Service untuk ke T05A

- Klik Data Experience untuk ke T06A

- klik Data Admin untuk ke T07A

- Klik Logout untuk ke T01

Profile CV Product/Service Experience Admin Logout Home

T07A

CV. PRAMEGA HANITAMA

ENGINEERING, IT CONSULTING, TRADING

Logo

Daftar Admin

Ukuran 1024 x 768

warna sesuai dengan setting windows Warna tema orange – merah marun font 12 Arial

8. Perancangan Tambah Data Profile

Perancangan menu tambah data profile dibuat untuk menambahkan data profile CV. Pramega Hanitama yang dapat dilihat dari gambar 3.19

- Klik Home untuk ke T02 - Klik Data Profile untuk ke T03A

- Klik Data Product untuk ke T04A

- Klik Data Service untuk ke T05A

- Klik Data Experience untuk ke T06A

- klik Data Admin untuk ke T07A

- Klik Logout untuk ke T01 - Klik Browse untuk mencari Gambar/bagan - Klik Save untuk menyimpan data dan kembali ke T03A - Klik Cancel untuk membatalkan dan kembali ke T03A Save Cancel Browse Nama Profile Deskripsi File Gambar

Profile CV Product/Service Experience Admin Logout Home

T03B

CV. PRAMEGA HANITAMA

ENGINEERING, IT CONSULTING, TRADING

Logo

Tambah Profile

Ukuran 1024 x 768

warna sesuai dengan setting windows Warna tema orange – merah marun font 12 Arial

Gambar 3.19 Perancangan Tambah Data Profile

9. Perancangan Tambah Data Product

Perancangan menu tambah data product dibuat untuk menambahkan data product yang ditawarkan CV. Pramega Hanitama yang dapat dilihat dari gambar 3.20

- Klik Home untuk ke T02 - Klik Data Profile untuk ke T03A

- Klik Data Product untuk ke T04A

- Klik Data Service untuk ke T05A

- Klik Data Experience untuk ke T06A

- klik Data Admin untuk ke T07A

- Klik Logout untuk ke T01 - Klik Save untuk menyimpan data dan kembali ke T04A - Klik Cancel untuk membatalkan dan kembali ke T04A

Profile CV Product/Service Experience Admin Logout Home

T04B

CV. PRAMEGA HANITAMA

ENGINEERING, IT CONSULTING, TRADING

Logo Tambah Product Save Cancel Nama Product Deskripsi Pelayanan Ukuran 1024 x 768

warna sesuai dengan setting windows Warna tema orange – merah marun font 12 Arial

10.Perancangan Tambah Data Service

Perancangan menu tambah data service dibuat untuk menambahkan data service yang ditawarkan CV. Pramega Hanitama yang dapat dilihat dari gambar 3.21

- Klik Home untuk ke T02 - Klik Data Profile untuk ke T03A

- Klik Data Product untuk ke T04A

- Klik Data Service untuk ke T05A

- Klik Data Experience untuk ke T06A

- klik Data Admin untuk ke T07A

- Klik Logout untuk ke T01 - Klik Save untuk menyimpan data dan kembali ke T05A - Klik Cancel untuk membatalkan dan kembali ke T05A

Profile CV Product/Service Experience Admin Logout Home

T05B

CV. PRAMEGA HANITAMA

ENGINEERING, IT CONSULTING, TRADING

Logo

Tambah Service

Ukuran 1024 x 768

warna sesuai dengan setting windows Warna tema orange – merah marun font 12 Arial

Save Cancel

Nama Service Macam Service

Gambar 3.21 Perancangan Tambah Data Service

11.Perancangan Tambah Data Experience

Perancangan menu tambah data experience dibuat untuk menambahkan data experience yang pernah dikerjakan oleh CV. Pramega Hanitama yang dapat dilihat dari gambar 3.22

- Klik Home untuk ke T02 - Klik Data Profile untuk ke T03A

- Klik Data Product untuk ke T04A

- Klik Data Service untuk ke T05A

- Klik Data Experience untuk ke T06A

- klik Data Admin untuk ke T07A

- Klik Logout untuk ke T01 - Klik Save untuk menyimpan data dan kembali ke T06A - Klik Cancel untuk membatalkan dan kembali ke T06A Paket Pekerjaan No Kontrak Lokasi Nilai Kontrak Tgl Selesai *) YYYY-MM-DD Profile CV Product/Service Experience Admin Logout Home

T06B

CV. PRAMEGA HANITAMA

ENGINEERING, IT CONSULTING, TRADING Logo

Tambah Experience

Ukuran 1024 x 768

warna sesuai dengan setting windows Warna tema orange – merah marun font 12 Arial

Save Cancel Pengguna Jasa

Alamat Telepon

Dokumen terkait