01 / BACKGROUND
Why this project?
Ruang meeting virtual sering memiliki antarmuka seragam, padahal aktivitas belajar dan hangout membutuhkan pengalaman berbeda.
02 / THE CHALLENGE
What problem am I solving?
Membuat fondasi meeting yang mendukung beberapa mode tanpa mengorbankan kejelasan navigasi dan alur bergabung.
03 / THE APPROACH
How I approached it
- Memisahkan mode ruangan dan tema visual dari logika koneksi meeting.
- Menggunakan LiveKit untuk komunikasi real-time dan Vue/Pinia untuk status antarmuka.
- Merancang alur host, waiting room, dan akses peserta secara bertahap.
04 / HIGHLIGHTS
Selected features
01
Multi-mode room concept
02
Host & waiting room flow
03
Real-time participant UI
05 / ENGINEERING
Technical decisions
Frontend state
Pinia menjaga state room, tema, dan tampilan agar komponen UI tetap terpisah.
Real-time layer
LiveKit digunakan sebagai lapisan komunikasi, terpisah dari manajemen data aplikasi.
Access flow
Akses host dan peserta dipisahkan dengan pemeriksaan serta persetujuan sebelum masuk.
06 / GALLERY
Inside the project
▧
Screenshot asli belum ditambahkan. Setelah proyekmu siap, simpan gambarnya di public/images/projects/ lalu isi array gallery pada data/projects.ts.
07 / PROGRESS
Outcome & current status
Proyek masih dalam pengembangan. Tambahkan hasil pengujian dan metrik yang benar-benar telah diukur setelah tersedia.
08 / REFLECTION
What I learned
- Memisahkan fitur real-time dari UI dan state aplikasi.
- Menyusun mode ruang tanpa menduplikasi keseluruhan halaman.
THANKS FOR EXPLORINGBack to the miniature city ↗