DOI : 10.51530/jutekin.v9i2.537

## JURNAL TEKNIK INFORMATIKA
Halaman Jurnal: http://jurnal.stmik-dci.ac.id/index.php/jutekin/ Halaman LPPM STMIK DCI : http://lppm.stmik-dci.ac.id/
IMPLEMENTASI KANBAN FRAMEWORK DALAM PEMBUATAN WEBSITE PROFIL PERUSAHAAN MENGGUNAKAN WORDPRESS DAN ELEMENTOR
Akik Hidayat 1 , Alvin 2
Prodi Teknik Informatika, Universitas Padjadjaran Email : akik@unpad.ac.id 1 , alvin18001@mail.unpad.ac.id 2

## ABSTRAK
Intisari— Website profil perusahaan menjadi sebuah trend dalam melakukan promosi dan melakukan pelayanan pada era sekarang, dengan kemajuan teknologi yang  pesat  media  promosi  menjadi  lebih  efektif  melalui  media  digital,  pelayanan yang sering dilakukan salah satunya melalui website karena mempunyai fleksibelitas yang tinggi dalam menangani promosi, salah satu cara membuat website yang cepat dan  mudah  adalah  menggunakan  Content  Management  System  (CMS)  seperti Wordpress  karena  efektif  dan  lebih  menghemat  biaya,  Wordpress  sendiri  bisa dimaksimalkan dengan beberapa plugin di dalamnya salah satunya adalah Elementor yang digunakan sebagai website builder.
Kata Kunci : Wordpress, Website, Company Profile, Elementor, Framework, Kanban.

## I. PENDAHULUAN
Website  dipilih  sebagai  media promosi  dikarenakan  lebih  fleksibel dan lebih menghemat anggaran karena sifatnya  yang  mudah  diperbaharui, cakupan  website  juga  lebih  luas  dan semua orang dapat mudah mengakses website  melalui  berbagai  perangkat elektronik yang terhubung ke internet sehingga banyak perusahaan menggunakan website sebagai bentuk promosi dan pelayanan mereka.
KenalTiongkok merupakan salah satu  perusahaan  yang  menggunakan website  sebagai  media  promosi  dan layanannya, layanan dari
KenalTiongkok  sendiri  berupa  jasa penerjemah  dokumen  dan  berbagai kursus  bahasa  mandarin,  dan  dengan menggunakan  website  KenalTiongkok berharap dapat memaksimalkan layanannya.
II. LANDASAN TEORI 2.1 Website Website merupakan sekumpulan  halaman  yang  salaing berhubungan  pada  suatu  domain  di internet  yang  dibuat  untuk  tujuan tertentu  yang  dapat  diakses  melalui browser  menggunakan  sebuah  URL tertentu.  Website  sendiri  awal  dibuat
DOI : 10.51530/jutekin.v9i2.537
pada  tahun  1980an  dan  resmi  online pada  tahun  1991  oleh  Tim  Berners  – Lee  dengan  tujuan  supaya  lebih memudahkan  peneliti  di  tempatnya untuk bertukar pikiran.

