href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"

Pontus

Info

Pontus is an educational typography game with the goal to teach the player about different definitions in letters and typefaces in a historical context.

Project:

An Educational Typography Game

 

Role:

UX/UI/Game Designer

Gameplay trailer

The Game

The objective of the game is to shoot the right characteristic of the letters with ink. For example, the game could ask you to find the bowl of a letter, then you have to aim at that part of a letter and shoot it. To aim and shoot the letters, the user has to turn a controller in different directions to make the reticle move in the game. The player needs to shoot as many correct definitions as possible before the game ends, but at the same time, they need to keep track of the ink ocean rising if they miss or shoot the incorrect letter types.


 

 

Our Process

The main focus of our development was the educational part and the interaction between the player and the interface. A few of our focus points to make the game fun and interesting were feedback, gamification, and narrative. While keeping in mind the educational element of the game in all of the focus points. 

We sketched scenes with different interactions between the user and the game before starting to work on the first digital prototype. The first idea was for the user to move their arms, which was connected to the movement of the canvas. The ink would fall from the top of the screen and the player would have to move their arms to make sure the ink drop would land on the letter. In this sketch, we also talked about implementing a feature where the player could use their hands to turn a letter, upside down or sideways to fill different parts of a letter. This seemed too stressful, considering the time of a falling ink drop. And not very intuitive to control considering the other movement of the game. So we scrapped this idea.

 
 

process3-1
process5

We made the falling letter sketch into a digital Wizard of Oz test. To try to see how this interaction would feel like. After testing this myself, I noticed an interesting gameplay mechanic that was not intended but quite dramatically made the interaction more fun and skillful. As the drop was falling and you moved the canvas to try and make it land on a letter, the ink drop would not fall straight but curve. Making the drop turn in the air made it possible to hit the sides of a letter if you had the skill to control the movement of the canvas and the drop correctly.

However, after having a few people test our sketch, we felt that it was confusing for the player not to have something in their hands to control the game with. We also thought that the unintended mechanic of curving the ink drop was a bit too hard for a game focused on learning definitions of letters, it didn’t quite fit in with the narrative or the main objective of the game. To shoot the ink instead of a drop falling was our next prototyping step. We thought that moving a point on the canvas instead was a better and more satisfying implementation.


 

process4-1
process6

First digital prototype

The prototype consists of two different parts which work together:
- The digital prototype (the interface)
- and a physical controller.

The digital prototype is built in Unity and shows a layer with different typefaces on it. The letters are separated into different parts (according to the different definitions). On the screen is a circle as the focus point, which can be moved by using a Nintendo controller. Our prototyped level in the game is in the historical context of the Bauhaus decade and shows therefore different typefaces like Xants Regular, Reross Quadratic, and Alfarn Regular. Words that represent information about the Bauhaus decade are shown on the screen. In the background are a few colorful letters to represent the context and as graphical elements.

On the top of the screen is a black bar with the definitions in white letters inside it. After starting the game, the player should look for the right letter part that the current definition fits. The focus point should be moved with the controller and when it is on top of a letter, the ink can be shot with the button on the controller. The player has a time limit of 1 minute and should shoot as many right parts as possible.

If the part was right, the ink would fill the part with an animation. If the part was wrong, the ink would splash and drop to the bottom. If the player misses the letter, it would also drop to the bottom. On the bottom, there is an “ink ocean”, which fills up with every missed drop of ink.


 

digital-prototype1-1

It was hard to have a sense of direction on the big canvas when using the small Nintendo controller. So we decided to build a small box around the Nintendo controller. The box can be held easily with two hands. In the middle of the box is a little hole, where a piece of cork is placed in order to press the button on the Nintendo controller inside.

Personally, I wasn’t a big fan of boxing in the Nintendo controller. I felt that using a standard Playstation or Xbox controller would have given us better grip and provided the necessary sense of direction compared to the smaller Nintendo controller. The box the controller was in felt a bit awkward to turn back and forth compared to a standard controller. My opinion on this is a bit bias because I’m more used to standard controllers when playing games. However, spending time on creating a new controller in this particular scenario felt a bit unnecessary. In my opinion building, a new controller should come from better reasons, such as immersing the player in a different way than a standard controller can provide. If that fits with the intended experience of the game.


 

digital-prototype2-2
digital-prototype3-2

Playtesting

During the last weeks, we playtested with other students from other programs such as graphic design, engineering and product design. We discussed if we wanted to make a game for designers or an educational game for everyone. We figured out, that we need the easiest definitions with plenty of possible answers if the playtesters are not designers and don’t know anything about typefaces. That’s why we decided to use leg, cross stroke, bowl, shoulder and stem as definitions in the first level. To help participants which don’t know the words and answers, we wrote the solutions on the wide board next to the game. We thought about having a similar kind of cheat sheet on one side of the interface in the first level of the game later on.

Before the playtests we put together a few questions we wanted to ask the participants in the test session. In general, we wanted to know if the player understood the game (how to control it, the background, the goal). Also, we were interested in finding out if the game is fun for both design students and other students. Through the interviews and also the observation of the body language, we wanted to answer the questions.

Some of our important questions were:
- How did it feel to move the circle (frame) around?
- How did the movement feel like when shooting the ink?
- Did you understand what to do? What was unclear?
- Was it hard to learn?

Insights

All testers said that they need more feedback on which time it is wrong and which the right part. They missed a few game features such as score, lives, as well as typography descriptions. We learned that having the objective of the game close to the aim circle wasn’t a good idea, neither would having the letter become highlighted to show you where the target would be since it would counter the effect of learning and memorizing the different characteristics. Instead, it is good to help with a ”hint” before the game begins or in the margin of the game canvas.

The movement feels dynamic – slow and fast movements feel precise.
Everyone keeps playing until we said they can stop if they want – which was a sign of them feeling the flow of the game.

Final prototype

After the playtests, we knew that our main focus for further development should be on adding and changing feedback: The feedback for hitting and missing the letters was a bit unclear. Also, the level design would contribute to the game making it more connected to the background and words and make the user understand how it relates to the historical content in a better way, so we implemented these too for the final prototype.

final-pic-1

Team:

Florian Dymke

Carolin Achtermann

Johan Hellgren

 

Year:

2019

 

Thanks for taking the time to visit this portfolio!

If you would like to get in touch, here's my email: Alexandergrovnes@gmail.com or use the links below