ABC Jigsaw Puzzles for Kids

Game/Demo Showcase
#1

Hi,

Below my game “ABC Jigsaw Puzzles for Kids”.
I used libraries:

  • cocos2d-x - thank you guys!
  • OpenCV
  • boost

Most apps use jigsaw piece templates to cut image. In my app every puzzle piece is always randomly generated.
In advance thank you for comments and suggestions.

Below app description:

ABC Jigsaw Puzzles for Kids! Free jigsaw puzzle game helps your kids develop matching and motors skills. It is fun and education learning game for youngest, preschool children. Very simple and responsive interface, pleasant music will keep your kids enjoy while learning. Friendly bee is always open to help - just touch it.

Here’s what this jigsaw puzzle game has to offer:

  • set of beautiful HD pictures with alphabet
  • 5 different puzzle sizes: 6, 9, 12, 16, 20
  • every puzzle piece is randomly generated
  • sweet bee helps solving puzzle, just touch it
  • simple and intuitive child-friendly interface
  • high quality graphics and animations
  • nice background music
  • works perfectly on all Android tablets and phones
  • And last but not least ###All kids jigsaw puzzles are available for FREE###

Once kids complete puzzle, the game congratulates the child and gives them balloons or flowers with sweets for bee. Children enjoy success, they want to keep learning and playing. The game is available for free on Google Play ( https://play.google.com/store/apps/details?id=com.crazyhappygame.letterjigsawpuzzlesforkids).

Regards,
Bozena

#2

Hi,

Could you comment what you used OpenCV for?

Chees.

#3

Hi,

I used OpenCV to cut pieces from image.

I know there are possibilities to do it in cocos2d-x but for:

  1. Clipping Node - fps decreased with number of pieces
  2. RenderTexture - pieces were distorted on the border

I am happy with OpenCV performance and code simplicity. I have a plan to use OpenCV for next project as well.

Regards,
Bozena

#4

Ah, that’s great.

Could you explain how you cut the pieces with OpenCV? Did you follow a pattern image or something?

By the way nice game!

Cheers.

#5

Hi,

  1. Generate random piece mask
    Every piece is generated as polyline with 4 splines (top, bottom, left, right) ( https://en.wikipedia.org/wiki/B-spline ). Spline points are randomly generated. So pieces are always different. (That part was hard but very interesting … :wink: )

  2. Cut piece
    image.copyTo(result, mask);//one line in OpenCV
    ( http://docs.opencv.org/modules/core/doc/basic_structures.html#mat-copyto )

Regards,
Mariusz

1 Like
#6

Thanks a lot for the insights. It is always nice to learn some more little things :smiley:

Cheers.

#7

Hello CrazyHappGame,
I have some questions for you: :slight_smile:

  1. Could you explain how to blur piece (a shadow background in piece) in your game?
  2. What features that BoostC++ use for ?
  3. OpenCV:
  • How to create cv::Mat with PointArray (with generated spline control points)

Thanks for your support!!!
Regards,
Duy