logo
g Text Version
Beauty & Self
Books & Music
Career
Computers
Education
Family
Food & Wine
Health & Fitness
Hobbies & Crafts
Home & Garden
Money
News & Politics
Relationships
Religion & Spirituality
Sports
Travel & Culture
TV & Movies

dailyclick
Bored? Games!
Nutrition
Postcards
Take a Quiz
Rate My Photo

new
Painting
Heart Disease
Horror Literature
Dating
Hiking & Backpacking
SF/Fantasy Books
Healthy Foods


dailyclick
All times in EST

Full Schedule
g
g Digital Art and Design Site

BellaOnline's Digital Art and Design Editor

g

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


print
Printer Friendly
bookmark
Bookmark
tell friend
Tell a Friend
forum
Forum
email
Email Editor


Content copyright © 2013 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


g features
Sketch with Your Silhouette SSDE

Simple Drawing Tools in Silhouette Studio Designer

Silhouette Studio Designer Edition Software

Archives | Site Map

forum
Forum
email
Contact

Past Issues
memberscenter


vote
Poetry
Daily
Weekly
Monthly
Less than Monthly



BellaOnline on Facebook
g


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


BellaOnline Editor