Transcript
Page 1: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Team project ©2017 Dony Pratidana S. Hum | Bima Agus Setyawan S. IIP 

 

 

 

 

 

Hak cipta dan penggunaan kembali:

Lisensi ini mengizinkan setiap orang untuk menggubah, memperbaiki, dan membuat ciptaan turunan bukan untuk kepentingan komersial, selama anda mencantumkan nama penulis dan melisensikan ciptaan turunan dengan syarat yang serupa dengan ciptaan asli.

Copyright and reuse:

This license lets you remix, tweak, and build upon work non-commercially, as long as you credit the origin creator and license it on your new creations under the identical terms.

Page 2: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

BAB III

METODOLOGI PENELITIAN DAN PERANCANGAN SISTEM

3.1 Metodologi Penelitian

Langkah-langkah yang dilakukan dalam pembangunan sistem rekomendasi

ini dapat dijelaskan sebagai berikut.

1. Studi Literatur

Studi literatur dilakukan dengan cara mencari informasi dari buku, jurnal,

ataupun sumber internet. Studi literatur dilakukan untuk memperdalam wawasan

dan pengetahuan mengenai materi topik secara valid, serta untuk mendapatkan

gambaran mengenai topik yang diambil.

Dalam studi literatur dipelajari beberapa hal, antara lain mengenai sistem

rekomendasi, simple additive weighting, profile matching, dan memahami keadaan

Kompas Gramedia sehubungan dengan implementasi sistem rekomendasi.

2. Pengumpulan Data

Data yang dibutuhkan dalam pembangunan sistem ini adalah data pelamar

kerja di Kompas Gramedia dan kebutuhan recruiter yang ada di Kompas Gramedia.

Pengumpulan data ini dilakukan dengan cara diskusi dengan recruiter yang

bergerak di bidang talent management Kompas Gramedia. Data yang dikumpulkan

tersebut digunakan untuk proses pembangunan sistem dan pengujian.

3. Analisis Model Sistem

Pada tahap ini, dilakukan penentuan atribut-atribut pembobotan yang

digunakan dalam sistem ini. Dalam penentuan atribut tersebut, diperlukan

konsultasi dengan staff dari Kompas Gramedia. Selanjutnya, dilakukan analisis

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 3: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

model sistem secara terstruktur, yaitu dengan mempertimbangkan keterkaitan data

dengan proses yang dapat mengubah data sebagai entities terpisah.

4. Perancangan Sistem

Pada tahap ini dilakukan perancangan user interface, perancangan database,

dan perancangan alur sistem. Perancangan sistem dilakukan dengan

mengimplementasikan seluruh kebutuhan yang tercatat pada analisis model,

sehingga dapat mengakomodasi seluruh kebutuhan implisit yang dibutuhkan

pengguna.

5. Pembuatan Program

Modul yang dibuat adalah berupa modul tambahan untuk website dengan

bahasa pemrograman PHP dan database SQL Server 2008. Pembuatan modul

dilakukan berdasarkan diagram dan rancangan user interface. Pada tahap ini,

dilakukan visualisasi dari rancangan yang telah dibuat dengan menambahkan

struktur HyperText Markup Language (HTML) yang dilengkapi dengan style pada

dokumen Cascading Style Sheets (CSS) serta interaction yang dihasilkan dengan

adanya penambahan jQuery dan asynchronous JavaScript and XML (AJAX).

Kemudian, dilanjutkan dengan menambah modul pada backend website sesuai

dengan diagram alur yang telah dibuat, serta menerapkan algoritma yang

digunakan.

6. Pengujian

Pengujian adalah proses pelatihan sistem yang telah dibuat secara spesifik,

dalam menemukan error sebelum digunakan oleh pengguna, serta untuk

mengetahui tingkat kepuasan user dan kelemahan dari sistem untuk direvisi lebih

lanjut.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 4: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

7. Penarikan Simpulan

Tahapan terakhir adalah menarik simpulan dari hasil pengujian yang telah

dilakukan, kemudian membuat laporan hasil analisis dan perancangan yang telah

dilakukan.

3.2 Analisis Perancangan

