Introducción a los rompecabezas con Kwik
Hacer juegos de rompecabezas con Kwik es fácil y no requiere ninguna codificación. Utilizará la función Arrastrar y las "áreas calientes" magnéticas para crear el rompecabezas.

Una vez que haya decidido qué imagen desea utilizar como gráfico del rompecabezas, deberá dividirlo en las piezas individuales del rompecabezas. La forma más fácil es usar formas rectangulares. Sin embargo, también puede usar las formas tradicionales de piezas de rompecabezas. La creación de formas de piezas de rompecabezas generalmente se realiza mejor con un PhotoshopR plugin como AV Bros. Puzzle Pro. Como puede ver en el ejemplo, he dividido el logotipo de CoffeBreakBlog en dos rectángulos.

Necesitarás dos formas para cada pieza del rompecabezas. Por supuesto, querrá la pieza del rompecabezas en sí, pero también necesitará una pieza de marcador de posición que coincida, que tiene una forma idéntica a la pieza del rompecabezas. Esto suele ser un rectángulo de color sólido. Por ejemplo, la pieza superior del rompecabezas se llama "dragpz1p1" y la pieza correspondiente del marcador de posición se llama "kwkpzbase1". Puedes usar tus propios nombres para estas piezas.

Primero colocará las piezas de marcador de posición en la pantalla en los lugares correctos para completar el rompecabezas. Como puede ver en el ejemplo, las dos piezas de marcador de posición se colocan en el centro y las flechas rojas muestran dónde se colocarán las piezas del rompecabezas sobre la parte superior de las piezas de marcador de posición. Cada pieza de marcador de posición se convertirá en una "zona caliente" para su pieza de rompecabezas correspondiente.

Utilizará Kwik para asociar cada pieza del rompecabezas con su correspondiente pieza de marcador de posición. Mire el cuadro de diálogo Arrastrar. Tenemos el nombre de la pieza del rompecabezas dragpz1p1 en la parte superior de la caja. Bajando el cuadro a la sección Área de arrastre, tenemos el nombre de la pieza de marcador de posición kwkpzbase1. Para la opción Límites activos, le hemos dicho a Kwik que expanda el área caliente 50 píxeles más allá de la forma del marcador de posición real. Esto facilita que los dedos pequeños coloquen las piezas del rompecabezas, ya que no necesitan colocarlo exactamente sobre el marcador de posición correspondiente.

A continuación, tenemos la opción Bloquear cuando se coloca. Probablemente desee utilizar esta opción para que la pieza del rompecabezas no se pueda mover una vez que se coloca en la posición correcta.

En la opción Trigger Action, le decimos a Kwik que reproduzca un sonido de audio de clic. Cada vez que una pieza del rompecabezas se coloca correctamente, el jugador escuchará este sonido.

Cuando comienza el juego, Kwik colocará automáticamente las piezas del rompecabezas en la pantalla en posiciones aleatorias. Debido a que las posiciones son aleatorias, las piezas del rompecabezas se colocan en diferentes posiciones cada vez que se juega el juego.

Si quieres un desafío, también puedes configurar Kwik para que cuente cuántas piezas del rompecabezas se han colocado en sus posiciones correctas y tienen un "Juego terminado" o "¡Bien hecho!" mensaje muestra cuando todas las piezas se colocan correctamente.


Puede ver un ejemplo funcional de un rompecabezas en la aplicación de mi libro
T'was The Night Before Christmas - Un clásico interactivo.
Es gratis desde la tienda de aplicaciones.

//www.avbros.com/puzzlepro/

//www.kwiksher.com/tutorials-kwik/magnetic-drop/

Derechos de autor 2018 Adobe Systems Incorporated. Todos los derechos reservados. Las capturas de pantalla del producto Adobe se reimprimieron con permiso de Adobe Systems Incorporated. Adobe, Photoshop, Álbum de Photoshop, Photoshop Elements, Illustrator, InDesign, GoLive, Acrobat, Cue, Premiere Pro, Premiere Elements, Bridge, After Effects, InCopy, Dreamweaver, Flash, ActionScript, Fireworks, Contribute, Captivate, Flash Catalyst y Flash Paper es / es [una] marca registrada [s] o una marca registrada [s] de Adobe Systems Incorporated en los Estados Unidos y / u otros países.
El producto Kwik, el logotipo de Kwik y Kwiksher son propiedades de Kwiksher.com - Copyright 2011. Capturas de pantalla utilizadas con permiso.

Estos tutoriales son para la versión anterior de Kwik 2 y pueden no ser de mucha ayuda cuando se utiliza Kwik 3 y superior. Si tiene problemas, utilice el foro Kwik.


Instrucciones De Vídeo: Rompecabezas con cropit y html5 usando canvas | (fácil,sencillo y completo ) (Mayo 2024).