3 ms·
Looks like the Tetris pieces aren't aligned to the canvas pixel grid, causing unnecessary antialiasing. This causes the piece borders to look eternally blurry.
by jancsika 3y ago
Looks like the Tetris pieces aren't aligned to the canvas pixel grid, causing unnecessary antialiasing. This causes the piece borders to look eternally blurry.
To fix it, you should add a "cleaning cloth" app that the user can drag and drop onto the Tetris canvas that moves the pieces horizontally by 0.5 pixels.
Or even better, only move the pieces that intersected with the cleaning cloth. :)
- zamadatix 3y agoCSS should have a way to handle all offset properly at some point https://www.w3.org/TR/css-values-4/#round-func https://www.w3.org/TR/css-values-4/#round-func but until then you can use JavaScript to automatically get the correct offset.