Dalam membangun sistem ini, diperlukan analisis dan perancangan terlebih

dahulu. Analisis dan perancangan sistem dilakukan dengan membuat Data Flow

Diagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan

antarmuka pemakai (User Interface).

3.2.1 Data Flow Diagram

Alur data pada sistem rekomendasi tenaga kerja ini digambarkan melalui

beberapa Data Flow Diagram (DFD) sebagai berikut.

Gambar 3.1 Diagram Konteks Sistem Rekomendasi Tenaga Kerja

Pada Gambar 3.1, tergambar dua (2) entitas yang mengoperasikan sistem

ini, yaitu candidate dan recruiter. Kedua entitas ini dapat berinteraksi dengan

sistem dengan cara melakukan input data dan menerima output dari sistem.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 5: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Gam

bar

3.2

Dia

gra

m N

ol

Sis

tem

Rek

om

endas

i T

enag

a K

erja

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 6: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Berdasarkan Gambar 3.2, recruiter dapat melakukan login, mengelola

lowongan, memproses kandidat, dan melihat rekomendasi. Candidate dapat

melakukan login, mengubah profil kandidat, dan membuat lamaran pekerjaan. Data

store yang digunakan pada sistem ini juga digambarkan pada diagram nol ini.

Beberapa proses seperti proses mengelola lowongan, proses memproses kandidat,

proses membuat profil kandidat, dan proses membuat lamaran pekerjaan masih

dapat diuraikan dalam diagram rinci.

Gambar 3.3 Diagram Rinci Proses Mengubah Profil Kandidat

Pada Gambar 3.3, dijelaskan ketika candidate mengubah profilnya,

pencocokan profil kembali dilakukan agar rekomendasi sistem selalu berdasarkan

data yang terkini.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 7: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Gambar 3.4 Diagram Rinci Proses Mengelola Lowongan

Pada Gambar 3.4, digambarkan recruiter dapat membuat lowongan baru,

mengubah lowongan, dan menghapus lowongan. Jika diperhatikan, recruiter tidak

dapat mengubah step yang sudah dibuat. Hal ini dilakukan untuk mempertahankan

konsistensi dari lowongan pekerjaan yang sudah dibuat.

Gambar 3.5 Diagram Rinci Proses Memproses Kandidat

Seperti yang digambarkan pada Gambar 3.5, ketika recruiter memproses

seorang kandidat, sistem akan menghitung skor rekomendasi menggunakan metode

simple additive weighting berdasarkan seluruh step yang pernah pelamar lewati dan

kemudian menyimpan skor ke dalam tabel application.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 8: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Gambar 3.6 Diagram Rinci Proses Melamar Pekerjaan

Pada Gambar 3.6 dijelaskan setiap kali candidate melamar ke suatu

pekerjaan, sebelum data pelamar disimpan ke dalam database, sistem akan

melakukan pencocokan profil pelamar dengan profil yang diinginkan pada

lowongan tersebut dengan metode profile matching. Skor pencocokan profil juga

disimpan ke dalam database bersama dengan data lamaran pekerjaan.

3.2.2 Flowchart

Flowchart merupakan diagram yang menggambarkan hubungan antar

proses secara urut dan mendetail yang terjadi pada suatu sistem. Flowchart

digunakan untuk mempermudah dalam memahami urutan proses yang terjadi di

sistem rekomendasi ini.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 9: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Gambar 3.7 Flowchart Algoritma Profile Matching

Gambar 3.7 menggambarkan urutan proses yang terjadi pada algoritma

profile matching. Algoritma ini dimulai ketika candidate melamar pada suatu

lowongan pekerjaan. Sistem akan mengambil data preferensi kandidat yang

ditentukan oleh recruiter saat membuat lowongan pekerjaan dan

membandingkannya dengan profil kandidat yang melamar. Sistem menghitung

perbedaan umur, pengalaman, gaji, pendidikan, dan lokasi yang kemudian

dikonversikan menjadi skor profile matching.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 10: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Gambar 3.8 Flowchart Algoritma Simple Additive Weighting

