Block Hop

Game Outline / Goals

Block Hop is a simple one button jumping game where the goal is to climb up a never ending scrolling world by jumping from one moving platform to the next.

A score is kept of how many jumps the player achieves before they miss a platform and enter a game over state. There is no win state but the game keeps track of the players highest jump count.

The project is an experiment testing how well a simple mechanic can be turned into a compelling gaming experience. My goal is to create something that is challenging and visually satisfying.

Key words and phrases

Simple
Minimal
Easy to learn, hard to master
Visually stylish

SCOPE

Game Features

The features needed to construct the previously outlined game experience.

Nice to have features will not neccesarily make it into the completed game but should not diminish the core experience if missing.

Player control

Side view game
Spacebar / tap to make player jump straight up
Player jump is quick but has weight

Basic gameplay

Platforms spawn from top of screen
Platforms slide left / right within camera view while moving downwards towards bottom of screen
Platform left / right movement speed is random at spawn within a set range
Player times jumps to land on moving platform above
Score increases by 1 when player lands on new platform
Platforms destroyed after player jumps
Game ends when player touches the bottom of the screen

Sound and effects

Jump / landing SFX
BGM
Particle effects on jump and landing
Background scrolls with platforms and loops

User interface

Title screen with start and exit functions
Score is tracked during gameplay
Score shown at end of play
Restart and exit functions at end of play
Pause game function

Nice to have

Persistent high score tracking
Controls for music / SFX
Different types of platform with different behaviours / point values

System Map

This system map indicates screen changes, functionality and game states which can be found within the game.

Effort was made to keep the navigation as frictionless as possible. This was done by checking that all necessary functions are present on each screen and by making navigation between screens logical.

Difficulty settings could possibly be added and accessed from the title screen or settings menu.

Wireframe / Flow

Here the wireframe shows how the different screens are related to each other.

The flow mostly follows what was shown in the system map on the previous page. However, as i worked on the pause screen, it became apparent that there was space enough to include the sound settings in their entirety on the same screen.

This is prefferable as it saves the player an extra button tap once the game is paused. This keeps them closer to the action and less distracted by deep menus.

Game Prototype

Here the wireframes have been implemented into a working prototype in unity.

At this stage the game is working as planned. It can be started, played, paused and restarted. All buttons load their corresponding screens and scores are being tracked across play sessions.

The final appearance of these screens will be defined in the next stage.

Colour

As the game is simple the colours and artwork should also be simple. This could be approached by using a primary colour palette or something more monotone. Either way, the colour usage should be limited and not introduce a large number of variations.

The game should feel energetic and youthful as its more in the world of arcade / quickplay but not so bright that it doesnt feel friendly and approachable.

Logo Sketches / Concept

The main mechanic of the game is jumping from platform to platform, or "block to block", so I decided on the simple, explanatory title of "Block Hop".

To match the games simple geometric style I explored various blocky, simple logo variations. In the end settling on something with just a hint of blockiness rather than having that expression in every letter.

Logo Final

The final version of the logo is simple and flat but bold and recognisable.

The font base is Korelev Compressed Heavy with only minor teaks to the width of the "L". The obvious major tweak is the "O", both of which have had their round corners removed.

Various visual accents have been added to bring the logo in line with the mechanics of the game. The filled rectangle behind the word "BLOCK" is reminiscent of the platforms in the game, the top "O" is more in line with the games geometric style and the bottom "O" is customised to appear as if jumping from block to block.

Start Screen

I started out with quite chunky buttons but quickly realised it was visually a little too noisy. So I reworked the UI into a more subtle, lighter style that let the other elements of the gaame shine through.

This approach has the added benefit of creating clear visual heirarchy. The most important element is the play button, everything else is secondary.

Pause Screen

Another place where the visual design diverged is the pause screen.

I started again with the bigger buttons and used the whole screen space to layout the settings. However, i found that having the background blurred and placing all functions in a container gave clearer focus and keeps the player closer to the game.

Game Over Screen

The last significant change made was to the game over screen. Here you can see that the play again button has been replaced with a more iconographic "replay" button.

This is much more intuitive and may not even require reading to undersrtand its function.

Design Mock-Up
All Screens

Overall i believe the purple, more minimal variation of the UI design is more user friendly. The colour contrast with the text is also stronger, making menus easier to read and navigate.

UI Animation Mock-Up

Slight movement of background, and animation of buttons on press, add to the overall smoothness of the user experience. The interactions are subtle and match the general visual aesthetic.

More animations and effects will be added to the gameplay after the artwork is imported into to Unity.