Sponsored By

Featured Blog | This community-written post highlights the best of what the game industry has to offer. Read more like it on the Game Developer Blogs.

Designing touch controls for Human: Fall Flat

For over a year Codeglue has been working for 505 Games on the mobile adaptations of Human: Fall Flat. In this blog post we will explain how we designed the touch controls for mobile version of the game.

Peter de Jong, Blogger

February 16, 2021

5 Min Read

For over a year we have been working for 505 Games on the mobile adaptations of Human: Fall Flat. Our main job on this project was and is to ensure that everything from menus to game play felt as good as possible, while keeping controller support for Bluetooth controllers. In this blog post we will explain how we designed the touch controls for the Human: Fall Flat mobile game.

The problem

In Human: Fall Flat the player controls a 3rd person avatar that can run, jump and grab stuff. This grabbing behavior is split into two parts: The left arm and the right arm, allowing the player to control with which arm they want to grab hold of something. On consoles this behavior is linked to the controller triggers; pressing a trigger raises the corresponding arm. The arm height is controlled by the camera angle, so looking up raises the arms in the sky, and looking down has the player grabbing the floor.

The issue we faced with the grabbing mechanic was two-fold: 

  • How does the player accurately control either arm, and sometimes both?

  • How does the player aim the arms in a natural way on a touch screen?

This grabbing mechanic proved to be quite the challenge to translate to touch while making it feel natural and intuitive. Because it’s the core mechanic of the game, we have spent quite some time on iterating and polishing the mechanic to make it feel as good as it can!

Toggle the arms

We started by coming up with a good way for the player to decide which arm they wanted to activate. With player movement taking up the left section of the screen, we decided to place the arm interactions on the right side. Our first iteration was to take a button and cut it in half, allowing the player to toggle which arm they want active, or both.

This worked okay-ish, but not great. The player could play the game with these controls, but a lot of mental energy was required to keep track of which toggle was active, and turn them on and off. Our next step was to add supporting controls to this system by allowing the player to disable all active arms by tapping anywhere on the screen, as players often need to grab and release stuff.

This improved the experience quite a bit, but also highlighted the main problem with the grab mechanic: The camera.

Camera troubles

Controlling the arm height through the camera was just really not working for us on mobile. The camera is controlled by sliding anywhere on the screen and worked fine for looking around and adjusting the camera every now and again, but aiming the arms required the player to move the camera way more than desired.

Our solution was to decouple the camera from the arms, which allowed the player to aim each component separately, but that meant we needed a new way to control the arms. We decided on a joystick approach for the arms, keeping much of the toggle functionality, but also taking the vertical axis into account. 

 

With this approach the player can move the knob around to gain the result they want. Moving it along the horizontal axis controls which arms are active, and the vertical axis controls the height of the arms. Holding the knob still for 0.5 seconds locks the arms into place, allowing the player to safely let go of the knob without fear of their character letting go of what they are holding.

The wireframes for pitching the arm control stick. We later simplified the layout a bit.

This frees up the camera and makes the overall viewing experience a lot calmer as well, as the player is no longer jamming the camera into the floor in order to reach for high places.

Final result

In the end we shipped with one additional control scheme, allowing players to directly touch and drag the arms as well as using the right side ‘armstick’ as described above. Players can grab either arm, or both if they touch and drag the character itself and just move them around intuitively. The player can also tap on a raised arm to release them, allowing for very direct feedback and control. 

Final UI in the game

These two control schemes are both active at the same time, so players are free to pick and choose between the two, making the overall control system available to the player very flexible and intuitive! We also cleaned up the UI art to match the Human Fall Flat style and that is what we shipped.

   

Touch controlling the arms

Conclusion

We are very happy with the control scheme we shipped. The overall task was a difficult design challenge, but one that we believe we managed to tackle elegantly. The decoupling of the camera and the arms was a break from how the game plays on other platforms, but ultimately makes the game a lot more playable on mobile devices, and we are glad we pushed for those changes and made them work. The late addition of direct touch controls was really nice for a more direct manipulation of the character!

Read more about:

2021Featured Blogs
Daily news, dev blogs, and stories from Game Developer straight to your inbox

You May Also Like