Gambar 3.8 merupakan penjelasan untuk algoritma simple additive

weighting. Algoritma ini akan dimulai ketika recruiter memproses pelamar melalui

tahap-tahap seleksi yang ada. Sistem akan menghitung rating ternormalisasi (𝑟𝑖𝑗)

dan mengalikannya dengan bobot (𝑊𝑗) tahap tersebut, kemudian menambahkan

hasil perkaliannya ke skor yang ada pada tabel candidate.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 11: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

3.2.3 Entity Relationship Diagram

Entity Relationship Diagram (ERD) adalah suatu diagram yang

menjelaskan hubungan antar data dalam suatu database. ERD digunakan untuk

memodelkan struktur data dan hubungan antar data. Gambar 3.9 menggambarkan

ERD yang digunakan di sistem ini.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 12: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Gam

bar

3.9

Enti

ty R

elati

onsh

ip D

iagra

m

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 13: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

3.2.4 Struktur Tabel

Pada sistem yang dibangun, terdapat delapan (8) tabel berelasi dan satu (1)

tabel tak berelasi. Struktur dari kedelapan tabel berelasi tersebut adalah sebagai

berikut.

1. Nama tabel : Education

Fungsi : Menyimpan data tingkat pendidikan

Primary Key : id_edu

Foreign Key : -

Struktur dari tabel Education dapat dilihat pada Tabel 3.1.

Tabel 3.1 Struktur Tabel Education

Nama Kolom Tipe Keterangan

Id_edu Int Primary key

Title_edu Varchar(200)

2. Nama tabel : Location

Fungsi : Menyimpan data lokasi

Primary Key : id_loct

Foreign Key : -

Struktur dari tabel Location dapat dilihat pada Tabel 3.2.

Tabel 3.2 Struktur Tabel Location

Nama Kolom Tipe Keterangan

Id_loct Int Primary key

Title_loct Varchar(200)

Inactive Int

3. Nama table : Job_vacancy

Fungsi : Menyimpan data lowongan pekerjaan

Primary Key : id_vacy

Foreign Key : id_loct

Struktur dari tabel Location dapat dilihat pada Tabel 3.3.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 14: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Tabel 3.3 Struktur Tabel Job_Vacancy

Nama Kolom Tipe Keterangan

id_vacy int Primary key

title_vacy varchar(200)

date_post date

date_open date

date_close date

address varchar(500)

id_prior int

id_loct int Foreign key yang

merujuk dari tabel

location.

id_unit int

id_empt int

headcount int

id_country int

id_area int

desc_vacy text

kywd_vacy varchar(1000)

qstn_vacy text

rqstr_title varchar(200)

rqstr_email varchar(100)

rqstr_phone varchar(50)

id_rctr int

id_mngr int

inactive int

4. Nama tabel : Job_preference

Fungsi : Menyimpan data preferensi lowongan

Primary Key : -

Foreign Key : id_vacy

Struktur dari tabel Job_preference dapat dilihat pada Tabel 3.4.

Tabel 3.4 Struktur Tabel Job Preference

Nama Kolom Tipe Keterangan

id_vacy int Foreign key yang

merujuk tabel

job_vacancy

salary int

age int

experience int

education int

location int

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 15: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

5. Nama tabel : Candidate

Fungsi : Menyimpan data kandidat

Primary Key : id_cand

Foreign Key : id_loct

Struktur dari tabel Candidate dapat dilihat pada Tabel 3.5.

Tabel 3.5 Struktur Tabel Candidate

Nama Kolom Tipe Keterangan

id_cand int Primary key

id_sex int

first_name varchar(50)

last_name varchar(100)

city varchar(100)

id_country int

email varchar(100)

phone varchar(50)

id_nation int

id_edu int

doc_cand varchar(200)

blacklisted int

cmnt_rctr varchar(500)

processed_by int

dob date

exp_salary int

experience float

id_loct int Foreign key yang

merujuk pada table

Location

6. Nama tabel : Vacy_step

Fungsi : Menyimpan data tahapan seleksi

Primary Key : -

Foreign Key : id_vacy

