speedMath Training
- 9 Devlogs
- 14 Total hours
A website for training mental math
#9 devlog, days 10-12 (maybe?)
It’s been a while since last devlog, mostly because I haven’t had time to work with this, but also because hasn’t been any big updates.
But now it’s time for you…
to meet Calc, the mascot of the speedMath Training.
I still need to add Calc to the site. I’m also planning to make a buddy for them and together they will cheer you on.
#8 devlog, day 9
The UI is starting to look good and is much better than few days ago. Today I spent most of my time working on the main screen and a significant amount of it was used to do styles for the checkboxes.
I don’t know yet much time I want to use for this project, because it has already all the core features I have thought. I have been planning other new projects and I need time for those and I don’t have as much motivation as before for this project.
Anyways, things I will do before shipping:
-Make it more mobile friendly
-Finish styles for components
-Fix component placing
#6 devlog day 7
Today I continued working by starting to design UI. The image shows color palettes I have thought. The upper is for light mode and lower is for dark mode. I still have to figure out contrast things. I thought I’d use the green for buttons with either white or black text, but I barely could see the white text so something has to be done? Maybe other color or shadows for text.
#5 devlog, days 5-7
New updates:
- choose number of questions
- number generating fixed
- Daily challenge page
How I fixed number generating
How I tried before
Math.floor(Math.random()*(Math.pow(10,digits[0]))*Math.pow(10, digits[1]-digits[0]))
and
Math.floor((Math.random() * 10)*(Math.pow(10, digits[0]-1))*Math.pow(10, Math.ceil(Math.random() * digits[1]-digits[0])))
Where digits[0] is minimum number of digits and digits[1] is maximum number of digits
How it works now:
A function randomNumber gets number of decimals as paramater and the function is called
randomNumber(Math.round(Math.random() * (digits[1]-digits[0])) + digits[0])
Problems this fixes:
- Generating numbers with less digits that minimum
- generating different number of digits unequally (more digits was much more common)
Next thing to do:
- UI upgrade
#4 devlog, day 4
Today’s main progress happened with giving players more options to customize questions. Now it’s possible to choose how many digits they want their questions to have. Next thing to do is add question number chooser. There is only one little (big) problem with digits adjuster logic: numbers with more digits tend to be much more common because of the number generating logic. I hope I can find the solution to fix that soon.
As you can see from the picture, I added some color to the website, but just to be able to see different component better. Hopefully the final design will be much more better.
#3 devlog, day 3
Today I finally made the timer and now this project could be actually called a “game”. It wasn’t easy to code the timer and make it work as it’s supposed. For some reason updating the timer updated the questions (which happened every second), but it was easy to fix when I figured out why it happened. (Why: the state timer component uses belonged to its parent component, where the questions are created. But when I updated time in timer component, it caused parent component to rerender again too. The way to fix that was to move question creating inside its own state and that way quesions are created only once.)
When the timer finally worked, I quickly added simple navigation structure using react router library. Adding that structure required some refactoring, but I will thank myself later for doing it so early. I was also a bit surprised but happy because nothing broke when I moved some components from one to another.
#2 devlog, day2
Now I have worked on this project for 2hr during Stardance. The new feature works now: it is possible to choose which operators you want to be used (and it actually works!). I also realized that division is more tricky to implement, so that’s why I just deleted it.
I’m coding this in typescript, because I wanted to challenge myself, but it takes sometimes so long to figure right types even for simple objects. At least I learned a lot of new things, hehe.
Tomorrow
-Timer
speedMath training
-The first devlog-
Starting this project
This project is a website where you can practice your mental math skills.
The image shows how the site looked before Stardance. Before Stardance, I had only created this project(done set up, configured git) and coded < 5hr. Then I decided to continue working on this later. I feel like Stardance is a great opportunity for me to continue working on this.
I’m aware that similar projects already exist, but I feel like none of them are exactly what I want and need. For example, they have bad UI, require users to log in, or are way too complicated. So this is going to be (hopefully) different.
Next things I will do:
-add timer
-add a difficulty adjuster
Other things I will/might do later:
-improve the UI
-add a leaderboard
-add cute characters that cheer for you
