Voronoi Tapping, and Other UX Tweaks
Hey Folks! I have a potentially exciting-yet-boring update in the works for mobile: voronoi tapping! A.k.a. more forgiving tapping on small items.
The way tapping works on mobile right now is that it checks to see if your tap was within an item's bounds. This works really well on desktop, where the cursor is visible and highly accurate/precise. Touchscreen, on the other hand, is more sloppy. It's hard to gauge where a finger tap will register, and this gets really bad on small items like the 1x1 lighter. (See image above, for some examples of tap point vs. item selected.)
And this is where voronoi comes in. Basically, instead of checking tap point against strict item bounds, we check every item on the screen to see which item was closest to the tap. Then, we assume that's what the user meant.
The up side to this method is that the user can be slightly off from an item and it still registers. In fact, when a small item is next to a large item, the user can even tap slightly inside the larger item, and the smaller item is targeted. The game only cares which item's center is closest, not the edge. Perfect for small screens (and fat fingers).
The down side is that there are some edge cases that need to be handled. For one thing, tapping in the middle of nowhere will still select an item if you don't add limits to voronoi. So I had to set a maximum distance in the code beyond which taps should be ignored for an item. (E.g. if you want to tap empty space to clear a selection)
Another problem is the way the game's paper doll works. Every item on the paper doll has the same position and size, and they just layer with transparency to create the doll. This means every hit on the paper doll registers whatever item came first in the checked items. So for that, I left it the old way, which requires bounding box hits. I did, however, add one additional check to paper doll hits to use the gray doll silhouette if the item comes back as a miss. This gives smaller paper doll items one extra chance to succeed per user tap, and usually is enough in places where it matters (small items like those on wrists, hands, and necklace).
Lastly, I made a slight change to the pop-up tooltip such that you can now close it by tapping anywhere outside the tooltip. Previously, you had to tap empty space to clear it. (Tapping another item did nothing.)
I'm a little surprised at how well this worked for how easy it was to add. But assuming no more issues are found in testing, we should have a pretty marked improvement in the user experience with touchscreens!
That's all for this week. Have a good weekend, all!