A web application that helps you visualize your keyboard usage patterns and optimize your custom keyboard layout.

Keyboard Frequency Visualizer Demo

There is an example keystroke log file included in the repository. You can upload it to see how the visualizations work.

• Upload and analyze keystroke log files
• Keylog file is processes completely locally
• Visualize key usage frequency with bar and pie charts
• Interactive keyboard layout visualization with color-coded key usage
• Get suggestions for optimizing your keyboard layout
• Support for custom keyboard layouts

• Node.js (v18 or later)
• npm or yarn

1. Clone the repository:

git clone https://github.com/yourusername/keyboard-frequency-charts-visualiser.git
cd keyboard-frequency-charts-visualiser

2. Install dependencies:

npm install

3. Run the development server:

npm run dev

4. Open http://localhost:3000 in your browser.

1. Upload your keystroke log file using the file input on the homepage.
2. View the visualization of your key usage patterns using the different chart types.
3. Check the layout suggestions to optimize your keyboard layout.
4. Use the insights to design a custom keyboard layout that better suits your typing patterns.

See <root>/__data__/keystroke.log

Contributions are welcome! Please feel free to submit a Pull Request.

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

• Inspired by the need for optimized keyboard layouts
• Built with Next.js and React
• Uses Recharts for data visualization
• Uses Three.js for 3D keyboard layout visualization