A jigsaw puzzle

Show us your completed creations made in Construct 2

Post » Sun Apr 28, 2013 11:28 pm

Hi!

I've done a small jigsaw puzzle using Construct. I want to show it here:

Game: http://www.apagada.com/varios/jigsawpuzzle/

Source: http://www.apagada.com/varios/jigsawpuzzle/puzzle12x9.capx

The source allows adding additional images by changing the XML. The change can be done in the server (without re-compiling), but to do so you have to touch the "offline.appcache" file (I use to change the version comment, but adding some text at the end could work).

I have used the unofficial "canvas" plugin. Otherwise I had put the file in the arcade.arcalaus2013-04-28 23:31:58
B
39
S
11
G
5
Posts: 132
Reputation: 8,228

Post » Mon May 27, 2013 10:16 pm

Hi!!

I like a lot your example, and I want to use it for my class (I'm teacher)
But when I try to import it, I can make it run.

I try desktop, Web, but nothing.
Do you know why this happen?
Thanks a lot. Great Work!!

Greetings from Mexico
B
6
S
1
Posts: 28
Reputation: 906

Post » Fri May 31, 2013 4:11 pm

Hi!

I'm also a teacher, de hecho un profesor de lengua espaola (but I'll continue this thread in English since that's the language of these forums).

This app needs r0j0hound's "canvas" plugin: http://www.scirra.com/forum/plugin-canvas_topic46006.html

Also, it is likely to have more than 100 events (so a registered version of construct2 is needed). If it is the case, tell me and I'll make a smaller version for you.

Send me a PM if you want to continue this conversation in Spanish.arcalaus2013-05-31 16:12:11
B
39
S
11
G
5
Posts: 132
Reputation: 8,228

Post » Fri May 31, 2013 4:18 pm

Good one!

Also I speak spanish after all, your project impressed me, I would love to see smaller version.
B
96
S
25
G
20
Posts: 3,052
Reputation: 22,638

Post » Fri Jun 07, 2013 10:27 pm

Hi Joannes!
I'm glad you liked this game!

I have checked the (slightly smaller) version of this app I put on http://github.com/jgmy/jigsawpuzzle_phonegap and it is a bit smaller.

In case you don't feel comfortable using GIT (and don't want to download the big 12Mb full source with many redundant files), download this:

http://www.apagada.com/varios/JigsawPuzzlePhone/

I also have some older versions in my web, just in case you only want to know how the puzzle is made.

The algorithm is simple:
-First I divide an image in pieces. Each piece has a central part (its size is the size of an average puzzle piece center part) and a margin (its size is the maximum size of the puzzle piece). Pieces "overlap" at the margins.

-I use the "canvas" plugin to mask the puzzle piece, so "holes" are created into it (and most margin area removed).

-I also put instance variables marking the logical X and Y of the piece.

-A unique group id is also given to each piece.

-I use "drag" instead of "click" or "touch" for all, so I don't need cheking whether mouse or touch are being used.

-When one piece is "drag", all pieces of the same group are pinned to it.

-When the piece is "drop", all pieces of the piece's group are checked against all desired neighbours (i.e. piece (4,7) looks for (3,7), (4,8)...). If the desired neighbour is where it should be (within a small range of 5 pixels), the piece is aligned and added to the group, so it seems to "snap".


Hope you understand the above text. I could try to make a video, but I don't have much time to do it.
B
39
S
11
G
5
Posts: 132
Reputation: 8,228

Post » Sat Jun 08, 2013 11:43 pm

I tried this in Google Chrome, and it messes up the lay-out of your game I think, since the timer, option button, etc. were scattered all over the place along with the jigsaw pieces.

Looks like a solid game, but it runs quite slow in my browser for some reason.

I hope this was helpful and keep up the good work!
B
6
S
1
Posts: 10
Reputation: 430

Post » Tue Jul 02, 2013 9:20 am

Sorry for the late response. I've been busy this month.

I'm sorry it didn't work for you, Peralta (another Spanish speaker?). The game uses WebGL bur I've run it successfully in a single-core Pentium (I think it was a Pentium IV, but I'm unsure). I tested the game mainly in Chrome, and I have it in the chrome store, indeed. But there exist a chance I left a bug on one of the downloadable versions.

Which version did you test?

Game: http://www.apagada.com/varios/jigsawpuzzle/
Source: http://www.apagada.com/varios/jigsawpuzzle/puzzle12x9.capx
Phone source: http://www.apagada.com/varios/JigsawPuzzlePhone/
GIT phone source: http://github.com/jgmy/jigsawpuzzle_phonegap

GIT phone source is the latest, but there exist a chance I left a bug on it. Also, don't use the "phonegap" version of the GIT phone source, use the cocoonjs instead.

ALSO if you are exporting it from source, don't minify source. This project don't work when source is minified.arcalaus2013-07-02 09:46:06
B
39
S
11
G
5
Posts: 132
Reputation: 8,228

Post » Wed Oct 23, 2013 10:51 am

dear arcalaus my name is nik and i am 10 years old
i want to learn how to make this jigsaw puzzle game so requesting you to make a tutorial for your game because it is quite hard for me to understand it without help
B
3
Posts: 2
Reputation: 179

Post » Thu Oct 24, 2013 3:43 pm

Dear Nikandin,

I imagine you are talking about a tutorial on how to make a game like this (not about how to play the game).

Could you wait until christmas? I will be very busy at least until december, 1st, and I will be unable to make a video tutorial.

I could try to make a text tutorial, but, as I don't speak english fluently, I'm not sure you'll understand me.
B
39
S
11
G
5
Posts: 132
Reputation: 8,228

Post » Fri Oct 25, 2013 10:54 pm

Here is a small text tutorial. This is very theorethical for a 10-year-old kid, but maybe your parent could help you understand it.

Making a jigsaw puzzle - Part one: concept.

I'll try to make a video tutorial in Christmas.
B
39
S
11
G
5
Posts: 132
Reputation: 8,228

Next

Return to Completed Creations

Who is online

Users browsing this forum: No registered users and 1 guest