Even the Ocean: Designing a game’s world map
Learn about how the large, story-driven platforming adventure game, Even the Ocean, had its world map designed.
If you’re unfamiliar with the gameplay of Even the Ocean, visit our website and be sure to join the mailing list: www.eventheocean.com . Follow the game on Twitter, too! www.twitter.com/eventheocean (or Facebook). And sign up for a trailer preview if you’re in the press, YouTube, or Twitch. I work on this game with Marina Kittaka. In early 2013, we released a game called Anodyne.
INTRO
Even the Ocean has a world map, and it’s used to go from destination to destination. When you leave one of the 2D-platformer perspective areas, you walk across the overhead-perspective world map to reach another area and enter it, similar to Final Fantasy games or Dragon Quest.
For example, to get from the introductory area to the main city area, you leave the introductory area, and walk south through red forests until you reach the city.
In this picture, going to the left side of the left image exits you into the world map on the right. (Note: the world map image has debug art tiles)
Our design goals with the world map are:
- The world map should be navigable via the use of an rough, in-game minimap, and the landmarks on the world map itself. The rough, in-game minimap is somewhat like a treasure map — it shows the main destinations of the world map, but does not have detailed geography or a current location marker. Think ‘paper map’ instead of Google maps. The landmarks of the world map are things like mountains and rivers, or certain formations of forests, etc.
- Should not be too big so as to make travelling a chore
- Should not be too small as to make the world feel insignificant, or make walking feel like a triviality.
- Should convey a sense of great distances being travelled, while in reality a trip from area to area on the world map may only take 30 to 60 seconds. This is to lend weight to the main player character, Aliph’s trips to and from the city, to use reaching a new area as the introduction to the beginning of each ‘arc’ of the story.
HISTORY OF ETO’S WORLD MAP
The world map needs a certain size, but before we can pick the world map’s size, we need to know how many things will be on it.
It’s possible to think the reverse, that is, picking the world map’s size first, and filling it in. I’m not sure how effective this method is. I’m skeptical of it because it implies that what’s essentially a container for the main meat of your game is taking precedence over the meat… e.g. saying the game will have two islands before having any narrative or gameplay basis in why that’s a good choice. It makes more sense to me to at least roughly decide on the locations of the game before figuring out initial shape and size of a world map.
So I’m going to talk about how we picked how many things would be in the world map. This involves talking about the world design and a lot of development history and it skims over stuff… but that’s okay.
The design of the world map’s size took place in about three distinct periods of time. The beginning of development (March-July 2013), October 2015, and “everything in between”.
The beginning was, of course, filled with a lot of rough and eventually scrapped ideas. We thought of initial game mechanics, a main player character, we made up rough plots, picked world designs. After thinking of enough initial area and gameplay ideas to the point I felt comfortable, one of the first initial leaps I made was picking the ‘abstract world shape’.. that is, not the size of the entire world or whatever, but if the world is a globe, or a flat plane, or whatever. These sort of things form a nice context to have when deciding on continents/climates/’world lore’ etc.
So I picked a shape. Then I made a few continents to go in that shape. These continents would have the main areas of the game, such as a beach, or the city. I constructed a rough plot that would move the player between these areas over the course of the game.
At that point, I had this preliminary world map, whose choices are based in an okay level of intuition and reasoning. In the end, I wouldn’t use most of that map, but it was a good starting point — and any sort of starting point in complex things like this can be helpful as a guideline (just don’t be worried of changing those guidelines). This stage of the process is more or less about where we stopped with world map development for our previous game, Anodyne, which is part of why it came off as so incoherent.
This is what one of the earliest world maps looked like. It changed a lot from here.
The Middle of Development
During this stage of development, Marina and I discussed back and forth over time and eventually the game takes shape into having the areas that it has in the final game. Marina comes up with a plot and we revise it roughly till it fits the world, we revise the world to fit the plot, etc.
Along the way, an important step was picking thematic (in a story sense) material for each area. For example, one area deals with ideas around the feelings of laziness in the context of everyday work. We keep that thematic material in mind when designing the level geometry, as well as when writing the NPC (non player character) dialogue. We also picked things like ‘climate’, foliage, rocks, feel, general sorts of shapes… anything that would help give places a distinct personality that forms a good base of which to build gameplay and thematic material off of.
So after all of this — years — the areas have their final level designs, themes, dialogue planned out, as well as their involvement in the overall plot. However, they still don’t have a world map to fit into — for most of development I used this debug world map, pictured below. It’s possible to do a good deal of work on the game without this essential element.
SIZE
Right, so by October, we knew the progression and content of the whole game. Still, when designing the final world map, we started in the abstract: based on info we knew, and past world maps, I drew a rough world map, picking some major landmarks (rivers, mountain ranges), and gave justifications for every area’s position. This wasn’t done in a vacuum — since we knew how the game ‘flows’ from area to area, and all of the background information on each area, it was straightforward to figure things out.
From there, Marina refined the rough sketch, adding some other landmarks. From that info, Marina drew a first rough world map. We tried it out in game. Marina decided that it looked sort of weird to be seeing so much — we looked at other RPGs whose world maps “worked” for similar reasons, and you rarely see over 1% of the world map at any time, and since we needed to limit the size of the map (since it’s one PNG), we added a black border, to show less of the world map at any given time. We picked Final Fantasy VI for our reference (despite it being an RPG, it shares some similar design concerns for the map). Above, you can see a picture of the world map with a cut-off black border.
It looks better this way, and it emphasizes that the action happening on the screen is not a one-to-one representation of the game world — the border literally frames this action. With this in mind, we also better know how to design visual density (how much you can see at any given time), as we have knowledge of how much a player will be looking at at any given time.
From there, we refined, expanded the world a bit, tested, thought of things to add in order change up the pace of constant walking.
Eventually we settled on the final world map and are pretty happy. The rest of this post deals with those things I mentioned we did — pacing, landmarks, etc.
NAVIGATION
How does the player not get lost in the map? We want to make the map simple enough to not require navigation with a literal map (though we are adding rough maps — think treasure map like, but slightly more clear). This is to help the act of travelling to an area get the player more into the mindset of Aliph, the main player character — adding the sense of fear that navigating an unknown place can bring. It’s not a huge sense of fear, but if you’ve used a paper map or map printout to navigate a city or somewhere on a road trip, you’ll be familiar with this sense of unease that forces you to focus on your surroundings.
I mentioned I made a rough sketch of the world at the beginning of our final world map design process. Here’s a bit of detail on what I was thinking:
I picked things like a big river and some mountain ranges, because these are impassable (or passable through a small number of points), and thus help to divide the world, in the player’s mind. E.g., in real life the Chicago River divides the city. In the downtown loop area, you have River West, River North, the loop — all in reference to the river. Navigating works well when you can talk about things in reference to landmarks, which is part of why there are notions of ‘west side’ ‘north side’ ‘south side’ in Chicago.
As you pay attention to a space you walk through, you create a network of visual memories: a mountain here, is preceded by a river back there, etc. And so when coming from another direction, it’s easier to get around because of the existence of prominent visual landmarks, either in color/content/shape.
I put Whiteforge — the main city which you return to often — on the north bank of a river that runs from west to east. I also made it near the eastern shore of the continent.
Here’s a sketch of the entire world, in this abstract form
And here’s an in-game pic of the near-city part of the world map, showing the shore and river that catch the eye.
(Note — the pics I’ve provided are using testing tile graphics — underneath those is a painted layer with more expressive art Marina has made so far, you can see some of it further down the essay)
This broke the world map into about four main chunks, giving only two immediate cardinal directions to travel from the city — west along the river, or north along the shore. This helps make the map simpler from the get-go, rather than in the middle of some field where it’s hard to orient yourself as you go further from the city.
From here I picked where the main areas would be, and added some other small geography to make the areas more identifiable (in that picture, you can see that there’s a lot of open green. The final map has a lot more trees, changes in foliage, rocks, small hills, etc.)
Marina added a lake near the city, and of course all the other visual details later. Because there are enough unique visuals on the map and some are more significant than others, this makes the world map easy to navigate.
The visual details were an important part in creating paths a player could figure out without too much trouble. Sometimes, you may mostly be seeing green space. But an autumn-colored tree catches your eye, and this leads to more and more of those sorts of trees… which leads to an area. Or, the edge of a beach catches your eye. Or , you follow a river along. Or you see a patch of woods, or a strange body of water beyond a mountain, etc. These sorts of cues work because the map we give the player isn’t too detailed.
Here’s a preview of part of the world map, zoomed out and borderless, before visual details and such. You can see the main city area as the white octagon, the intro area to the northwest, and the beach area I’ve posted screenshots to the northeast. Each are navigable via landmarks and the rough in-game map provided.
METONYMIC DISTANCE
(Metonymic meaning something standing in for something else)
This section deals with how we convey the feeling that the player has travelled a further distance than they literally have — making it feel like you’ve gotten off a long plane ride when you’ve just walked a block — making the process of going from the City to the next place to fix a power plant — making that process have the feeling of more narrative weight and consequence, fitting you into the mindset of Aliph — who is taking the tasks seriously and is experiencing a level of fatigue as she travels.
Without any additional design ideas, navigating the world map is just a matter of walking around, which can feel like a journey, yet requires a very static set of player inputs, that is — pressing the arrow keys and waiting. This can get boring and doesn’t enhance the game much.
We can move away from this static feeling through a few techniques:
- Fuzzy Physicality of environment.
The collision layer — or where the player can’t walk (mountains, water, etc), isn’t as clear-cut as older games. The world map art is free-form digitally painted. Because of this, although the collisions themselves are tile-based, there’s a sense of needing to feel out the collisions of the map when navigating, which makes the act of navigating more conscious, rather than an auto-pilot to reach the destination. The edge of a mountain may not be clearly delineated by the border of a tile, etc.
- Music
The song I wrote, an overture/main theme for Even the Ocean, is around six minutes long and varied throughout. It’s fitting for a ‘journey’ across the world map, and the variety of musical passages it has means that there are a number of different ways in which the song can resonate well with a specific part of the world map’s visuals.
- Connection Areas
This is the big one. I mentioned that mountain ranges and rivers block off some parts of the world map. In Even the Ocean’s world map, there are bridges, but instead of letting you stroll right across it, you must go through a small 2D-platforming perspective area. If you’ve played Zelda II, it does this too, but with frustrating and high-stakes combat. Similar to the fuzzy physicality aspect, doing this makes the player become more conscious of the act of travelling, and because of the injected actions of entering the area,walking through it, and leaving, once you emerge on the other side, you feel much further away from where you started, because of that faux-obstacle you had to pass through.
You can get this feeling in many games. Crossing a mountain range in an RPG via a long dungeon, using an elevator in Metroid, in general, the visuals changing drastically from a level to level.
This can be annoying if the game contains a lot of backtracking, or these areas are irritating to pass through, but ETO has very little (if any) backtracking, and the areas are short and simple.
We do this a few times throughout the world map and even have a few twists on the idea for specific areas.
- NPCs
At random, NPCs will sprout up and walk around the world map. The act of moving to them and talking breaks up the action of walking to the destination. We have a few detailed ideas with this that are yet to be implemented.
POSITIONING THE MAIN AREAS
The entrances to the main areas (e.g. the beach area) are distant from each other area, enough so that each area can have its own geography on the world map. I used the climates of the areas to position things — colder areas down south, warmer up north, some near specific and relevant-to-the-area geographic landmarks.
This was mostly an intuitive process, but what I thought of seemed to work pretty well so we worked off of that.
DEALING WITH EMPTY SPACE
There’s much more non-interactable stuff in the map than interactable stuff, thus we have a lot of empty space you’ll mostly be walking through. The connection areas and NPCs I mentioned above are ways to deal with this.
We also add small patches of collidable foliage to break up big open sections, but not so much that the map becomes maze-like. This also improves the map’s sense of physicality.
OTHER THINGS
One thing I coded was a ‘tone zone’ which is just a visual layer in the foreground that fades in as you approach an area. This contributes to an area’s personality and changes the sense of place you have at a faster rate.
So with all those things in mind, a few visual iterations of the world map later, some e-mail back and forth and we had a pretty good world map. At various points in the process we pushed some areas further out from the city, or added other landmarks, or edited some of the world map collision geometry to make the map more navigable. There’s still a number of spots that are mostly empty, but I think they occur in a context where you feel like you’re getting closer to an area, and so it won’t be too boring.
So, that’s how we dealt with the size problem of the world map and hopefully — we’ve designed the map to be an engaging experience in the occasional times the player must travel through it, one that makes it feel like Aliph has travelled great distances and is far from the city, on her job to repair one of the main city’s main power plants.
Interested fan or member of the press?
Follow us on Twitter: www.twitter.com/eventheocean
Sign up for our mailing list: www.eventheocean.com/mail.html
If you’re press, YouTube or Twitch: Sign up for a preview trailer release notification: https://dodistribute.com/access/BUXdqBQ4VZ/
ETC
For the interested, I maintain a development log. I wrote about the iterative design process of the world map’s faux-3D perspective, and its implementation in software.
Part 1: http://forums.tigsource.com/index.php?topic=32220.msg1185414#msg1185414