Struktur dari tabel Vacy_step dapat dilihat pada Tabel 3.6.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 16: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Tabel 3.6 Struktur Tabel Vacy_step

Nama Kolom Tipe Keterangan

Id_vacy Int Foreign key yang

merujuk pada tabel

job_vacancy

Id_step Int

Step_weight Int Bobot tahapan seleksi

7. Nama tabel : Application

Fungsi : Menyimpan data lamaran pekerjaan

Primary Key : id_app

Foreign Key : id_cand, id_vacy

Struktur dari tabel Application dapat dilihat pada Tabel 3.7.

Tabel 3.7 Struktur Tabel Application

Nama Kolom Tipe Keterangan

id_app int Primary key

id_cand int Foreign key yang

merujuk pada tabel

Candidate

id_vacy int Foreign key yang

merujuk pada tabel

Job_vacancy

date_app date

comments varchar(1000)

id_ref int

status int

last_step int

id_ans int

total_score float

match_score float

is_complete int

8. Nama tabel : Process

Fungsi : Menyimpan data proses seleksi

Primary Key : id_process

Foreign Key : id_app

Struktur dari tabel Process dapat dilihat pada Tabel 3.8.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 17: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Tabel 3.8 Struktur Tabel Process

Nama Kolom Tipe Keterangan

id_process int Primary key

id_app int Foreign key yang

merujuk pada tabel

Application

id_step int

timestamp datetime

status int

id_detail int

done_by int

score int

Selain tabel yang berelasi, sistem ini juga memiliki tabel yang tidak berelasi.

Tabel tersebut adalah tabel User.

9. Nama tabel : User

Fungsi : Menyimpan data user login

Primary Key : id_user

Foreign Key : -

Struktur dari tabel User dapat dilihat pada Tabel 3.9.

Tabel 3.9 Struktur Tabel User

Nama Kolom Tipe Keterangan

id_user int Primary key

title_user varchar(100)

id_unit int

id_loct int

email varchar(100)

pass varchar(35)

phone varchar(50)

ext varchar(10)

inactive int

3.2.5 Perancangan Antarmuka Website

Sistem rekomendasi ini dibuat dalam bentuk website. Antarmuka dari

sistem ini terdiri dari bagian frontend dan backend.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 18: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

A. Rancangan Halaman Frontend

Halaman frontend pada penelitian ini terdiri dari halaman home, halaman

memilih pekerjaan, halaman melamar pekerjaan, halaman profil, dan halaman edit

profil. Kelima halaman tersebut dapat dijelaskan sebagai berikut.

1. Halaman Home

Halaman home merupakan halaman utama dari frontend website. Pada

halaman ini terdapat form untuk melakukan login dan form untuk memilih

pekerjaan. Pada halaman ini juga terdapat home image, article, events, browse us

dan twitter feed Kompas Gramedia. Rancangan halaman home digambarkan pada

Gambar 3.10. Saat candidate sudah melakukan proses login, form login akan

digantikan dengan informasi login dan tombol logout. Rancangan halaman home

setelah proses login digambarkan oleh Gambar 3.11.

Gambar 3.10 Rancangan Halaman Home

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 19: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Gambar 3.11 Rancangan Halaman Home (Logged In)

2. Halaman Memilih Pekerjaan

Pada Halaman ini terdapat daftar lowongan yang tersedia, form untuk

menyaring pekerjaan, form login, daftar pekerjaan yang dipilih untuk dilamar,

tombol clear all, dan tombol apply. Rancangan halaman memilih pekerjaan ini

digambarkan pada Gambar 3.12.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 20: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Gambar 3.12 Rancangan Halaman Memilih Pekerjaan (Tidak Login)

Tampilan pada halaman ini akan berubah jika candidate sudah melakukan

proses login. Form login akan diganti dengan informasi login dan terdapat tombol

logout. Rancangan halaman memilih pekerjaan ketika candidate sudah melakukan

login digambarkan pada Gambar 3.13.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 21: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Gambar 3.13 Rancangan Halaman Memilih Pekerjaan (Logged In)

3. Halaman Melamar Pekerjaan

