Tuesday, April 22, 2025

PWeb - Proyek 1 - Helpdesk

 


Judul Proyek:

“Customer Service Web App – HelpDeskKu”


Deskripsi Proyek:

Aplikasi web ini dirancang untuk melayani kebutuhan pelanggan secara daring, seperti mengirim pertanyaan, melihat FAQ, dan melacak status tiket layanan. Proyek ini berfokus pada sisi front-end (tanpa backend), namun harus mendemonstrasikan alur kerja dan antarmuka pengguna yang baik.


Tujuan Pembelajaran:

  • Memahami struktur form dan input user

  • Membuat layout yang ramah pengguna dan responsif

  • Menggunakan JavaScript untuk validasi dan manipulasi DOM

  • Membuat komponen UI dinamis (seperti FAQ accordion dan sistem tiket dummy)


Fitur-Fitur yang Harus Diimplementasikan:

1. Formulir Kontak Pelanggan

  • Input nama, email, topik pertanyaan, dan pesan

  • Validasi form menggunakan JavaScript

  • Menampilkan preview pesan yang dikirim

2. Halaman FAQ (Frequently Asked Questions)

  • Menampilkan daftar pertanyaan umum dalam format accordion

  • Setiap item bisa dibuka/tutup menggunakan JavaScript

  • Styling interaktif dan mudah dibaca

3. Simulasi Tiket Layanan

  • Input nomor tiket untuk "melacak status" (dummy)

  • Menampilkan status acak (misalnya: “Sedang diproses”, “Selesai”, “Menunggu tanggapan”)

  • Simulasi logika menggunakan JavaScript

4. Navigasi dan Layout

  • Navigasi antar halaman: Beranda, Hubungi Kami, FAQ, Lacak Tiket

  • Layout responsif (menggunakan Flexbox/Grid + Media Queries)

  • Warna konsisten dan profesional (gunakan palet warna netral)


Teknologi yang Digunakan:

  • HTML: struktur form, layout halaman, dan navigasi

  • CSS: styling responsif dengan media queries, transisi, dan efek hover

  • JavaScript: validasi input, manipulasi elemen DOM, simulasi pelacakan tiket

No comments:

Post a Comment