TYPEX V2

HELLO THERE!
Had a really fun session working on TYPEX today. I shipped two new features that I think make the app a lot more useful! ( they took me lot of time and effort )

The first one is a key accuracy heatmap. It tracks which keys you miss most across all your tests and draws a colour-coded keyboard in the Stats tab, green for keys you’re nailing, amber for shaky ones, red for your problem keys. It even calls out your worst key and gives you a tip on the finger movement. Took a few tries to get the layout looking clean but I’m happy with where it landed.

The second is a daily challenge. Every day there’s one text and you get 90 seconds to type it. Your streak builds up the more consecutive days you complete it that’s how you improve :)

Excited to keep building on this. Next up I’m thinking a ghost race mode where you race your own best run, and maybe an XP system. Stay tuned! and HAPPY CODING!

HEY THERE AGAIN!
still working on TYPEX haha, I tried to improve it in general and I added a new cool feature: SHARE A DOWNLOADABLE PICTURE OF YOUR RESULT!

I used the JSZip library for this, and it was cool since it’s my first time know a js library like this
after downloading the zip file, and extracting it, you can play the game offline on your device and why not improve it’s code, it’s an open-source project :)

HAPPY CODING!

Building TYPEX v2 further into a portable tool, I just added a feature that allows users to download the entire interface as a single, compressed ZIP file.

by automating the bundling of the HTML, neo-noir CSS, and the core JavaScript engine, I’ve made the terminal experience fully offline capable!

This move ensures that the “system boot” sequence and particle-driven typing environment remain accessible anywhere, reinforcing the project’s identity as a self contained, high-performance developer utility

HAPPY CODING

Started with a solid typing speed app and spent the session leveling it up across the board.
✦ Live WPM Graph YAY!!
Added a real time canvas graph that renders inside the arena while you type updates every second, shows your speed curve as it happens
✦ Mobile Experience:
Typing on phone was broken., tryed to fix it with a hidden input that captures the keyboard, made the HUD a proper grid so it never wraps, and made all chip groups horizontally scrollable. Tap targets got bigger too.
✦ Design Polish
Kept the neo-noir terminal vibe but elevated everything — CRT corner brackets on HUD cards, animated accent sweep on the arena when typing, diagonal shine on buttons, corner-cut logo bevel, deeper shadows throughout.
✦ Light Mode Redesign
The old light mode was just a cold blue-grey inversion — looked bad. Rebuilt it from scratch as a warm parchment theme with ink-dark text and a proper deep forest green replacing the neon acid.
✦ Focus Mode
New fullscreen mode (press F or the square button in the top) that strips everything away … just the words, stats, and graph. Clean, distraction-free. ESC to exit. Fixed several bugs where backspace and typing weren’t syncing correctly between the main view and focus view.
✦ PWA Offline & Installable ( I tried but sometimes it doesn’t work ;-; ) Progressive web app ig

HAPPY CODING :)

I fixed some code, optimization, and stuff
planning for the next big features, ideas and functions
I tried to make the code smaller and the website smoother

TYPEX is getting bigger and planning to make it a downloadable app from the browser, like youtube

TODAY, I BUILT AN AMAZING PROJECT THAT I’M GOING TO USE EVERYDAY!
Building TYPEX v2 (yes I built v1 you can check it on my github) was an exercise in merging high performance utility with a specific neo-noir terminal aesthetic (I LOVE IT :) I focused on creating a typing interface that feels like a piece of high tech equipment, integrating a custom canvas based particle system for tactile feedback and a “system boot” loading sequence to handle asset initialization smoothly, I enjoyed styling this project and claude helped a lot hahaha, by balancing pure JavaScript logic for real-time WPM tracking with heavy CSS animations and scanline effects, I managed to ship a tool that transforms a standard speed test into an immersive, cyberpunk experience!

while coding I faced a probelm with the live server extention on vscode, lol I was doing everything and not seeing any result on the browser!

Finally, I completed and shipped a project that I am proud of!
As always HAPPY CODING!