Halaman ini terdapat beberapa field yang harus diisi untuk melamar

pekerjaan, tombol cancel, dan tombol apply. Jika candidate sudah melakukan

proses login, maka beberapa field yang ada pada form akan terisi dengan data profil

dari candidate. Halaman melamar pekerjaan ini digambarkan pada Gambar 3.14

dan Gambar 3.15.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 22: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Gambar 3.14 Rancangan Halaman Melamar Pekerjaan (Tidak Login)

Gambar 3.15 Rancangan Halaman Melamar Pekerjaan (Logged In)

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 23: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

4. Halaman Profil

Halaman ini ditampilkan setelah candidate melakukan proses login. Pada

halaman ini terdapat data profil, tombol edit profile, gambar CV, detail dari

pekerjaan yang sudah dilamar, dan tombol logout. Gambar 3.16 menggambarkan

rancangan halaman profil.

Gambar 3.16 Rancangan Halaman Profil

5. Halaman Edit Profil

Pada halaman ini terdapat form pengisian profil, tombol logout, tombol

cancel, dan tombol apply. Rancangan halaman edit profil ini dapat dilihat pada

Gambar 3.17.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 24: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Gambar 3.17 Rancangan Halaman Edit Profil

B. Rancangan Halaman Backend

Halaman backend pada penelitian ini terdiri dari halaman login recruiter,

halaman recruiter home, halaman daftar lowongan, halaman membuat lowongan

baru, halaman melihat detail lowongan, halaman mengubah lowongan, halaman

daftar candidate, halaman melihat detail candidate, halaman memproses candidate,

dan halaman melihat rekomendasi.

1. Halaman Login Recruiter

Pada halaman ini, terdapat gambar logo, dan form untuk melakukan login.

Rancangan halaman login recruiter dapat dilihat pada Gambar 3.18.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 25: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Gambar 3.18 Rancangan Halaman Login Recruiter

2. Halaman Recruiter Home

Pada halaman ini terdapat pesan selamat datang dan beberapa pilihan menu

untuk recruiter. Rancangan halaman recruiter home ini dapat dilihat pada Gambar

3.19.

Gambar 3.19 Rancangan Halaman Recruiter Home

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 26: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

3. Halaman Daftar Lowongan

Pada rancangan halaman daftar lowongan ini terdapat field untuk menyaring

lowongan yang ditampilkan, daftar lowongan yang ada, dan tombol untuk membuat

halaman baru. Rancangan halaman daftar lowongan ini dapat digambarkan oleh

Gambar 3.20.

Gambar 3.20 Rancangan Halaman Daftar Lowongan

4. Halaman Membuat Lowongan Baru

Pada halaman ini terdapat field untuk mengisikan detail dari lowongan yang

akan dibuat, tahap seleksi, bobot per tahap seleksi, profil yang diinginkan, tombol

cancel, dan tombol create job. Halaman membuat lowongan baru dapat

digambarkan oleh Gambar 3.21.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 27: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Gambar 3.21 Rancangan Halaman Membuat Lowongan Baru

5. Halaman Melihat Detail Lowongan

Pada halaman ini terdapat bagian yang menampilkan detail dari lowongan

pekerjaan, bagian yang menampilkan kebutuhan dan deskripsi pekerjaan, bagian

yang menampilkan tahap-tahap seleksi yang dipilih, bagian screening question,

bagian daftar candidate yang mendaftar pada lowongan tersebut, dan tombol untuk

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 28: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

melihat hasil rekomendasi yang dibuat oleh sistem rekomendasi ini. Pada Gambar

3.22 digambarkan rancangan halaman melihat detail lowongan ini.

Gambar 3.22 Rancangan Halaman Melihat Detail Lowongan

6. Halaman Mengubah Lowongan

Pada halaman ini terdapat field yang dapat diisi untuk mengubah detail dari

lowongan, field tahapan seleksi yang tidak dapat diganti, dan field profil yang

diinginkan. Tombol cancel dan tombol edit job juga disediakan untuk menyimpan

atau membatalkan perubahan yang telah dibuat. Gambar 3.23 menggambarkan

