A Figma plugin that automatically tracks your design time and sends it to Hackatime, helping you understand how much time you spend designing.

• Automatic Time Tracking: Tracks your active design time in Figma
• Smart Activity Detection: Only logs time when you're actively working
• Project-Based Tracking: Automatically detects and tracks different Figma documents
• Real-time Heartbeats: Sends activity data every 30 seconds when active
• Network Status: Shows online/offline status and auto-reconnects
• Auto-save: Settings are automatically saved as you type
• Privacy Focused: Only tracks time and project names, no sensitive design data
• Clean UI: Beautiful, minimal interface that matches Figma's design language

1. Open Figma
2. Go to Plugins → Browse all plugins
3. Search for "Hackatime"
4. Click Install

1. Clone this repository:

   git clone https://github.com/basanta-bhandari/Hackatime.git
   
   cd Hackatime

2. In Figma, go to Plugins → Development → Import plugin from manifest

3. Select the manifest.json file from the figma-plugin directory

1. Visit hackatime.hackclub.com
2. Create an account or sign in
3. Go to Settings and copy your API key
4. In Figma, open the Hackatime plugin
5. Paste your API key
6. Click "Test Connection" to verify
7. Click "Start Tracking" to begin tracking your design time

• Requires HTTPS connection
• Needs access to *.hackclub.com domains
• Will show online/offline status in the plugin UI

3. Select the manifest.json file from this project

1. Get Your API Key:

   • Visit hackatime.hackclub.com
   • Create an account or sign in
   • Go to Settings and copy your API key

2. Configure the Plugin:

   • Open the Hackatime plugin in Figma
   • Paste your API key
   • Test the connection
   • Click "Start Tracking"

3. Start Designing:

   • The plugin will automatically track your time
   • View your stats on the Hackatime dashboard

The plugin tracks your activity by monitoring:

• Selection changes in your design
• Page navigation
• Document switches
• Mouse/keyboard activity

It sends a "heartbeat" to Hackatime every 30 seconds when you're actively working, ensuring accurate time tracking without interrupting your workflow.

• API Key: Your personal Hackatime API key
• Server URL: Hackatime server (default: https://hackatime.hackclub.com)

[settings]

api_url = https://hackatime.hackclub.com/api/hackatime/v1

api_key = YOUR_API_KEY_HERE

heartbeat_rate_limit_seconds = 30


# Optional settings

debug = true

default_project = MyProject

hide_filenames = false

hide_project_names = false

hostname = my-computer

This plugin respects your privacy:

• Tracks only time spent and project names
• No design content or file data is sent
• No screenshots or visual data collected
• Open source and transparent
• No personal files or design details transmitted

The plugin sends only these data points:

• Timestamp of activity
• Project/document name
• Editor type ("Figma")
• Operating system
• Session duration
• Activity category ("designing")

├── manifest.json       # Figma plugin manifest
├── script.js          # Main plugin logic
├── index.html         # Plugin UI
├── hackatime.cfg      # Configuration template
└── README.md          # Documentation
ion

1. Make your changes to the code
2. In Figma, go to Plugins → Development → Hot reload plugin
3. Test your changes in Figma

No build process required - Figma loads the files directly.

The plugin uses the Hackatime API v1 endpoints:

headers: {
   'Authorization': `Bearer ${apiKey}`,
   'Content-Type': 'application/json'

}

{
   "time": 1640995200,           // Unix timestamp
   "project": "My Design File",  // Figma document name
   "language": "Figma",          // Always "Figma"
   "editor": "Figma Desktop",    // Editor type
   "operating_system": "MacOS",  // User's OS
   "machine": "figma-user",      // Machine identifier
   "user_agent": "Figma Plugin", // User agent
   "branch": "main",             // Default branch
   "entity": "My Design File",   // File entity
   "type": "file",               // Always "file"
   "category": "designing"       // Activity category

}

• Check your API key is correct
• Ensure you have internet connection
• Try refreshing Figma

• Make sure you're actively working (moving mouse, making selections)
• Check the plugin status indicator
• Verify your API key in settings

• Verify the server URL is correct
• Check if Hackatime service is online
• Try testing the connection in plugin settings

Contributions are welcome! Here's how to help:

1. Fork the repository
2. Create a feature branch: git checkout -b feature-name
3. Make your changes
4. Test in Figma
5. Submit a pull request

• Use modern JavaScript (ES6+)
• Follow existing code formatting
• Add comments for complex logic
• Test thoroughly before submitting

This project is licensed under the MIT License - see the LICENSE file for details.

• Email: [email protected]
• Issues: GitHub Issues
• Discussion: Hack Club Slack

• Built for Hack Club's Hackatime service
• Inspired by the original WakaTime for code editors
• Thanks to the Figma community for feedback and testing

• Initial release
• Basic time tracking functionality
• Figma plugin UI
• Hackatime API integration
• Auto project detection

Made by Basanta Bhandari

Track your design time, level up your productivity.