g Text Version
Beauty & Self
Books & Music
Food & Wine
Health & Fitness
Hobbies & Crafts
Home & Garden
News & Politics
Religion & Spirituality
Travel & Culture
TV & Movies

Bored? Games!
Take a Quiz
Rate My Photo

Autism Spectrum Disorders
Mental Health
Blogs / Social Networking
Kidney Disease
Today in History

All times in EST

Low Carb: 8:00 PM

Full Schedule
g Digital Art and Design Site

BellaOnline's Digital Art and Design Editor


Kwik 2 Game Physics

In this tutorial, we will learn how to use one of the most popular animation features in Kwik 2, game physics (also know as simulation physics). We can use Kwik to create a next-to-life environment where the object on the page responds to aspects of this environment such as gravity, force and collisions.

In our sample app, we will use gravity to make an object fall down the page as soon as the page loads. If the reader does not interact with the object, it will continue to fall until it hits the bottom of the page. When it collides with the bottom it will bounce and then come to a halt. However, if the reader clicks and drags the object, it will respond to that force and move in the direction of the drag. Once it has come to a halt from that force, it will again continue to fall from its new position on the page.

This may sound quite complicated but Kwik makes it easy for the non programmer. Our first step is to set up the physics environment and then tell the object, a pocket watch, how to interact within this environment.

Open your project into Photoshop.

  1. Select page2 from the list of pages in the Kwik panel. In the Page/Components section of the Kwik panel, you should see "@ page2" at the top of the section.

  2. From the mockup file, copy the watch graphic.

  3. Paste the watch on to a new layer on the page. Name that layer "watch_pg2".

    This layer doesn't have a shared object and will not be exported as a jpg image. Therefore, we don't need to set any layer properties.

    Now let's set up the physics environment.

  4. Click the Physics icon in the Categories bar.

  5. Select the Environment Properties tool in the Toolset to open the Physics Environment dialog box.

  6. Gravity: We will keep the real-world gravity settings.

    X 0
    Y 9.8
    Scale 30

  7. Check the box for Invert Physics on Screen Rotation. This will cause the ball to fall in reverse when the device is flipped.

  8. Keep the Normal setting for display mode.

  9. We want to keep the watch within the page boundaries. Check the box for Create Virtual Walls around the Screen and check the boxes for Top, Left, Bottom and Right.

  10. Click Save.

    Now we can set the physics body properties for the watch.

  11. With the watch_pg2 layer selected, click the Set Body Properties tool in the Toolset to open the Physics Body dialog box.

  12. Keep the default setting for Dynamic because we want the watch to be influenced by the physical environment.

  13. Keep the default settings for Density, Friction and Bounce.

  14. Set the Shape to Circle because our watch is round. If your object is of a different shape, you should use the best choice.

  15. Click Save.

    At this point, the watch is set to fall in response to gravity. But we still need to tell it how to respond when the reader drags the watch.

  16. Select the Set Force Properties tool from the Toolset to open the Physics Apply Force dialog box.

  17. We want the watch to respond to the click and drag event. Set the Impulse to Push.

  18. Do not check the Curved Trajectory box.

  19. Do no check the Apply Only Force from Impulse.

  20. Set the X and Y Force to 50. Depending on your object, you may need to adjust this setting.

  21. Click Save.

Let's test your physics. Save the changes to page2.

Click on the Export Current Page Only icon and the Publish button to test your animation.

Go to your LearnKwik folder and make a backup copy of the Template project folder. Rename the backup folder by adding the current date to the end. (TemplateMM-DD-YY).

Join us in the Flash forum. | Join us in the Digital Art and Design forum.


Add Kwik+2+Game+Physics to Twitter Add Kwik+2+Game+Physics to Facebook Add Kwik+2+Game+Physics to MySpace Add Kwik+2+Game+Physics to Del.icio.us Digg Kwik+2+Game+Physics Add Kwik+2+Game+Physics to Yahoo My Web Add Kwik+2+Game+Physics to Google Bookmarks Add Kwik+2+Game+Physics to Stumbleupon Add Kwik+2+Game+Physics to Reddit


RSS | Related Articles | Editor's Picks Articles | Top Ten Articles | Previous Features | Site Map

For FREE email updates, subscribe to the Digital Art and Design Newsletter

Past Issues

Printer Friendly
tell friend
Tell a Friend
Email Editor

Content copyright © 2015 by Diane Cipollo. All rights reserved.
This content was written by Diane Cipollo. If you wish to use this content in any manner, you need written permission. Contact Diane Cipollo for details.


g features
Pocket Wedding Invitation SVG Cut File

Planning a Wedding Suite Design

Draw a Spiral Christmas Tree in Illustrator

Archives | Site Map


Past Issues

Less than Monthly

BellaOnline on Facebook

| About BellaOnline | Privacy Policy | Advertising | Become an Editor |
Website copyright © 2015 Minerva WebWorks LLC. All rights reserved.

BellaOnline Editor