rancangan halaman mengubah lowongan.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 29: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Gambar 3.23 Rancangan Halaman Mengubah Lowongan

7. Halaman Daftar Candidate

Pada Gambar 3.24, digambarkan rancangan halaman daftar candidate yang

berisi field untuk menyaring candidate yang ditampilkan, dan daftar candidate

beserta daftar pekerjaan yang dilamar.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 30: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Gambar 3.24 Rancangan Halaman Daftar Candidate

8. Halaman Melihat Detail Candidate

Pada halaman ini terdapat kolom yang menampilkan informasi dari

candidate, kolom yang menampilkan informasi lowongan yang dilamar oleh

candidate, daftar tahapan seleksi tiap pekerjaan, dan tampilan cv yang dimiliki oleh

candidate. Rancangan halaman melihat detail candidate ini digambarkan oleh

Gambar 3.25.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 31: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Gambar 3.25 Rancangan Halaman Detail Candidate

9. Halaman Memproses Candidate

Halaman memproses candidate ini dirancang dalam bentuk modal. Terdapat

lima jenis halaman memproses candidate. Setiap jenis halaman memproses

candidate tersebut menampilkan nama tahapan seleksi, nama candidate, nama

lowongan, kolom penilaian, tombol accept, dan tombol reject.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 32: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Pada tahap screening cv terdapat kolom yang menampilkan hasil dari profile

matching yang dilakukan oleh sistem dan kolom penilaian memiliki tiga pilihan,

yaitu tidak disarankan, dipertimbangkan, dan tidak disarankan. Rancangan halaman

proses candidate pada tahap screening CV digambarkan pada Gambar 3.26.

Gambar 3.26 Rancangan Halaman Proses Candidate (Screening CV)

Pada tahap interview HR, interview user, dan interview with higher level,

halaman memproses candidate memiliki kolom penilaian yang berisi tiga pilihan,

yaitu tidak disarankan, dipertimbangkan, dan tidak disarankan. Rancangan halaman

proses candidate pada tahap interview digambarkan pada Gambar 3.27.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 33: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Gambar 3.27 Rancangan Halaman Memproses Candidate (Interview)

Pada tahap technical test dan psikotes, kolom penilaian pada halaman

memproses candidate berupa sebuah textbox yang menerima nilai antara 1 sampai

dengan 10. Rancangan halaman memproses candidate pada tahap technical test dan

psikotes ini digambarkan pada Gambar 3.28.

Gambar 3.28 Rancangan Halaman Memproses Candidate (Technical Test dan

Psikotest)

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 34: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Pada tahap medical check up, halaman memproses candidate memiliki

kolom penilaian yang berisi dua pilihan, yaitu fit dan unfit. Rancangan halaman

proses candidate pada tahap medical check up digambarkan pada Gambar 3.29.

Pada tahap signing contract, halaman memproses candidate memiliki

kolom penilaian yang berisi dua pilihan, yaitu sign dan didn’t sign. Rancangan

halaman proses candidate pada tahap signing contract digambarkan pada Gambar

3.30.

Gambar 3.29 Rancangan Halaman Memproses Candidate (Medical Check Up)

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 35: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Gambar 3.30 Rancangan Halaman Memproses Candidate (Signing Contract)

10. Halaman Melihat Rekomendasi

Halaman melihat rekomendasi ini merupakan sebuah modal yang dapat

diakses dengan menekan tombol untuk melihat hasil rekomendasi pada halaman

melihat detail lowongan.

Pada halaman ini terdapat daftar candidate yang mendaftar pada sebuah

lowongan, perhitungan nilai dari tahap seleksi, dan perhitungan nilai pencocokan

profil. Rancangan halaman melihat rekomendasi ini digambarkan oleh Gambar

3.31.

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015

Page 36: Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/1677/4/BAB III.pdfDiagram (DFD), Flowchart, Entity Relationship Diagram (ERD), dan rancangan antarmuka pemakai

Gambar 3.31 Rancangan Halaman Melihat Rekomendasi

Rancang Bangun ..., Handriady Wira Winata, FTI UMN, 2015


Top Related