I am working on a game and while I have a lot of it working (just need a lot of design work) I came across an issue. I am writing a word guessing game where you get a number of words, you are given the first and last letter, then have to fill in the rest from a collection of letters below the puzzle. The problem is there are more letters than there is space available. Pictures describe it better:
You can see in this photo everything fits nicely. The goal is to drag the letters from the bottom to the words above to finish the words. This is EASY mode (5 words, 5 letters each). Hard mode is the problem:
With seven 9 letter words, there are too many to fit in the screen area. If there is a way to make the area with the letters scrollable that would be best. Otherwise I will have to change the layout of the page. This is formatted for Mobile (720*1280).
I have been searching these forums, the WIKI and Google but either it isn’t possible, or I am not sure how to build the search query. Anybody have any thoughts?
That seems pretty tight for a touch screen. What if, if there are multiple tiles of the same letter you stacked them? You could either show them slightly staggered or place a small number next to the tile or within it to show how many of that letter are in the stack.
I actually reworked the screen some to get everything on the screen. No stacking, just multiple tiles when there are multiple letters. Right now if there are multiple letters close to each other in words it drops the letter in the first one in the collision group. I’m still working on that logic but it does work.
This is what it looks like as you place letters. As a letter is correctly placed it becomes faded (lowered opacity) and you can no longer drag it. If you try to place it in the wrong place it just drops back to its original place