USER MANUAL
Contents
1. USER MANUAL VERSION 1 0 Published March 2003 By StoryBuilder Team Inc Table of Contents IHtTOGUELION erem ET T EE AE 1 How to Install StoryBullder sinnn ERR nE GORGE 1 learnithe Interface EDEN NONI NNI EIE EE DIEI DE DUVDMY 2 ELS MMC IHE ee seabed 3 Using the Gest re Iriterface EE ERE EE HEELS 3 Gesture Video Exam ples eR EVENIRE VEN EE V VEU EV PV PU VEN UV UP V UU DU VU NEP V UV OMA E UT 3 Create a IDEE 6 Addirig Images irr ERR aa Ext be MEE E tesa esL ehem Heut ass HEHE Besserer 6 Br isole M 6 Rotate Images p E uu cuu cub cub rui rub rub bebes 7 Scale lMa ges a a r a EOE N Ea NENEA EEE 7 Change Stack order of Images roe Eon E Ee be Ein Een bu leoi On 7 Creating an ANIMA Masa t p e epu te etre etn orte eu EE eeEs 8 What is akeyErame ooo nac bie na cbe nnb nbn 8 How does the TimeLine Work rr E P e e Eee ee 8 Create an Animation using keyFrames sssssssssssssseeeennme nennen nemen 8 Create an Animation without using keyFrames sssssssssssseemeeeneeenenn nnn 9 Playing the Animations 5 onn d e 9 Future Features tete USE hit hed sue ae cate cata eigene 10 Teri oo DEIO HA 10 New Animation BONON ioo iP rH bn D D EDD D DEL 10 Open Animation BUltOri s ir rr PETENS VEINTE EUN NU EUN EU E NOU IT TESSEN 10 Save Animation Buttons aioe oe eee beaten one Eee Henn lee ine lite ente bide ene ed2. 11 lal om s 1j itera EE E ER ER 11 Mulit User Functionality Overview StoryBuilder is a tool that allows users to create simple animations using predefined images and record sound to accompany the animation Interaction with StoryBuilder is done using a gesture system that is currently simulated using the mouse These gestures can be combined to animate scenes by combining images within frames and by modifying their orientation position and size over specified time periods Users will also be able to record an audio track to accompany the animation and combine several animated scenes together into a longer movie The StoryBuilder is designed for novice users or hobbyists who needn t have significant knowledge of either computers or animation but who wish to try their hand at animation How to Install StoryBuilder If Java is installed only one file storybuilder jar is needed to run the StoryBuilder animation package The following instructions can be followed to successfully install StoryBuilder Note when we were testing the download and running of StoryBUilder tar we had problems if we used Mozilla Please use Internet Explorer or Netscape for this download 1 If you do not have Java installed download it from http java sun com j2se 1 4 1 You can download either the JRE or the SDK both work for StoryBuilder and be sure to download the appropriate version for your operating system 2 Install Java by following t
3. Big Gesture Used to scale the constrained size of selected images i e distortion isn t permitted smaller A static gesture used by holding the left mouse button down over a selected image Pressing 5 on the keyboard will activate this gesture 6 The Stackorder Up Gesture Used to move the stacking order of the selected image up For example if the user has placed a tree on top of a dog he may want to select the dog and move it to the front of the tree A static gesture used by holding the left mouse button down over a selected image Pressing 6 on the keyboard will activate this gesture 7 The Stackorder Down Gesture Used to move the stacking order of the selected image down For example if the user has placed a tree on top of a dog he may want to select the tree and move it behind of the dog A static gesture used by holding the left mouse button down over a selected image Pressing 7 on the keyboard will activate this gesture 8 The Release Gesture Used to indicate the end of a gesture Since the StoryBuilder is currently using a mouse simulated gesture interface the release gesture is not needed The equivalent of this gesture in the mouse interface is the release of the left mouse button Pressing 8 on the keyboard will activate this gesture although it has no function Gesture Video Examples Video Examples of each of the gestures that will be implemented in the coffee table can be found on the StoryBuilder website a
4. ce window shows the mappings of the gestures to these keys The pressing of the keys to change gestures will only be recognized if the StoryBuilder Application has the window focus This means if you are pressing buttons 1 through 8 and nothing is happening to the mouse cursor you must first click on the StoryBuilder Application to bring it into the window focus The most common place that this will be a problem is when the Gesture Reference Window is open and is given focus These are two separate windows Note All of our gestures have been defined as single handed gestures This allows a single user to exploit our multi user functionality by using both hands or the freedom to interact with the hand of his or her choice We have assumed that the gesture recognition system will be able to easily detect any of our defined gestures independant of the left or right hand The Gestures oy Gesture Reference Wi DAR Gesture Reference 4 Pointer 2 RotateCw v 3 RotateCCw 4 Scale Big 5 Scale Small 6 Thumbs Up S E 7 Thumbs Down 8 Release jf EA T The gesture menu figure displays what gestures if they were selected would work at any point while using the StoryBuilder For example gestures 2 7 only apply if an image is selected within a frame 1 The Select Gesture Used to select images buttons and system functionality A static gesture formed by pointing the index finger and placin
5. dow to appear that will display video tutorial options The user will be able to either select and play a tutorial or close the window if none of the tutorials are helpful Multi User Functionality Our multi user functionality is currently shown by mulit users sharing the same mouse i e taking turns using the interface Since multi mouse programs are very difficult to write we decided to take this approach until the gesture system is in place Once the gesture system is implemented it will be much easier to handle multiple gestures at one time 11
6. g the finger on the desired selection Pressing 1 on the keyboard will activate this gesture The Drag Gesture Used to move selected images into the frame around the frame specify new positions for keyframe animation and remove selected images from frames A dynamic gesture formed by first making the select gesture and then while keeping left mouse button pressed moving the mouse to the desired location for the selection The Deselect Gesture Used to deselect selected images More of a non gesture since items are deselected by moving the mouse cursor off of the selected object As long as the cursor is no longer over the selected object it will deselect 2 The Rotate CW Gesture Used to rotate selected images in the 2D plane of the frame in the clockwise direction A static gesture used by holding the left mouse button down over a selected image Pressing 2 on the keyboard will activate this gesture 3 The Rotate CCW Gesture Used to rotate selected images in the 2D plane of the frame in the counter clockwise direction A static gesture used by holding the left mouse button down over a selected image Pressing 3 on the keyboard will activate this gesture 4 The Scale Big Gesture Used to scale the constrained size of selected images i e distortion isn t permitted larger A static gesture used by holding the left mouse button down over a selected image Pressing 4 on the keyboard will activate this gesture 5 The Scale
7. he instructions on the java sun com website 3 Download the StoryBuilder application storybuilder jar from the StoryBuilder website at http www cim mcgill ca mnhilar hci project part4 partd v O html 4 f you are running Windows you can simply double click on the downloaded StoryBuilder jar file In Unix from the command prompt you can run java jar StoryBuilder jar If you have any trouble with running StoryBuilder or downloading Java please contact one of our team members Learn the Interface The following is a screen shot of the interface of StoryBuilder amp StoryBuilder Prototype Image Gallery Currently Selected Frame Frame number Time Line Frame PreView Set Keyframe Garbage Can Reoord Sound No sound recorded T Bl wl 8 99 New Animation Open Animation Save Animation Play Animation Gesture Pallet Help Buttons 3 Gesture Interface Overview Interaction with the StoryBuilder will eventually be through a gesture interface however the current version uses a mouse to simulate these gestures The mouse cursor illustrates the current gesture that is selected and each curser is designed to represent a physical gesture In the current version the gesture is only registered with the StoryBuilder while the left mouse button is clicked and held for the duration of the gesture The gesture can be changed by using the keyboard keys of 1 8 and the gesture referen
8. t http www cim mcgill ca mnhilar project part2 gestures gestures html zZ Create a Frame Overview A frame is a snapshot of one second of the animation It is represented by the numbers on the timeline and can be seen either through the frame preview window or by selecting the frame number and displaying it in the main edit frame window Frames are edited by modifying the images using the edit frame window Adding Images To add an image to a frame 1 2 Using the timeline select the desired frame Press 1 to select the select gesture In the image gallery press and hold the left mouse button over an image The image will appear selected with a red box around it While still holding down the left mouse button drag the image into the editing window When the image is in the desired location within the editing window release the left mouse button Deleting Images To delete an image from a frame 1 2 3 4 5 Using the timeline select the desired frame Press 1 to select the select gesture In the frame press and hold the left mouse button over the image to be deleted The image will appear selected with a red box around it While still holding down the left mouse button drag the image over the garbage can Release the left mouse button Rotating Images To rotate an image in a frame 1 2 Select the image see adding an image for the selection process While
9. t supported functionality is limited to that which is required to give the user an adequate feel for the steps necessary for creating animations Less essential functions were not fully implemented although messages are displayed explaining how the system will operate in the future Functions that will be implemented in future versions of the system include recording and playing of sound opening and saving animations files the inclusion of a help facility and multi user functionality In the full version of the StoryBuilder the user will be able to record sound for the animation using the Record Sound button located to the bottom right of the interface When this button is pressed its text label will change to Stop Recording and the timeline will reset to frame O The user will then be able to use the microphone to start recording sound speech music etc The timeline pointer will move automatically while recording is in progress to indicate to the user which frames will be coupled with the recorded sound segment Pressing the Stop Recording button will end the recording session The existence of any recorded sound segment will by graphically illustrated on the soundline Furthermore when an animation is being played recorded sound segments will be played simultaneously with the frame updates at the correct times New Animation Button In the full version of the StoryBuilder the user will be able to create a new empty animation using
10. the New Animation button When this button is pressed and no unsaved modifications exist for the currently open project the current animation will be closed and a new animation project will be created and opened with a blank editing area If unsaved changes exist the system will open a dialog box prompting the user to either save these changes or cancel the request Open Animation Button In the full version of the StoryBuilder the user will be able to open an existing animation using the Open Animation button When this button is pressed and no unsaved modifications exist for the currently open project the current animation will be closed and the specified animation 10 will be opened If unsaved changes exist the system will open a dialog box prompting the user to either save these changes or cancel the request Save Animation Button In the full version of the StoryBuilder the user will be able to save an open animation using the Save Animation button When this button is pressed the system will save all changes made to the currently open animation If this is the first time that the animation has been saved the user will be prompted in the usual Windows fashion to select a file directory and a name for the animation to be saved On each additional save the animation will be saved to this same directory file There is no save as feature Help Button In the full version of the StoryBuilder the user this button will cause a win
11. the image is selected i e has a red box around it press either 2 or 3 on the keyboard for clock wise or counter clock wise rotation Press and hold the left mouse button until the image is in its desired orientation Release the left mouse button Scaling Images To scale an image in a frame 1 2 Select the image see adding an image for the selection process While the image is selected i e has a red box around it press either 4 or 5 on the keyboard for enlarging or shrinking of the image Press and hold the left mouse button until the image is at its desired size Release the left mouse button Changing Stacking Order of Images To change the stack order of an image in a frame 1 2 Select the image see adding an image for the selection process While the image is selected i e has a red box around it press either 6 or 7 on the keyboard for moving image to back or the front Click the left mouse button until the image is at its desired stack order Creating an Animation Overview What is an animation why create an animation What is a Keyframe A Keyframe is simply defined as a frame that has been directly edited If you have added deleted or edited an image within a frame it is automatically set to be a Keyframe To unset a frame as Keyframe the reset Keyframe button is provided To set a frame that has not been edited to be a Keyframe
12. the set Keyframe button is provided Warning When a Keyframe is unset all changes that were made to that frame are lost and the frame will appear as it would if it had never been a Keyframe How does the Timeline work The timeline is designed to give the user a feeling for the overall animation while working on one single frame The slider can be quickly scrolled over the toolbar to display each frame in the animation or when left on a single frame will cause that frame to appear in the editing window The small thumbnails under the timeline are meant to show a frame preview Therefore the user can see what the frame looks like while sliding over the timeline Creating an Animation Using Keyframes Once an image is added to a frame you will notice that image will be displayed in all subsequent frames at the same orientation position scale and stack order that it is first displayed The frame where the image was created will automatically be set to be a Keyframe To animate an image simply select a subsequent frame and modify the image within that frame automatically causing that frame to be a Keyframe as well Each frame between these two frames will now show the image in an appropriate linearly interpolated position orientation scale and stack order Pressing the play button will display the animation frame by frame Other images can be added and animated in the same manner and the number of Keyframes is only limited by the si
13. ze of the animation For example to create an animation of a duck that starts at the lower left hand corner of the screen and then flips upside down while moving to the top right hand corner of the screen over 10 seconds follow the following instructions 1 Adda duck to frame 1 and place it in the lower left hand corner of the editing window 2 Using the timeline move to frame 10 3 Select the duck and move it to the upper right hand corner of the editing window 4 Rotate the duck until it is upside down 5 Press play Creating an Animation Without Using Keyframes The advantage of using Keyframes is that it makes the changing of characters over many frames quite easy However if linear motion isn t desired animations can be created by editing each frame at a time For example to create a duck that moves in a circle over 10 seconds this can be done by adding a duck to frame 1 and then in each subsequent frame until frame 10 moving the duck a small bit around a circle This is the only method for creating non linear changes on images Playing the Animation The animation can be viewed by pressing the play button At any time during the playing of the animation the stop button can be pressed causing the animation to stop and reset Overview The alpha system of the StoryBuilder is a prototype meant to provide the user with a preview of what the final application will look like and how it will operate For the momen
Download Pdf Manuals
Related Search