BetterDesk/screenshots

Screenshots Placeholder

This directory contains screenshots of BetterDesk Console for documentation purposes.

Required Screenshots

For the README.md, please add the following screenshots:

1. dashboard.png - Main dashboard view showing:

   • Navigation bar with logo and stats
   • Four statistics cards (Total, Active, Inactive, With Notes)
   • Device list table
   • Search functionality

2. devices-list.png - Device management view showing:

   • Complete device table with multiple entries
   • Mix of online/offline devices
   • Device notes
   • Action buttons (connect, info, edit, delete)

3. device-details.png - Device details modal showing:

   • Device ID
   • UUID
   • Public Key
   • Status badge
   • Note
   • Created timestamp
   • Additional metadata

4. mobile-view.png - Mobile responsive view showing:

   • Adapted layout for mobile screens
   • Hamburger menu (if applicable)
   • Touch-friendly controls

How to Create Screenshots

Using the Demo App

cd web
python3 app_demo.py

Then open http://localhost:5001 in your browser.

Taking Screenshots

Recommended Settings:

• Browser: Chrome/Firefox (latest version)
• Window Size: 1920x1080 (for desktop) / 375x667 (for mobile)
• Zoom: 100%
• Theme: Dark mode enabled

Tools:

• Built-in browser screenshot (F12 → ... → Screenshot)
• macOS: Cmd+Shift+4
• Windows: Win+Shift+S
• Linux: Flameshot, GNOME Screenshot

File Naming Convention

Use lowercase with hyphens:

• dashboard.png
• devices-list.png
• device-details.png
• mobile-view.png

Image Requirements

• Format: PNG
• Max size: 2MB per image
• Compression: Optimized (use TinyPNG or similar)
• DPI: 72 (web)

Privacy Note

The demo app (app_demo.py) generates fake data to protect real device information in screenshots.