Portfolio

Josephine Johnzon

About

Work

Trailer for final game

Beat Box

Client: Hyper Island
My Role: Unity developer with C#, Simulations
Tools: Unity, Visual Studio, GitHub, Blender, Maya

Beat Box is a team project for a client at Hyper Island. The brief was to make a short experience to be used at a fair with the concept “All fun and games”. I was doing game development and shaders in Unity, simulations in Blender, letter models in Maya, and sprites in Photoshop. In addition, I was designing the concept for the experience together with the rest of the team.

According to the brief, the experience needed to have about 1 minute playtime, suitable for visitors to try out at the fair, and was going to represent Hyper Island at the fair. We choose to make a short game in VR as it was a good way to screen of the attention of the player quickly for a short experience, and connect to the concept of the fair. To represent Hyper Island, we were inspired by 2D artwork from Hypers visual identity, and energizer exercises that is part of the Hyper methodology. We made a mini game where the player has to collect letters for the Hyper Island logo within one minute by punching them. The player is equipped with boxing gloves and there is a beat box background audio to lift the pulse. Colorful simulations shows which letters are collected.

1. Player starts in a fixed position, located in a room at the Hyper Island Stockholm Campus. There is big 3D version of the Hyper logo on the wall in front. The Beat Box logo is placed as a world space UI element, showed together with animated jagged sprites and a beat box jingle.

Slideshow for final game

2. After the logo there is a new UI element explaining the rules of the game. When the player is ready they need to push the play button using raycast interaction, a usual way to interact with UI elements in VR. There is a A beat box background audio.

Slideshow for final game

3. After the player has pressed the play button, a new sprite is showing up , telling the player to get ready.

Slideshow for final game

4. Then there is a count down from 3 with animated UI elements with increasing size of the letters, along with a count down voice to activate the player. After the countdown, a bell sound usually used in boxing matches is heard.

Slideshow for final game

5. The game starts with a new beatbox background sound. A text appears on the screen showing a countdown from 60 seconds, the current score and score multiplier. Colorful 3D letters are randomly spawned in front of the player and is flying towards the player.

Slideshow for final game

6. The player needs to box the approaching letters to collect them. User feedback from boxing includes a short beat box sound, a star particle effect, and UI text element showing score from boxing the letter. The boxed letter changes direction according to the boxing direction.

Slideshow for final game

6. When collecting a letter, the corresponding letter on the wall is changing color and a fluid simulation is growing out of it. The player must avoid to hit the same letter twise, as it will give a minus score and loss of time, shown with spawned UI letters in red.

Slideshow for final game

7. The player wins if they collect all the letters before running out of time. The player is then rewarded by a cheering crowd, a win UI message and a rotating disco ball coming down from the ceiling. Most of the field of view is covered by colorfull moving simulations.

Slideshow for final game

8. If the player dose not succeed and run out of time before collecting all the letters, they stop spawning, a lose UI message is shown, and the player is booed at from the crowd.

Slideshow for final game

9. After the win or lose message has been shown for a few seconds, the light intensity is increased, and the intro beat box background audio is played again. There are now two UI buttons in front of the player, letting the player choose to restart or quit the game.

Slideshow for final game

Beat Box

Client: Hyper Island
My Role: Unity developer with C#, Simulations
Tools: Unity, Visual Studio, GitHub, Blender, Maya

Beat Box is a team project for a client at Hyper Island. The brief was to make a short experience to be used at a fair with the concept “All fun and games”. I was doing game development and shaders in Unity, simulations in Blender, letter models in Maya, and sprites in Photoshop. In addition, I was designing the concept for the experience together with the rest of the team.

According to the brief, the experience needed to have about 1 minute playtime, suitable for visitors to try out at the fair, and was going to represent Hyper Island at the fair. We choose to make a short game in VR as it was a good way to screen of the attention of the player quickly for a short experience, and connect to the concept of the fair. To represent Hyper Island, we were inspired by 2D artwork from Hypers visual identity, and energizer exercises that is part of the Hyper methodology. We made a mini game where the player has to collect letters for the Hyper Island logo within one minute by punching them. The player is equipped with boxing gloves and there is a beat box background audio to lift the pulse. Colorful simulations shows which letters are collected.

For the wall simulations I wanted to achieve a hectic digital feeling according to the moodboard. In Blender I made dripping animations for the letters using shape keys, and for the big growing parts I made low poly fluid simulations. I was making an animated shader inspired by glitching computer screens for the letters, and two shaders for the fluid sims with animated distortion of vertex positions along a sinus curve to get a continuous wave movement. One of these shaders is using depth calculation to achieve a two-colored tint.

In Unity I developed the functionality for a simple intro sequence with procedural animation applied to some jagged shaped sprites I made. I also made a simple gameplay for spawning and collecting flying letters, and to trigger a win or lose event. I was working with several ways of user feedback from punching letters, to make punches more exciting: different beatbox sound effects, a particle system emitting stars I made with same jagged style as for the UI intro, and a small UI text with score and time reward. The punched letter is also changing direction according to the punch direction. Different feedback audio and UI messages for winning or loosing triggers the players motivation: success is rewarded by a win message, a cheering crowd and a disco ball, while the player is booed at if loosing. UI buttons was kept to a minimum to avoid annoying interactions outside gameplay.

Moodboard with colorful digital glitching logos, and logos with melting and fluid effects. Inspired by Hyper Islands 2D energizer artwork, but with a more digital psychedelic touch with motion.

Storyboard with game idea and narrative structure for the game. A simple linear narrative was chosen to keep the experience simple to engage in for the player, focusing on having fun during the 60 second playtime.