Skip to content

USE_CASES.md

Latest commit

 

History

History
222 lines (170 loc) · 5.05 KB

USE_CASES.md

File metadata and controls

222 lines (170 loc) · 5.05 KB

Real Use Cases - Hand Gesture Control

Aplikasi ini SUDAH FUNGSIONAL dan bisa digunakan untuk berbagai keperluan!

✅ Fitur yang Sudah Aktif (Out of the Box):

1. Kontrol Presentasi 📊

  • Swipe Left → Next slide (Arrow Right)
  • Swipe Right → Previous slide (Arrow Left)
  • Works with: PowerPoint, Google Slides, PDF viewers

2. Kontrol Video/Media 🎬

  • Push Forward → Play/Pause video
  • Swipe Up → Volume up
  • Swipe Down → Volume down
  • Open Palm → Stop all media
  • Works with: YouTube, Netflix, local videos

3. Navigasi Browser 🌐

  • Swipe Up → Scroll up (300px)
  • Swipe Down → Scroll down (300px)
  • Peace Gesture → Toggle fullscreen
  • Works with: Any website

4. Kontrol Umum ⌨️

  • Open Palm → Escape key (close dialogs, exit fullscreen)
  • Peace Gesture → Fullscreen toggle

🎯 Cara Pakai:

Presentasi PowerPoint/Google Slides:

  1. Buka presentasi
  2. Start gesture control: npm start
  3. Klik "Start Camera"
  4. Swipe left untuk next slide
  5. Swipe right untuk previous slide

Nonton YouTube:

  1. Buka YouTube video
  2. Start gesture control
  3. Push forward untuk play/pause
  4. Swipe up/down untuk volume
  5. Peace gesture untuk fullscreen
  6. Open palm untuk stop

Browsing Website:

  1. Buka website apapun
  2. Start gesture control
  3. Swipe up/down untuk scroll
  4. Peace gesture untuk fullscreen

🔧 Customize untuk Kebutuhan Anda:

Edit src/js/actions/actionRegistry.js untuk custom actions:

Contoh: Kontrol Spotify

export function onSwipeLeft(data) {
  // Next track
  simulateKeyPress('MediaTrackNext');
}

export function onSwipeRight(data) {
  // Previous track
  simulateKeyPress('MediaTrackPrevious');
}

export function onPushForward(data) {
  // Play/Pause
  simulateKeyPress('MediaPlayPause');
}

Contoh: Gaming

export function onSwipeLeft(data) {
  simulateKeyPress('a'); // Move left
}

export function onSwipeRight(data) {
  simulateKeyPress('d'); // Move right
}

export function onPushForward(data) {
  simulateKeyPress(' '); // Jump
}

Contoh: Zoom Meeting

export function onOpenPalmGesture(data) {
  simulateKeyPress('Alt+A'); // Mute/Unmute
}

export function onPeaceGesture(data) {
  simulateKeyPress('Alt+V'); // Start/Stop video
}

📱 Real World Applications:

1. Presentasi Profesional

  • Presenter bisa jalan-jalan tanpa remote
  • Lebih engaging dengan audience
  • Hands-free control

2. Home Theater

  • Kontrol video dari sofa
  • No need remote control
  • Cool factor!

3. Accessibility

  • Untuk orang dengan disabilitas
  • Kontrol komputer tanpa keyboard/mouse
  • Voice-free alternative

4. Cooking/Kitchen

  • Kontrol recipe video tanpa sentuh layar
  • Tangan kotor? No problem!
  • Next step dengan gesture

5. Gym/Workout

  • Kontrol workout video
  • No need to touch screen
  • Hands-free fitness

6. Gaming

  • Browser games control
  • Motion gaming
  • VR-like experience

🚀 Quick Start:

npm start

Buka: http://localhost:8080

Test gestures:

  1. Buka YouTube video
  2. Klik "Start Camera"
  3. Try Push Forward → Video pause/play!
  4. Try Swipe Up → Volume naik!
  5. Try Peace → Fullscreen!

💡 Pro Tips:

Untuk Presentasi:

  • Practice gestures sebelum presentasi
  • Posisi kamera di depan, jangan samping
  • Lighting yang baik

Untuk Video:

  • Gesture dari jarak 50-100cm
  • Gerakan yang jelas dan deliberate
  • Wait for visual feedback

Untuk Gaming:

  • Adjust thresholds untuk responsiveness
  • Practice timing
  • Use simple gestures

🎮 Advanced: Custom Integration

Integrate dengan Apps Lain:

// Send HTTP request
export function onSwipeLeft(data) {
  fetch('http://localhost:3000/next-slide', { method: 'POST' });
}

// Control IoT devices
export function onOpenPalmGesture(data) {
  fetch('http://smart-home-hub/lights/off', { method: 'POST' });
}

// WebSocket communication
export function onPushForward(data) {
  websocket.send(JSON.stringify({ action: 'play' }));
}

📊 Performance Tips:

  • Good lighting = Better detection = Faster response
  • Clear gestures = More accurate = Less false positives
  • Practice = Muscle memory = Smoother control

🆘 Troubleshooting:

Gesture tidak trigger action?

  • Check console (F12) untuk errors
  • Pastikan gesture terdeteksi (lihat log)
  • Adjust thresholds di config

Action tidak work di app tertentu?

  • Some apps block keyboard simulation
  • Try different approach (HTTP, WebSocket)
  • Check app's API/shortcuts

Lag/Delay?

  • Lower camera resolution
  • Close other apps
  • Use web mode instead of Electron

🎯 Summary:

Aplikasi ini BUKAN mainan! Ini adalah functional gesture control system yang bisa:

✅ Kontrol presentasi
✅ Kontrol media player
✅ Scroll halaman
✅ Toggle fullscreen
✅ Dan bisa di-customize untuk apapun!

Langsung coba sekarang: npm start 🚀

Butuh custom implementation? Edit src/js/actions/actionRegistry.js dan lihat DEVELOPER_GUIDE.md!