DEV Community

Cover image for What do you think of my HTML5 game?

What do you think of my HTML5 game?

Shubham Jain on March 31, 2022

Past two weeks, I have been working on an HTML5 puzzle game: Eight Colors. The rules of the game are pretty simple but it does get a little challen...
Collapse
 
diballesteros profile image
Diego (Relatable Code)

The look and feel is nice! Especially the added sounds. Makes it feel "clicky" which is a good thing. Good job.

Collapse
 
jonrandy profile image
Jon Randy 🎖️ • Edited

Very hard to use on mobile as the screen scrolls when you swipe up and down - making it very hard to make vertical shifts. I also found that the page would sometimes go into a 'pull down to refresh' when trying to shift a column downwards.

On desktop, a better control system would probably be arrow keys to move and shift+arrow keys to shift the rows and columns

Collapse
 
shubhamjain profile image
Shubham Jain

Screen shouldn't scroll. Can you tell me your mobile browser?

Collapse
 
jonrandy profile image
Jon Randy 🎖️ • Edited

Won't even load on Chrome right now - gets stuck in a redirect loop. Had this happen on Firefox too (desktop). Something seems amiss

Thread Thread
 
posandu profile image
Posandu

Hmm. It works fine for me in Firefox

Thread Thread
 
jonrandy profile image
Jon Randy 🎖️

I've had the redirect loop thing a few times on both browsers. Hard to reproduce though

Thread Thread
 
posandu profile image
Posandu

oh

Collapse
 
jonrandy profile image
Jon Randy 🎖️

Firefox

Thread Thread
 
shubhamjain profile image
Shubham Jain

And your phone model?

Thread Thread
 
jonrandy profile image
Jon Randy 🎖️

Google Pixel 2

Collapse
 
kspeakman profile image
Kasey Speakman

It looks great and is fun! Couple of UX suggestions:

On my window configuration (1 window in each corner, 4 total, on a 4k monitor), controls were below the view port and no scroll. Possible resolutions.

  • Allow vertical scroll, seems like this would be required for mobile anyway
  • Move controls to side if space available
  • Change layout to use less space

When it loads the next puzzle, there should be a transition. Some noticeable change on the puzzle area. Could be an quick animation or just resetting the highlighted row/col back to default. It took me a second to realize the puzzle was different after I hit next puzzle.

Touch/mouse controls. Example: when the mouse hovers over a piece, that should be the highlighted row/col. When they drag, that should be the direction the row or col moves. I'm sure I would get used to the keyboard controls if I played a lot, but they were awkward for me. Even up to the finish I was mistakenly shifting a row/col before I selected it. Even as a keyboard/mouse gamer. Once you get mouse controls working, there won't be a need to display the row/col highlights unless someone starts using the kb controls.

Make the timer optional. For me puzzles are relaxing. Nothing kills that like a timer. When the timer is off, use alternate scoring goals like minimum number of moves. It's probably a good idea to do multiple goals anyway to cover different kinds of players.

In all this is a great game with a lot of potential. I can imagine larger grids, wild card colors, fixed pieces that can't be moved. And other kinds of mechanics to keep the puzzles interesting. I'd probably spend too much time playing it.

Collapse
 
shubhamjain profile image
Shubham Jain

I have made fixes that should address most of the issues you listed. Thank you for the feedback.

Regarding timer optional, I will look into it.

Collapse
 
auroratide profile image
Timothy Foster

The game is fun and looks really good! I suggest adding the #showdev tag as well, as it's meant for showcasing cool things you've built.

My biggest feedback is it would be cool if you could manipulate the grid with the mouse kind of like how you can swipe on a phone.

Collapse
 
shubhamjain profile image
Shubham Jain

Thank you, I have added the tag. Regarding mouse controls, it will get tiring very quick to move the mouse around and clicking and dragging. Keyboard controls do take some time to click, but they do.

Collapse
 
moses_110_94_111 profile image
Moses

good to see you made all those different functionalities with html. later i will look at your code and steal some of it.

as a game. i dont play that. it is too difficult and time wasting.

works well on safari, ios, ipad. tested.

Collapse
 
akhilesh286 profile image
Akhilesh286

👍🏻👍🏻👍🏻👍🏻👍🏻 very nice game i like it

Collapse
 
stephd profile image
DepSteph

