PaperBox

PaperBox by Diana Yee

INTERACTIVE GAME POSTER WALKTHROUGH

When starting the poster, the player will see a paper box cursor and the title. From here, the player can press anywhere on the screen, and the ball will attract to the cursor. If the player mouse is released, the ball will spread out and bounce around on the screen. The player can click on the question mark button on the right-top and lead the player to the “help” screen. If the player press the R key can start the game right away.

On the help page, the player can interact with two instruction images by pressing the key is shown or left-click. The player can return to the starting page by pressing space and the R key to start the game.

After pressing the R key, the player will enter the game screen with a 5-second timer count down. Then the player can use WASD to move the paper box or mouse to drag the item into the paper box. If the player collects one item, the player will earn one point, and both the paper box and item will place in a new location.

 

On the ending page, players can see the score they got from the game. The player can interact with the bouncing ball in the background by pressing anywhere on the screen. And the ball attracts to where the cursor was; the ball will spread out as the player releases the mouse. The player can press space to return to the starting page and start a new game.

INTERACTIVE GAME POSTER GOALS AND PROCESS

Design Goal for PaperBox

• Collection
  • When I get the concept of paper boxes, I found that they often used to contain the stuff that we no longer to used or stuff from a young age. Thus, I was planned to make the interaction of referring to the memory with the item by pulling it out from the box. However, this plan failed with the problem of animation and controls, so I revised and replaced the plan by referring to collecting the memory with items by collecting the stuff.

• Always be Willing to Scope Down
  • I want to create everything in the poster interactive and numerous graphics. However, it requires a lot of complex works, such as drawing a large number of items. Figuring this out helps to resolve many unnecessary troubleshot, as well as to understand what are the essential things in this poster.

• Discover the Problem
  • During the coding, I often run into troubleshot, and sometimes it is difficult to find where the problem was. Using the strategy of the console to discover is very helpful to solve the problem as keep up with the process.
• Colors 
  • I want this poster game to be as colorful as possible and use color to fill the emptiness of the poster or to tinker with it a little.

Design Process for PaperBox

Personal Successes:

• I was able to get hands-on with the user controls and use them to control screen changes, box direction, and image change.
• I figure out how to import more stylistic fonts and use them in the interactive poster game.
• I find a library to check the collision of items, which helps me to check whether the player collects points.

Personal Challenges:

• It was a struggle to create animation for images. For example, I try to make items pop out from the box, and players can click and drag on them. However, it ran the issue that the image was shaking in one place; else it was never shown. 
• Coding in the control elements, such as item dragging in the game was challenging. Although I can find serval tutorials; however, implementing the code run into lots of bugs.
• As I tried to put in sound effects; Such as the sound of the paper box moving, it went into an endless loop and ended up with a sharp sound during the play and decided to remove it because I was unable to find a resolution for it.
• Several problems were raised with the color of the bouncing balls in the intro and ending page. When I used hex code color, it ran into bugs such as animation stopping working; the only method I got right now was to keep in HSB code color with random color but controllable lightness.