Gaming Skill Trainer
- 12 Devlogs
- 53 Total hours
Do you suck at video games? No? Well this skill trainer will improve your skills anyway.
Do you suck at video games? No? Well this skill trainer will improve your skills anyway.
Yet more QoL changes. I think the project is close to or already ready for shipping, but I’m so paranoid about whether it is good enough or not that I’ve been delaying it for a LONG time.
This time, I first centralized all the text on the resources and help pages, and also cleaned up the styles.css file a bit. And by a bit, I mean a lot, since that thing was a literal like dumpster fire. Still kinda is, but it’s better than it used to be.
In an attempt to improve the user experience, I also added a link to the help page on every single page (except for the resources page). The question mark design probably could’ve been made in HTML and CSS with relatively low effort, but I decided to make the icon in krita anyway.
This will either be the last devlog before I ship, or I will delay shipping for another like week or something idk.
I made a lot of QoL changes like removing some console logs, adding more words to the word bank, and cleaning up the UI (hopefully).
I also added a help page (I had to type all of that myself), which is why it took me four hours. It’s not even that good of a page, I just had to type a lot of stuff manually. So much for fast typing speed.
I added a typing trainer, and it was actually pretty fun to implement. I mean, apart waking up and trying to figure out what the hell the code I wrote last night means. Initially I was going to make like a “tape” structure, when the words scroll across the cursor. Because I centered the entire thing, it automatically made the cursor scroll across the test instead. I decided that it was good enough.
Essentially, I made the the program by making a paragraph element. I changed it with innerHTML to contain the letters that’s already been typed, a blue cursor, and the letters that are yet to be typed. The letters (words actually) are generated from a text document that the JavaScript reads. And like when you press the correct key, the letter moves from the untyped side to the typed side.
(Speaking of typing, I’m so used to using Vim that I keep pressing hjkl, i and o on everything.)
(IDK why I’m typing so slow in the video, I usually type at around 90-100wpm)
I made a bunch of QoL changes to make the site closer to shipping. First, I added a resources page so that people without skills can learn skills. Then, I added the ability to use buttons to select the keys in focus mode, to help mobile and touchscreen users. I also removed the background turning grey in the timing trainer and timer. I also changed the timer location in the Alt Spam and CPS Trainers for parity.
I finally made the keys move.
I feel like I didn’t give enough context on the last devlog. So the “focus mode” I added is a web page where you have to follow one of 8 keys as they shuffle around and stuff. This is based on the ending of Mindcap’s Geometry Dash extreme demon megacollaboration LIMBO. I’ve had the idea of recreating it for like a month now, and I finally did it.
So I was writing an entire function with like linear algebra and stuff, and I was fully committed for like an hour and got it somewhat done. Except that it didn’t work. So I asked deepseek because I had no idea what to do and I discovered that I can use CSS to do the same thing for like 20 times easier. I didn’t even know that CSS could make stuff move but whatever. (enjoy the showcase.)
I also added a system to use keys 1-8 to pick the keys at the end, and if you get it wrong, uh… try it and find out.
I added a focus mode for the gaming skill trainer.
Essentially, I had to write code for starting the program, moving the keys around, and selecting a key at the end (still a work in progress).
Since this is based on the Geometry Dash level LIMBO, the “keys” aren’t actually supposed to be colored when they’re moving, but I had to have an indicator that they’re actually moving before I add the animations.
I use Linux, and the Linux distro I use (Arch btw) doesn’t come with a timer. So I guess I was just needing an excuse to make a timer. It does qualify as something a gamer might want, and also the timer tries to help your eyesight, and a somewhat functional eyesight is definitely beneficial to gaming. And like also about everything else.
This was somehow actually harder than I thought. I expected to it to take me like maybe an hour, but it took like 4. (The other 1 came from making improvements to the timing trainer). The timer is 20 minutes (because of the 20-20-20 rule), and can be paused, restarted, and resumed.
So turns out that I was correct and I did not get the timing trainer done in two hours (as you can see, it took me 4).
The program works now. I completely rewrote the program’s code, which probably isn’t the best way to deal with code that absolutely sucks but whatever. Essentially, when the program starts, a circle moves across the screen repeatedly. Every time the circle moves across the screen, you have to hit it just as it crosses the line in the middle of the screen. I was testing the proram with my trackpad, and since it’s like delayed by A LOT, I had to click like a full 100 milliseconds before the circle reaches the line in order to be accurate. That’s why I added ability to use keyboard also. I mean, that’s probably not the entire reason, but yeah.
I also wrote 3 entire functions to get accuracy, remove any suffixes to numbers, and get the dimensions of the screen. They were actually pretty fun to make. I might consider creating like a library or something in the future to make people’s lives easier.
I tried to add 2 features. They’re not done, but the message telling me that I need to post a devlog soon is giving me anxiety.
The two features I tried to add are a focus trainer and a timing trainer.
The focus trainer involves 8 rotating “keys” inspired by the Geometry Dash level LIMBO’s ending. You have to follow a key that’s randomly selected in the beginning as it moves and shuffles around. At the end, you have to identify the correct key. Right now, the keys are there and can be rotated and positioned, just not like actually moved.
The timing trainer involves clicking the mouse as soon as a circle touches a white line, and giving you points depending on how close you are to perfection. The circle is there, but it doesn’t move yet.
The problem is that I lowkey will not get the two things done within 2 hours, so yeah.
I added a trainer for alt spam and spamming with keyboard. For those who don’t know, in Geometry Dash, alt spam is when you click with two separate fingers on two separate hands usually, so that you can get twice the FPS. And in osu! it’s like when you click with 2 fingers to click faster I think I don’t really know that much about osu!.
I did spent some time trying to implement a typing speed test, but eventually just gave up and scrapped the idea altogether.
I lowkey kinda suck at video games, so I made a skill trainer to get better. I can’t click fast enough, my aim sucks, and my reaction time is higher than… what I would like it to be (can’t thing of something good, sorry).
I can’t click that fast. There’s Hypixel bedwars sweats that can click at 30 CPS with one finger, and I can only click at 11CPS with two. I guess I could go on a testing website, but they have ads and I really needed to make something for Stardance.
My aim sucks. How did I come to this conclusion? Well, it took me 10 seconds to click a randomly teleporting circle 16 times. I mean I don’t think it’s that slow, but I can definitely be faster.
I’ll add more features later, but so far it’s only these two.
bro my mouse broke and i can’t even scroll lol