Tutorial: How to create a minimap in Smile Game Builder
#1
(copied from "The Oceans Will Have Us All")

Hi, I'm going to do a few tutorials in Smile Game Builder showing some of the tricks I've used in The Ocean Will Have Us All.
If you have trouble seeing any of the images try right clicking and selecting "open image in new tab."

First up, here's how to make a simple mini map in SGB.


[Image: bdc3af96ed9aa872852d2242ca199f05646fac34.jpg]

Load up the map you want to create a mini map for.
Oh look, we already have a little map there. That's handy. Let's use that.
Take a screenshot and crop it down to just the minimap

[Image: ccb83af3ee1b47ee91373fe6c2524a317eb1b745.jpg]

Step 2
Resize your cropped image to match the size of your map. We want it at the scale of 1 block: 1 pixel.

So the map I'm using here is 11 by 20 blocks (you can find this in the map settings) so I resize the image to 11x20 pixels. Make sure to use "nearest neighbour" resizing.]

The image is very small. We could zoom the image in SGB, however it will use a blurry bicubic resizing algorithm. I prefer sharp, clear pixels so let's resize it in our image editing software.
I've resized this one by 400%. Make sure to use "nearest neighbour."

I've then also converted it to greyscale (optional.) Save your map image to a folder.


Step 3.

Create a one colour dot image. If you've resized your image to 400% create a 4x4 pixel image.

Save this into your folder with the map.

Step 4.
Import the images into SGB.
[Image: AVvXsEga1vIr5Rx3FkoFbGo1OoMJAqgq6TeqcbpF...L3AWg=s752]

BLOG: JayVinci.blogspot.com
FORUM COMING SOON
Currently working on:
Ambitions: RPG Developer Bakin
Heart of Vox: RPG Developer Bakin
Reply }
#2
[Image: 8f83a6e3695351c3178421dde29b90effc6b468c.jpg]

Add assets > Game images > Images. Click "Add."

[Image: 592b132a1f34b8dd4a0b2f28775ed0c0ff64a3a7.jpg]

Create an "advanced event" on an empty block on your map.

[Image: c27123afa8e726ce5353c62bc404c111c63e56fe.jpg]

Set the event to "Automatically Start (Synchronize and Repeated.)
Add a wait event, 0.1 seconds.



Step 6.
Add a "Display Image" event. Choose your map image, press "Select..." and drag the image to your desired location on the screen.


[Image: e9cf34fcd8ddc79e1411dc6adcdab8fc5cf0252d.jpg]
Step 7.
We now need to calculate where we will display the player dot on the screen.

Add an "Advanced Variable Box Op" event. We want to use a new variable and name it "PlayerX." Assign "Player Position", "X Coordinate."
Add another "Advanced Variable Box Op" event. This time use a new variable named "PlayerY" and assign "Player Position", "Y Coordinate."

[Image: ec019ac7666d7672f19672eeae0e9731bd09d040.jpg]
Step 8.

As I've resized my map by 400% we will need to multiply our coordinates by 4 times each.

[Image: c65258343b626a3954fa5c765268335f74d5626f.jpg]

Create two "Variable Box" events for the PlayerX and PlayerY variables to multiplay them each by 4 times.


Step 9.

Create a "Variable Box" event. Look at the X coordinate you've used on the "Display Image" event for the map. Use that number and add it to the "PlayerX" variable.
Create another "Variable Box" event. This time add the value of the Y coordinate for the map image to the "PlayerY" variable.



[Image: 7237958e7712d21db4741cce6a57e0985bd876d6.png]

Step 10.

And finally we display our player dot.

[Image: 419b44c3c9a25b73ec808f2824409d04da1be3b4.jpg]

Add another "Display Image" event. Make sure to assign a different "Image display number." Select the "Assign by Variable Box" radio button. Set X to the "PlayerX" variable. Set Y to the "PlayerY" variable.

[Image: 1c31511c9ff4f551716aa3b3681d7c1e078d6244.jpg]
Step 11.

Test the game. You should have a minimap on the screen showing the players current position. Yay. Wow. Nice.

[Image: 7e9ef4f8b7980ffb5ccb1e56122e29345730421b.gif]
[Image: AVvXsEga1vIr5Rx3FkoFbGo1OoMJAqgq6TeqcbpF...L3AWg=s752]

BLOG: JayVinci.blogspot.com
FORUM COMING SOON
Currently working on:
Ambitions: RPG Developer Bakin
Heart of Vox: RPG Developer Bakin
Reply }


Possibly Related Threads…
Thread Author Replies Views Last Post
   RPG Developer Bakin: Video Tutorial - How to make a Visual Novel JayRay 0 47 12-19-2024, 01:41 PM
Last Post: JayRay
   Smile Game Builder: Octopath Traveler Series by Jacob - DrassRay of Drattzy Games! JayRay 0 1,676 01-14-2023, 08:31 PM
Last Post: JayRay
Wink  RPG Developer Bakin: The Active Timed Battle System Tutorial JayRay 0 1,473 01-09-2023, 04:36 AM
Last Post: JayRay
   Game Variables kyonides 0 2,923 08-17-2020, 04:38 AM
Last Post: kyonides
   A Layman's Thoughs on Game Music DerVVulfman 2 4,851 09-01-2019, 03:32 AM
Last Post: DerVVulfman
   Mascots In Your Game (Basics) DerVVulfman 0 3,183 11-09-2018, 06:19 AM
Last Post: DerVVulfman
   A Guide to Properly Testing an RPG Game DerVVulfman 0 4,040 09-12-2018, 03:43 AM
Last Post: DerVVulfman
   Liberated Pixel Cup Tutorial DerVVulfman 2 7,343 08-30-2013, 03:23 AM
Last Post: DerVVulfman
   Simple Blood Tutorial ClockworkAngel 6 17,037 04-19-2012, 01:24 AM
Last Post: yamina-chan
   Shapeshifter Tutorial KasperKalamity 0 4,922 04-01-2012, 09:17 PM
Last Post: KasperKalamity



Users browsing this thread: 1 Guest(s)