Drag-And-Drop Puzzle: Disabling Correct Pieces

Hi Becky,

Wow - alot going on in that slide for sure!

So, #2 first - and hopefully this is easy to fix.
Your puzzle pieces and drop rectangles are all different sizes! That means that even though they are snapping to the center of each drop area, the draggable shapes will never line up.
Also, all the drop rectangles are not aligned perfectly in a grid. They need to touch each other perfectly to the pixel.
To fix this, I would use something like Photoshop to cut up the 9 lemon shapes perfectly.. ensuring they are all exactly the same size. Then use these same 9 images for the actual drop areas too - just make them transparent so they are invisible to the user.
That way, you save a bit of work, but also ensure absolutely precision for the width and height of each item.

And for #1 - use states for this. Have a state on each of your lemon images for DROP CORRECT. For this state make the lemon piece completely transparent, or missing, or tiny tiny (like 1x1 pixel) The idea here is to make it disappear and not be clickable again.

Now that they actual draggable lemon piece is invisible when correct, you can have another 9 pieces of the lemon in their correct locations. These should all start as HIDDEN state.

Finally, when one of the draggable items is dropped correctly, and made invisible, now make the hidden lemon piece visible. This will look like the lemon has been dropped in location, and is now no longer selectable.

Does that help at all?