Master powerful magic, venture through dungeons, and explore the monster-filled forest of Equica!

Clover is the unicorn apprentice of Grand Swirllock the Bearded. She needs to learn the 10 basic combat spells every mage must master to survive fights against the monsters of Equica.

Beat the dungeons to unlock more spells and extend your life energy! Beat all the dungeon bosses to prove you’re tough enough to take on any dangerous quest!

- Unlock 10 Different Combat Spells!
- 9 Dungeons Crawling With Monsters & Treasure!
- Plunder Caves For Gems & Items!
- Find Cupcakes, Potions, and Power-Boosting Equipment!
- A Vast & Mysterious Forest Awaits…

  • View media
  • View media
  • View media
  • View media
  • View media
  • View media
Post article RSS Articles

Making An RPG Town Scene: From Gimp To Unity

Mapping/Technical Tutorial 4 comments

With my world map charted out it's time to start putting my plans into practice. I'm using the techniques I used to create the battle scene. I start with colored blocks indicating walls, land, and obstacles. Next I do some sprite work to have things to fill space with. After I have blueprints and pieces I line everything up and put it into Unity so I can add collision boxes where they're needed.

See a more detailed breakdown of making the game's forest town, Timber Grove, from sketch to in-game (along with some pictures) below.

_________________________________

It always starts on graph paper. I call it dreaming because it's like writing the design document, this is the fun and easy part where I just make up what I want in the game. I'm not making these plans for a team so there's no reason to be neat or detailed. I just need something I can look at and understand exactly what I envisioned in the first place.

I need a scale to go by so I use the player avatar as a basic unit. Approximately 32x32 pixels is about Clover's size so I make the floor tiles that size and even do a Sonic inspired checkerboard pattern to it's easy to tell where each one is and count them at a glance.

Another thing to keep in mind is having the map be number to the power of 2. That should be true for all sprites because of how they are manipulated by code and stored in memory. I made sure to limit the size of my maps to 1024 sq pixels so that I can have tons of them loaded one at a time without worry of memory overload or making the game file size too big.


I've been tinkering away at making sprites for the forest town and still have some animated ones to do. Namely moving flowers and a pixie fountain (warp and healing point). I placed the buildings first to match the sketch then put in the decorative elements like trees, stumps, rocks and the town sign.

I want the town to feel both spacious and crowded so in the sketch I made sure to leave open spaces that led nowhere, a clear route from one exit to the other, inviting open houses near the entrance the player will come through first, closed houses scattered and placed near things that actually are interactive, and enough NPCs to make it feel like ponies have lived stable lives here for a while.

I even made sure that no two houses looked the same, but they all looked similar enough to blend together and let the really important landmarks stand out (notably the shops). Also those pink & lavender boxes at the top are where I'll place the fountain asset when I make it. With that sprite being so big I wanted to chart out room for it in advance so I know not to put stuff there.

I want the player to walk straight up to the fountain when going from one town exit to the other so it will be placed midway between the stumps to the left and the building to the right. The squares are evenly placed so it does not represent the exact placement of the object, but does give me an idea of how much space I should leave open.


The tileland version of Timber Grove (what I call the black & green grid with decoration sprites) is just a template I use as a layer in Gimp for placing the real game objects. That means first separating each and giving them all transparent shadows so they look nice when I place them in the world.

Having each tree be an object in the game would take up way too much RAM when the game is running so I need to make a static image of everything in the scene that doesn't move. I open a bunch of decoration object images in Gimp then copy/paste them onto the final image I'll be using for the game.


The final image is a Gimp project with 3 layers. One for the tileland template (at the bottom so I can place things over it), one for the 1024 sq pixel grass tiles that will be cut when the image is reduced to the object layer size (remaining invisible until I click the eye-icon that makes them cover up tileland), and the object layer where I'm placing trees and such.


Copy/Paste grass tiles for the middle layer.

The goal is to match the object layer to what I have in the template but in a careful way that takes into account which objects are closer to the bottom. Items further down are technically in the foreground so they should cover the stuff behind them. When making tileland it's about feeling spaces out and here it's about having that layout make physical sense.


This is what it looks like to only have the object layer showing.

Once the PNG image is flattened and saved I drag it into my Unity folder and make box colliders for walls and doors for entrances. All the techniques I used before for overworld traversal.

I still need a few more assets before I'm satisfied with the look of the town but I almost have the feel down perfectly. Some animated flowers and wandering NPCs will make the town come alive. In addition to that this particular town will have 3 houses and 2 shops you can enter. I'll be making those maps the same way I did Timber Grove proper. Tileland, floor tiles, and object sprites. I just need to also make a back wall for the room to show that it's an enclosed space and I'll have the surrounding area be a black void just as I've seen in other RPGs so the player knows to focus on the colored area.


Things look pretty bare until all the pieces come together. When it finally does though, I get the swelling feeling of pride from knowing I have a new scene in my game. An interactive game world of my creation exists and I can play in it. All that's left is to make more and build a complete and flowing world.


____________________

If you liked this post you can follow my great adventure from dreamer to developer at yotesgames.com where I post my progress and lessons daily.
- Tony Yotes

Comments
Guest
Guest

This comment is currently awaiting admin approval, join now to view.

Post a comment
Sign in or join with:

Only registered members can share their thoughts. So come on! Join the community today (totally free - or sign in with your social account on the right) and join in the conversation.

Follow Report Profile
Icon
Adventures in Equica: Unicorn Training
Platforms
iOS, iPad, Android, AndroidTab
Creator
TonyYotes
Engine
Unity
Contact
Send Message
Homepage
Yotesgames.com
Release date
Game watch
Follow
Share
Community Rating

Average

-

0 votes submitted.

You Say

-

Ratings closed.

Style
Theme
Fantasy
Players
Single Player
Project
Indie
Twitter

Latest tweets from @tonyyotes

If you replay #SonicMania's OST as often as I do, you'll wanna jam to this @tnywvs remix album: Tnywvs.bandcamp.com

Nov 15 2017

Here's today's #pixelart pony. #brony #indiedev T.co

Nov 13 2017

Pre-Alpha party management system #gamedev T.co

Nov 13 2017

An intense flamethrowing move in Battle Gem Ponies! #gamedev T.co

Nov 13 2017

Embed Buttons
Link to Adventures in Equica: Unicorn Training by selecting a button and using the embed code provided more...
Adventures in Equica: Unicorn Training
Statistics
Last Update
Watchers
1 member
Articles
1
You may also like
RobotFall
RobotFall Real Time Shooter
StarForge
StarForge Real Time Shooter
Heroes & Castles
Heroes & Castles Real Time Shooter
Fiends
Fiends Real Time Shooter
McDROID
McDROID Real Time Shooter
Farts VS Zombies
Farts VS Zombies Real Time Shooter