## a. Content Management System
Content  Management  System adalah sebuah platform yang memberikan  kemampuan  dan  fitur yang lengkap dalam membuat sebuah website professional dengan
menggunakan CMS kita dapat dengan mudah  membuat  sebuah  halaman website  dan  mempublikasikannya dengan  domain  kita  sendiri,  dengan menggunakan  CMS  juga  kita  dapat membuat, mengorganisir dan mempublikasikan  konten  kita  dalam sebuah website (Daru, 2013).
Gambar. 2.1
Model CMS (Sumber : Gun Gunawan, S, ST. Web Content Management System Dengan PHP dan MySQL (http://www.Ilmukomputer.com)

## b. Agile Methodology
Dalam  pembangunan  sebuah software  dibutuhkan  sebuah  metode pengembangan  perangkat  lunak  atau yang  biasa  disebut  sebagai  Software Development  Life  Cycle  (SDLC)  ,  Agile merupakan  salah  satu  SDLC  yang cukup  popular  belakangan  ini,  agile sendiri merupakan metodologi pengembangan software untuk jangka pendek dan yang memerlukan adaptasi  yang  cepat,  agile  sendiri mempunyai  beberapa  prinsip  seperti
lebih  mengutamakan  software  yang berfungsi dibandingkan dengan dokumentasi yang lengkap serta lebih mengutamakan interaksi antar personal dibandingkan proses dan alat yang  digunakan  (Metodologi  et  al.,
2020).

## c. Kanban Framework
Kanban  adalah  suatu  sistem yang  di  atur  sedemikian  rupa  untuk melakukan  pemantauan  terhadap proses kerja dalam sebuah kelompok, biasanya  diimplementasikan  kedalam sebuah  kanban  board  atau  kartu bergantung  kebijkan  dalam  kelompok tersebut, dalam kata asalanya kanban terdiri  dari  dua  kata  yaitu  “kan”  yang berarti  visual  dan  „ban‟  berarti  kartu sehingga  kanban  dapat  diartikan sebagai kartu visual. (Sundén, no date).

## d. Wordpress
Wordpress  merupakan  sebuah
Content  Management  System  dimana digunakan  unutk  membuat  sebuah website  dengan  mudah  tanpa  harus mempunyai  kemampuan  dalam  hal pengkodean
website, dengan
menggunakan  wordpress  kita  akan lebih  focus  kepada  hal  terpenting dalam  sebuah  website  yaitu  konten karena  masalah  teknik  sudah  dapat teratasi  oleh  wordpress  (Guide, Downloaded and Plugins, no date).

## e. Elementor
Elementor  merupakan  drag- and-drop  builder  dengan  kata  lain memungkinkan  kita  untuk  membuat sebuah  element  dalam  web  dengan hanya  meletakkan  pada  sebuah  page dengan  mudah  dengan  komponen yang sudah tersedia dalam elementor, di elementor juga memungkinkan kita untuk  memodifikasi  komponen  yang
ada  sesuai  dengan  kebutuhan  dari desain  website  yang  akan  kita  buat. (Fitria, 2013)
f. Unified  Modeling  Language
(UML) Unified  Modeling  Language adalah sebuah bahasa yang direpresentasikan dalam sebuah grafik/gambar  yang  bertujuan  untuk melakukan visualisasi, spesfikasi,
membangun  dan  dokumentasi  dalam sebuah sistem pengembangan software berbasis object, UML sendiri sudah menjadi standar dalam pembentukan  blueprint yang meliputi konsep bisnis proses, penulisan kelas-
kelas  dalam  bahasa  program  yang spessifik, skema database dan komponen lainnya dalam
pembangunan software (Booch, 1996).

## g. Usability Testing
Usability  testing  adalah  sebuah metode  untuk  mengevaluasi  user experience terhadap software ataupun website  yang  dibuat.  Umumnya, metode  ini  dilakukan  oleh  para  UX developer dengan
melibatkan beberapa  user  (pengguna)  tertentu untuk  diteliti  bagaimana  proses mereka  selama  berinteraksi  dengan website.  Pengujian  ini  tidak  boleh dilewatkan  karena  berkaitan  dengan user  experience  pengguna  dalam memakai sistem yang kita buat.

## h. Heuristic Evaluation
Heuristic Evaluation adalah sebuah metode penilain dari fungsionalitas  suatu  produk  digital yang mempunyai tujuan untuk memperbagus user
experience.
Metode  ini  dicetuskan  pertama  kali oleh  Jakob  Nielsen  dan  Rolf  Molich pada  tahun  1994,  didalam  pengujian
ini  biasanya  terdiri  dari  5  evaluator dengan masing masing evaluator harus memiliki pemahaman yang mendalam mengenai  produk  digital  dan  berasal dari latar belakang terkait seperti ilmu computer, UI/UX design, HCI dan lain- lain.

## III. ANALISIS MASALAH
3.1 Fase Eksplorasi Dalam  fase  ini  ditentukan beberapa kebutuhan dalam perancangan sistem yang ada,
beberapa  hal  yang  dilakukan  dalam fase ini adalah sebagai berikut :
1. Kebutuhan Pengguna
Digunakan untuk menyesuaikan
sistem  dengan  fungsionalitas  yang diperlukan  pengguna,  ada  beberapa role  dalam  sistem  yang  terdiri  dari admin  (  mengatur  website  dan  role user),  contributor  (membuat  artikel) dan  visitor  (pengunjung  yang  hanya dapat membaca artikel).
2. Kebutuhan Data Data dikumpulkan untuk melakukan  optimalisasi  dari  sistem yang  akan  dibuat  dan  diambil  dari sistem  sebelumnya  melalui  tim  UX Researcher dan data-data yang berkaitan  dengan  sistem  adalah sebagai berikut : a. Data analisis user interface dari sistem terdahulu
b. Data  indeks  SEO  pada  website terdahulu c. Fitur pengembangan pada website yang bisa ditambahkan 3. Kebutuhan Perangkat Lunak
Sistem  yang  akan  dibuat  dalam
bentuk  sebuah  website  maka  dari  itu berikut  adalah  beberapa  kebutuhan
DOI : 10.51530/jutekin.v9i2.537
perangkat  lunak  yang  dibutuhkan dalam pembuatan sistem ini :
a. Wordpress : pembuatan website dan sebagai CMS
b. Windows  10  Home  Single Language 20H2 : sistem operasi yang digunakan
c. Trello  :  sebagai  group  task manajemen
d. Figma  :  untuk  design  mockup website
e. Elementor : Plugin yang digunakan untuk membuat komponen di wordpress 4. Kebutuhan Perangkat Keras Berikut adalah spesfiikasi hardware  yang  digunakan  penulis dalam mengembangkan sistem ini :
a. Processor  :  Intel(R)  Celeron(R) CPU 4205U @ 1.80GHz 1.80 GHz
b. RAM : 8,00 GB
5. Kebutuhan Sistem
Rincian  fitur  dapat  dilihat  pada
Tabel 3.1, Tabel 3.2 dan Tabel 3.3.
Tabel 3.1
Kebutuhan Sistem Pengguna : Admin
Tabel 3.2
Kebutuhan Sistem Pengguna : Visitor
Tabel 3.3
Kebutuhan Sistem Pengguna : Contributor

## 6. User Story
Dalam  pembangunan  sistem  ini berikut  adalah  user  story  yang dirancang  dalam  rangka  mengetahui kebutuhan dan pola pengguna website: a. Pengguna  kesulitan  mencari informasi  seputar  pelayanan yang ditawarkan KenalTiongkok b. Pengguna  ingin  mendapatkan tempat yang menyediakan informasi  lengkap  mengenai pelayanan dari KenalTiongkok c. Pengguna membutuhkan pelayanan secara mandiri dimana pengguna dapat langsung  memilih  jenis  kursus yang mereka pilih tanpa melalui chat admin social media d. Pengguna menginginkan pelayanan  yang  professional terkait  dengan  penerjemahan dokumen,  seperti  informasi harga  dan  keterangan  lainnya dalam satu website. IV. PERANCANGAN SISTEM 4.1 Fase Perencanaan
Gambar 4.1
Penerapan Kanban Methodology pada Trello Board
4.2 Fase Iterasi
1. Analisis Sistem
a. Use Case Diagram
Gambar 4.2
Use Case Diagram
b. Activity Diagram
Gambar 4.3

## Activity Diagram
2. Desain Antarmuka
a. Halaman Kursus
Gambar 4.4 Halaman Kursus
b. Halaman Penerjemah
Gambar 4.5 Halaman Penerjemah

## c. Halaman Beranda
Gambar 4.6
Halaman Beranda d. Halaman Lainnya
Gambar 4.7 Halaman Lainnya 3. Testing Berikut  adalah  kerangka  dari pengujian yang dilakukan. Tabel 4.1 Kententuan Usability Testing Skenario Hasil yang diharapkan Hasil Mengeskp lorasi navigasi bar  pada website Informasi dapat ditampilkan dalam website sesuai dengan  navigasi  bar yang  diklik Mengkase s  halaman penerjema h Menampilkan halaman  yang  berisi informasi layanan penerjemah Mengakse s  halaman kursus Menampilkan halaman  yang  berisi informasi layanan kursus Mengakse s  halaman tentang kami Menampilkan halaman  yang  berisi informasi dari KenalTiongkok Mengakse s halam Nihao Melakukan  redirect ke nihao.kenaltiongkok. com dan
DOI : 10.51530/jutekin.v9i2.537
menampilkan halaman website Nihao Melihat detail kursus Menampilkan halaman  yang  berisi detail  kursus  sesuai yang dipilih Melihat detail artikel Menampilkan halaman  yang  berisi artikel  sesuai  yang dipilih pengguna Melakuka n pencarian artikel Menampilkan  artikel sesuai dengan keyword  pencarian yang diketikkan pengguna Mendaftar kan  diri  di layanan penerjema h Menampilkan  recap dari pendaftaran layanan  penerjemah yang diinputkan pengguna Mendaftar kan  diri  di layanan kursus Menampilkan  recap dari pendaftaran layanan  kursus  yang diinputkan pengguna Melakuka n email subscribpt ion Mendapatkan notifikasi ke email setelah melakukan subscription Tabel 4.2 Ketentuan Heuristic Evaluation Indikator  Komponen yang diuji E1  E2  E3 Visibility  Tampilan dan informasi yang terbaca dengan jelas Informasi yang mudah dipahami Match Between System and The Real World Kesesuaian illustrasi dengan informasi Penempatan button dan section User Control and Freedom Animasi scroll pada setiap halaman Kemudahan dan kejelasan dalam mengisi form kursus dan penerjemah Consiste ncy and Standard Desain dan pemilihan warna pada website Konsitensi dan daya tarik komponen webiste Recognit ion Rather than Recall Kemudahan mengenali icon dan lambang dalam website Flexibilit y and Efficienc y of Use Pengguna dapat mudah mengenali kegunaan suatu fitur Design Daya tarik dari desain website baik dari warna , illustrasi dan komponen pendukung lainnya Recover y and System Kemudahan dalam mengisi form yang tersedia Help and Docume ntation Informasi yang ditampilkan jelas dan mudah dimengerti 4.3 Fase Produksi Pembuatan website dalam
laporan  ini  menggunakan  Content Managament  System  (CMS)  berupa Wordpress  dan  menggunakan  plugin Elementor  yang  digunakan  untuk membuat  komponen  user  interface yang  telah  dibuat  oleh  tim  UI/UX designer,  didalam  proses  ini  tim  dari web development memulai pengembangan website dengan pembagian tugas yang telah dilakukan oleh pembimbing lapangan,
pembagian  tugas  tersebut  dilakukan setiap minggu.

## 4.4 Fase  Pemeliharaan  dan  Fase
Akhir Pada fase ini admin dari website KenalTiongkok sudah mulai memasukkan  konten  artikel  yang sempat  tertunda  akibat  dari  transisi website  lama  ke  website  terbaru,  di dalam fase ini juga admin KenalTiongkok  menambah  keamanan dari dashboard KenalTiongkok
sehingga apabila mengalami kesalahan login maka akan terblok dan tidak bisa memasuki dashboard wordpress.

## V. IMPLEMENTASI SISTEM
5.1 Implementasi Program
1. Halaman Utama
Gambar 5.1
Halaman Utama
2. Halaman Kursus Gambar 5.2 Halaman Kursus

## 3. Halaman Penerjemah
Gambar 5.3 Halaman Kursus

## 4. Halaman Tentang Kami
Gambar 5.4
Halaman tentang kami
5. Halaman Nihao
Gambar 5.5 Halaman Nihao

## 5.2 Fase Produksi
Fase produksi dalam pembuatan website  ini  dibilang  cukup  singkat karena  harus  segera  memenuhi kebutuhan  dari  divisi  lain  untuk melakukan  publikasi  artikel  dalam website  sehingga  dari  tim  developer lebih  focus  ke  dalam  beberapa  hal penting  dalam  website  tersebut sehingga masih ada beberapa tampilan yang masih belum optimal.

## 5.3 Rilisan Kecil
Rilisan  kecil  dari  website  ini sudah  dimulai  sejak  dibukannya maintenance  mode  yang  diterapkan selama  proses  development  hal  ini dilakukan agar CEO dari KenalTiongkok serta  Tim  UI/UX  Designer  dapat memantau  perkembangan  website yang  sedang  dikembangkan  oleh  tim Web  Development  selain  itu  bisa digunakan  untuk  wadah  saling  tukar pikiran  mengenai  beberapa  hal  yang
mungkin kurang
atau bisa
ditambahkan nantinya dalam website, rilisan  kecil  ini  juga  bermanfaat  bagi para  developer  untuk  memastikan apakah  website  yang  dikembangkan kompatibel  terhadap  pengguna  yang ada  baik  melalui  Personal  Computer maupun browser smartphone.

## 5.4 Pengujian
Pengujian  dalam  website  ini menggunakan 2 metode yaitu usability testing dan heuristic evaluation.
Tabel 5.1 Hasil Usability Testing Skenario Hasil yang diharapkan Hasil Mengeskp lorasi navigasi bar  pada website Informasi dapat ditampilkan  dalam website sesuai dengan navigasi bar yang  diklik berhasil Mengkase s  halaman penerjema h Menampilkan halaman yang berisi informasi layanan penerjemah Berhasil Mengakse s  halaman kursus Menampilkan halaman yang berisi informasi layanan kursus Berhasil Mengakse s  halaman tentang kami Menampilkan halaman yang berisi informasi dari KenalTiongkok Berhasil Mengakse s halam Nihao Melakukan redirect ke nihao.kenaltiongko k.com dan menampilkan halaman website
Nihao berhasil Melihat detail kursus Menampilkan halaman yang berisi  detail  kursus sesuai yang dipilih Berhasil Melihat detail artikel Menampilkan halaman yang berisi  artikel  sesuai yang dipilih pengguna Berhasil Melakuka n pencarian artikel Menampilkan artikel sesuai dengan keyword pencarian yang diketikkan pengguna Berhasil Mendaftar kan  diri  di layanan penerjema h Menampilkan recap dari pendaftaran layanan penerjemah  yang diinputkan pengguna Berhasil Mendaftar kan  diri  di layanan kursus Menampilkan recap dari pendaftaran layanan kursus yang diinputkan pengguna Berhasil Melakuka n email subscribpt ion Mendapatkan notifikasi ke email setelah melakukan subscription Belum Tabel 5.2 Hasil Heuristic Evaluation Indikator Komponen yang diuji E1  E2  E3 Visibility  Tampilan dan informasi yang terbaca dengan jelas Informasi yang mudah dipahami 1 0 0 Match Between System and The Real World Kesesuaian illustrasi dengan informasi Penempatan button dan section 0 0 0 User Control Animasi scroll pada setiap halaman 0 0 0
and
Freedom Kemudahan dan kejelasan dalam mengisi form kursus dan penerjemah Consiste ncy and Standard Desain dan pemilihan warna pada website Konsitensi dan daya tarik komponen webiste 0 0 0 Recogniti on Rather than Recall Kemudahan mengenali icon dan lambang dalam website 0 0 0 Flexibility and Efficiency of Use Pengguna dapat mudah mengenali kegunaan suatu fitur 0 0 0 Design Daya tarik dari desain website baik dari warna , illustrasi dan komponen pendukung lainnya 0 0 0 Recovery and System Kemudahan dalam mengisi form yang tersedia 0 1 1 Help and Documen tation Informasi yang ditampilkan jelas dan mudah dimengerti 0 1 1 0.11 0.22 0.22 5.5 Fase  Pemeliharaan  dan  Fase Akhir 1. Feedback Feedback  dari  laporan  ini
didapatkan  dari  hasil  pengujian  yang telah dilakukan dengan 2 metode tadi
yaitu  usability  testing  dan  heuristic evaluation,  dari  hasil  pengujian  yang telah dilakukan ada beberapa hal yang harus  diimprovisasi  berkaitan  dengan tampilan  dari  halaman  website  yang belum  memberikan  informasi  karena masih ada yang menggunakan dummy content  seperti  pada  halaman  kursus, hal itu dikarenakan belum adanya data pasti  dari  KenalTiongkok  sehingga dalam  pengembangannya  hingga  saat ini  masih  menggunakan  dummy content.
2. Implementasi Feedback Implementasi  dari  feedback
yang  didapatkan  berdasarkan  hasil pengujian  testing  ini  akan  dilakukan apabila  data  pasti  sudah  didapatkan oleh tim website development sehingga pengguna bisa mendapatkan informasi  yang  pasti  dan  akan  selalu diupdate  secara  berkala  karena  sifat dari website ini berupa website static, dalam implementasi feedback ini juga diperlukan koordinasi dengan beberapa  tim  dari  divisi  lain  seperti
UI/UX  Designer  serta  tim  Copywriter dari KenalTiongkok sehingga informasi yang  akan  ditampilkan  dalam  website bisa  menarik  dan  mudah  dipahami penggunanya

## VI. KESIMPULAN DAN SARAN
6.1 Kesimpulan Berdasarkan  berbagai  hal  yang telah disampaikan pada bab
sebelumnya  serta  perancangan  dan implementasi  web  repositori  yang sudah  dilakukan  penulis,  maka  dapat diambil simpulan sebagai berikut:
1. Implementasi Kanban Framework  dilakukan  didalam trello  yang  digunakan  dalam pembagian tugas dalam
membangun website
2. Wordpress dan Elementor sudah  cukup  dalam  melakukan slicing  dari  desain  ke  dalam sebuah website dan dengan cara tersebut juga pengerjaan website  dapat  dilakukan  secara singkat 3. Ada  beberapa  desain  yang disesuaikan dengan kemampuan dari web developer dan  wordpress  itu  sendiri  yang sebelumnya sudah melalui diskusi 4. Berdasarkan  pengujian  yang telah dilakukan penulis, website
yang  sudah  dibangun  sudah
layak dan menarik namun masih memerlukan  perbaikan  kecil pada  beberapa  bagian  yang masih  menggunakan  dummy content.

## 6.2 Saran
Berdasarkan  hasil  penelitian yang  dilakukan,  penulis  memberikan saran sebagai berikut: 1. Pembangunan  website  dengan menggunakan Content Management System CMS) merupakan  pilihan  yang  tepat dalam mengembangkan website secara  cepat,  namun  perlu pertimbangkan pula pembuatan website menggunakan framework khusus dalam pembangunan  website  karena pastinya  akan  lebih  optimal dalam  meningkatkan  layanan serta  mengembangkan  fitur yang ada
2. Optimalisasi dalam penggunaan plugin  di  wordpress  untuk meningkatkan enggagment dengan  pengguna  bisa  menjadi salah satu trik dari
mengembangkan  website  ini hingga menjadi optimal
3. Selalu  melakukan  update  atau pembaharuan  konten  menjadi salah  satu  kunci  agar  webiste dapat berkembang dengan baik karena  akan  terindeks  oleh Google maka optimalisasi dalam konten  bisa  dilakukan  agar website lebih optimal.

## DAFTAR PUSTAKA
Booch, G. (1996) ‘Uml Boo’, Performance  Computing/Unix Review, 14(13). Daru,  A.  F.  (2013)  ‘Integrasi  Cms  Dan Lms  Untuk  Membangun  Web Berbasis  E-Learning  Dengan Single Login’, Jurnal Transformatika, 11(1), p. 23. doi: 10.26623/transformatika.v11i1. 77. Fitria (2013) Step by Step Guide on WP How  to  lEarn,  Journal  of Chemical Information and Modeling. Guide,  A.  I.,  Downloaded,  M.  and Plugins, W. (no date) ‘WordPress:  Top  1000  Most Downloaded WordPress Plugins An Interactive Guide to the 100
Most  Downloaded  WordPress Plugins’.
Metodologi, I. et al. (2020) ‘Implementasi Metodologi Kanban Dalam Pembuatan Aplikasi  E-’,  Dewantoro,  D., Kartiko,  C.  and  Romadhon,  F., 3(28). Sundén, J. (no date) Marcus Hammarberg Joakim Sundén.