I liked it, but it's hard to use on the french AZERTY keyboard as WASD isnt at the same position. It make it hard to move column or row

Collapse
 
shubhamjain profile image
Shubham Jain

I have pushed an update that allows more flexibility around controls.

Collapse
 
stephd profile image
DepSteph

Woaw, that already more easy. It's not very instinctive for a first try but it could be okay over time

Collapse
 
lexlohr profile image
Alex Lohr

Sometimes, one of the bubbles vanishes. Otherwise, nice one.

Collapse
 
shubhamjain profile image
Shubham Jain

Does it happen on Phone/desktop? Any way to reproduce?

Collapse
 
lexlohr profile image
Alex Lohr • Edited

Chrome 100 on Android. It's an intermittent issue; I've only seen it happen on the outer border. Is it open source?

Collapse
 
ismaestro profile image
Ismael Ramos 🚀

Nice work!! You have to implement some sort of stats window! I want to know who is the best player and maybe add users some punctuation?

Collapse
 
thomas_sweet profile image
Thomas Sweet

Really awesome! Very well implemented! Well done!
Look and feel is super smooth!

Collapse
 
ssaxkxuqmyveilg profile image
55

Played in desktop, fun to play :)

Collapse
 
klausdonnert profile image
Klaus Donnert

Fun puzzle. The controls on PC feel awkward. I'd prefer arrow buttons on the rows and columns or click and drag

Collapse
 
rodrigoodhin profile image
Rodrigo Odhin

Very nice game!
I'm on Brave on mobile and everytings looks very good.
Congrats!

Collapse
 
lukeecart profile image
Luke Cartwright

Very nice game, I'm on a macbook in chrome and the instructions don't show up at the bottom.
Very smooth animations aswell.

Collapse
 
azlan_syed profile image
Azlan-Syed

can you please elaborate the rules ?

Collapse
 
dendihandian profile image
Dendi Handian • Edited

Great game! I stopped at level 7 😅 cause I didn't have enough time to spare.

I thought this is wordle-like inspired game, but it actually inspired by rubik cube.

Collapse
 
shubhamjain profile image
Shubham Jain • Edited

The mechanics are sort of similar to Rubik's cube I guess but the game is inspired from a lesser known NES game I used to play - James Bond Jr. I don't know if it's just similar to any other game made in the past. 15 Puzzle comes close.

Collapse
 
rezatalebi05 profile image
Rezatalebi05

Its look clean! Good work

Collapse
 
sarahcodes_dev profile image
Sarah 🦄

Played on chrome. Looks really nice. Transitions are smooth and the audio gives it the perfect tactile illusion. Nice work!

Collapse
 
siddsarkar profile image
Siddhartha Sarkar

Player upto 17 level on first go, enjoyed it. 👍 cheers

Collapse
 
brainuso profile image
brainuso

I enjoyed it. It's verry simple and the sound is really good feedback. I made a few mistakes in moving stuff around but learnt quickly.

Collapse
 
acode123 profile image
acode123

How do you play it?

Collapse
 
notengoid profile image
Tomas Carrillo

Nice game, on Chrome there is a bug when moving last column up. Best wishes :)

Collapse
 
gloriamaldonado profile image
Gloria Maldonado ✪

Wow, I like it.

Collapse
 
didof profile image
Francesco Di Donato

Amazing job, loved it!!

Collapse
 
john4650hub profile image
JohnDelvin

It's great

Collapse
 
ruvaleev profile image
Ruslan

It seems something goes wrong. One of the circles has disappeared

Collapse
 
svmarinez profile image
Sara Vasquez

My screen is on dark mode and it was really difficult to see which row I was on, so maybe a higher contrast on the row?

Collapse
 
kasuken profile image
Emanuele Bartolesi

well done!
it's really fun and addictive!

Collapse
 
ben profile image
Ben Halpern

This is really fun! Could be addictive :P

Collapse
 
princeniyonshuti profile image
Prince_Np

its amazing and awesome

Collapse
 
aprmintacpineda profile image
April Mintac Pineda

Wow that's actually really nice! Well done!

Collapse
 
orion3d profile image
Orion3D

Great job, It's missing a leaderboard for each level so we can compete with others :)

Collapse
 
phyllisgreene profile image
PhyllisGreene

Which is the best HTML5 Games to play on tablet ? prayer to break up a relationship