Close
Typing Test

Typing Test

A look into the new typing test feature, focused on aesthetics, performance, and user experience.

Building a Typing Test Inspired by Monkeytype

I recently built a new typing test feature for this site, heavily inspired by the clean, minimalist aesthetic of Monkeytype. The goal was to create a typing experience that isn't just functional, but also visually satisfying and enjoyable to use.

Accidentally low-key vibe coding — built casually, without pressure, and somehow it just worked. 🫠

Core Features

The test is designed to be simple yet powerful:

  • Multiple Languages: Supports English, Indonesian, and Sundanese.
  • Time Modes: Test your speed in 30, 60, or 120-second bursts.
  • Live Statistics: See your WPM (Words Per Minute) and Accuracy update in real-time as you type.

Design & Experience

Aesthetics play a huge role in how a typing test feels. I implemented several visual touches to enhance the experience:

  • Responsive Layout: A focused "bento-style" interface that fits perfectly with the rest of the site.
  • Interactive Feedback: Characters "pop" slightly as you type them, giving a tactile feel to the digital keyboard.

Fun Twists

To make it more personal (and a bit cheeky), I added a "Roast System". If you go AFK for too long or your accuracy drops too low, the app might just call you out on it!