1 The Fighter Flies
One silver Fighter waits near the bottom of an empty sea. By the end of this chapter, it flies wherever you steer it, and never past the edge of its box.
The game as it is at the end of this chapter. Click the game to play.
If your game and this chapter part ways, here is the chapter’s finished project. Open it and compare, or start Chapter 2 from it.
To open it, start Myth Engine, choose File › Open Project... and pick the downloaded file.
1.1 The Idea
The Pacific Ocean slides slowly down the middle of the screen. It’s deep blue, with darker and lighter patches and the small white crests of waves. Dark riveted metal frames it, edged in gold. On either side, a pilot’s wings badge shines above the words SKY ACE.
Near the bottom of the sea, one silver Fighter waits.
By the end of this chapter, it flies. Hold an arrow key, and it goes that way, quick and steady. Let go, and it stops on the spot. Push it toward an edge, and it stops before it can leave, as if it had met a wall.
It looks as though the Fighter is flying on and on over the ocean. It isn’t going anywhere by itself. The camera stays where it is, and the sea slides down beneath it. That slide comes with the Pacific Ocean in the Starter Kit. No Logic of yours moves it.
So Sky Ace has two kinds of place, and this chapter builds both. The world is where the Fighter flies and the sea slides. It’s measured in meters, and its Y counts upward, so a small Y is low on the screen. The screen is the glass in front of you, measured in pixels. The frame lives there, and it never moves.
The frame is a riveted wall with a window in it. The Scene’s Main Camera decides what you see through the window: a piece of the world 22.5 meters wide and 30 tall. The Main View is the window itself, 720 by 960 pixels, in the middle of the screen. The two are the same shape. The 22.5 meters across fill the 720 pixels, and the 30 meters fill the 960, so nothing in the sea is stretched or squashed.
You’ll build very little of the flying by hand. Myth Engine comes with Logic Components that are already made, and this chapter uses two of them. Top-down Controls flies the Fighter. Keep Inside Box holds it inside its flying box.
Your keys reach them through a Command, one named control that several keys can work. Sky Ace’s is called Fly. Fly holds the arrow keys and W, A, S and D, and the Logic only ever asks it one thing: which way are you pointing? It never asks which key is down.
Each of those built-in pieces still lets the Fighter choose its own numbers. They’re its Variables: how fast it flies, and where the edges of its box are. Those few numbers are how the Fighter feels under your fingers.
1.2 The Plan
Here’s how the pieces work together. Read each line from left to right.
- An arrow key, or W, A, S or D, is held -> Fly points that way -> Top-down Controls flies the Fighter that way, at its moveSpeed.
- The key is let go -> Fly points nowhere -> Top-down Controls stops the Fighter.
- Every step -> Keep Inside Box looks at where the Fighter is, and puts it back on the edge of its box if it has crossed one.
- All the while -> the Pacific Ocean slides down by itself.
A step is one tick of the game’s clock, many times a second.
1.3 Set Up
Every game starts as an empty project, and an empty project is a strange thing to look at. There’s a dark Scene, a lot of buttons, and no game anywhere. It fills up faster than you’d think. By the end of this chapter, a Fighter flies in it.
This Set up makes the project and brings in the Starter Kit. Then it gives the game its screen, its Scene and the window the sea shows through. Here’s the whole card first. The paragraphs after it go down it from the top, and The Set up card on Making what a card shows has more on each block.
Left Arrow, ARight Arrow, DUp Arrow, WDown Arrow, S19201080Sky AceFullscreen19201080#05131F55%90%#0B3A5EGameplay · 2DIn Myth, choose File > New Project… and pick Blank 2D. Type Sky Ace as the Project Name, choose where it goes with Browse…, and press Create Project.
Then install the Starter Kit into it, with File > Install Myth Pack… and the file from the button below.
To install it, open Myth Engine, choose File › Install Myth Pack... and pick the downloaded file.
Myth shows the kit and what it adds, with Add to This Project already chosen. Press Install. Every picture, sound and background in Sky Ace is in your project now, so there’s nothing to draw. The card’s ART and BACKGROUND blocks name the ones this chapter uses.
The Layer line under BACKGROUND is the Pacific Ocean’s one layer, Ocean Swell, the picture of the sea. Image means that layer is a picture, not a fill of color. There’s nothing to change in it.
Leave COMMANDS for now, but read it. Fly arrives by itself with Top-down Controls, later in this chapter, and you’ll come back to check it. Don’t make it yourself, or you’ll have two.
The Game Settings come next. Open them with the Game Settings button above the Resources, and go down the card in its order. Under Display, the Window group’s Initial Width and Initial Height are the game’s size on your desktop, if you ever switch Window Mode away from Fullscreen. They come before Window Mode, because Fullscreen hides those two boxes. The Title is Sky Ace. Fullscreen makes the game fill your screen when it runs, the way it will for a player. Reference Width and Reference Height make that screen 1920 by 1080 pixels.
Next comes a color, written as a code. The Page Background (Outside the Game) fills the space around the game, when there is some. On a screen of another shape, the game keeps its own shape in the middle, and this color fills the strips beside it. Click the swatch, the small square of color, and type the code into the HEX box, after the # that’s already there.
The two Audio sliders set how loud the music plays, and how loud the sound effects play. Nothing makes a sound until Chapter 2. Set them now, while you’re here, and the first gunfire will already sound the way it does in the finished game. Drag each one until its reading shows the card’s number.
Then comes the SCENE block. Your new project already has one Scene, named Scene. The card calls it Gameplay and marks it new, but you don’t need a second one. In the Resources panel, open Scenes, right-click Scene, choose Rename, and type Gameplay.
Now the Scene’s own settings. Open Gameplay, pick the arrow tool above the preview, and click an empty spot. Its settings fill the Properties on the left. The card starts with the camera, so scroll down to Cameras and Views and press Add View. It makes the Main View and the Main Camera together, both the size of the whole screen.
The Main Camera’s boxes are right under its row, in Cameras. Give it the card’s numbers: X and Y for its Position, then its Visible Width and Visible Height, the view of 22.5 by 30 meters. The Position is the middle of what the camera sees. Half of the view lies above Y 18.75, and half below.
The Main View’s boxes are further down, under Views, in its On-screen area. Its Camera list already says Main Camera, as the card does. Here the order matters. Type its Width and Height first, then Left and Bottom. A View can’t reach past the top of the screen. While it’s still the screen’s full height, it has no room to rise, so a Bottom typed first doesn’t take.
Higher up, under Screen Backgrounds, pick the Pacific Ocean in the Add Background… list. That’s the card’s Background line.
Last comes the Background Color, at the top of the Properties. It’s the card’s deep sea blue, typed into the HEX box the same way. It shows only where no background art covers the Scene, so here it waits under the sea.
The next line, Start Scene, is back in the Game Settings, under General. It already says Gameplay · 2D. It followed the rename by itself. PLACE THESE waits until the frame and the Fighter exist.
Save your project now, with File > Save or Ctrl+S, and again at the end of each part.
1.4 The Frame
First comes the frame, the wall around the window.
The Screen Frame is one picture the size of the whole screen. Three dark riveted panels stand on each side, and a gold edge runs around the opening in the middle. The middle panel on each side carries a wings badge. The opening is where the sea shows.
The frame belongs to the screen, not the world, and the first three lines of its card say so. Make it an Empty Object, the way An Object card and its components on the Making page shows. Set its Space to Window / UI first. The Screen Anchor grid appears then, and the Render Layer turns to UI by itself. Center, on that grid, is the middle of the screen.
An Empty Object starts with nothing to show. Attach a Sprite from Rendering, in the Component Toolbox, and pick the Screen Frame Art. The frame lives on the screen, so its sizes are in pixels, and its picture is 1920 by 1080, the size of the screen. The Bounding Box, 128 by 128, isn’t the picture. It’s a box the Object keeps for itself, and nothing in Sky Ace measures from it. Type it anyway, so your frame matches the game’s.
The UI layer is drawn over the world. So when the Fighter reaches the edge of the window, it slides under the gold, never over it.
The frame’s Scene Depth Draw Order, 90, counts only among the things on the screen. Every bar, word and banner of later chapters takes a higher number, so they’re all drawn over the frame.
Window / UICenterUIX 128, Y 12890Screen Frame ArtX 1920, Y 1080Now place it. Open Gameplay, find Screen Frame under Predefined Objects in the Place Scene Content panel, and drag it onto the Scene.
Wherever it lands, type X 0 and Y 0 into its Screen Offset (px). That’s counted from its Screen Anchor, and from Center it’s the middle of the screen.
Run the game now. It fills your whole screen, and Alt+F4 closes it again. Keep those keys in mind, and press Play, the triangle at the top of the editor. The frame is there, and through its window the Pacific Ocean slides slowly down.
That’s your game, running. There’s no Fighter yet. Press Alt+F4, and the editor is back.
1.5 The Fighter
Next comes the Fighter itself, sitting still near the bottom of the sea.
It’s a silver plane with two long booms. There’s a propeller at the front of each, and the cockpit sits between them. It has a Collider, so make it a 2D Object. The Collider comes with it, but the Sprite doesn’t. Attach one from Rendering, as you did for the frame, and pick the Fighter Art. This time the sizes are meters, because the Fighter lives in the world. Its picture is 3 meters across. So is its Bounding Box.
Every new 2D Object starts as a Physics Object, something that bumps and pushes can move. The Fighter goes only where you steer it. So find the Physics section of its Transform, under the Bounding Box, and turn the Physics Object switch off.
A Scene Depth Draw Order of 30 decides what passes over the Fighter. The enemies of later chapters take lower numbers and fly under it. Enemy rounds take higher ones and pass over it, and so does one high, thin cloud.
The Collider is the part of the Fighter that can be hit. And it’s small. It’s a box about two-thirds of a meter wide, around the cockpit, a hair below the middle. When enemy rounds arrive in Chapter 4, only that box counts. A round that crosses a wingtip flies on.
The Collider also picks what it may touch, and what it may not. Under Tags and Interactions, pick Collide Only With in its Interactions list, so only what’s on its list can touch the Fighter. For now, that list is empty. The enemies join it in Chapter 3.
The Logic and the Shared Variables at the bottom of the card come in the next two parts. Make the Fighter without them for now.
X 3, Y 3Off30Fighter ArtX 3, Y 3X 0, Y -0.094X 0.656, Y 0.75Collide Only With10.3131.31321.1887.18830Place it from PLACE THESE. Drag Fighter onto the Scene, and type X 11.25 and Y 8.125 into its World Position. That’s the middle of the window, low down.
Run the game. The Fighter sits near the bottom of the window, nose up, while the sea slides under it. Press any key you like, and nothing happens. That’s right, for now. Alt+F4 brings you back to the editor whenever you’re done.
1.6 Flying
Now the Fighter learns to fly.
1.6.1 Top-Down Controls
Hold Right, and the Fighter slides right, quick and steady. Let go, and it stops on the spot. Hold Up and Right together, and it flies on a slant, no faster than it flies straight.
All of that is Top-down Controls, and it works by listening to Fly. At every step it asks Fly which way it points. Then it turns the answer straight into the Fighter’s speed: that way, at moveSpeed. When nothing is held, Fly points nowhere, and the speed is nothing. That’s why the stop is so sudden. There’s no gliding.
Flying on a slant isn’t any faster, either. Fly points on the slant as strongly as it points straight, so the speed stays the same.
You make it from the Starter list, in its Controls group. Its Events are already built. A Logic Component that comes built in, on the Making page, shows where that list is. When you press Create, Top-down Controls brings one more thing. It adds a 2D Axis Command named after itself to the Input Manager, with all eight keys already bound.
The sentence under its name on the card is Myth’s own description, in the engine’s words. In plain ones: its keys can be changed, it moves the Fighter in four directions, and all it ever sets is the Fighter’s speed. Two directions held at once make the slant.
The 6.875 under SHARED VARIABLES is its Starting Value, what every Object begins with. Leave it be. The Fighter’s own moveSpeed is on its card: 10.313, a little over ten meters a second. From one side of its box to the other takes about two seconds. That’s quick enough to dodge, and slow enough to aim.
Rebindable four-way movement assembled around one focused 2D Axis velocity primitive.
Any ObjectNow attach it. Open the Fighter, switch the list at the top right of the preview to Logic, and click Top-down Controls under Compatible Logic. It joins the Attached Logic, and it brings moveSpeed with it.
Switch the list back to Components, and look at the top of the Properties. Under Variables, in Shared Variables, moveSpeed has rows of its own, with a line under them: From Logic: Top-down Controls. Type 10.313 into its Value.
Then open the Game Settings and choose Input Manager, and there’s the Command, with its eight keys, each under its direction. Check them against COMMANDS on your setup card.
Its pencil button, Edit Command, lets you change its Command Name. Type Fly and press Save Command.
Run the game. Hold the arrow keys, or W, A, S and D, and the Fighter flies. Let go, and it stops.
Now hold Right a little longer. The Fighter slides under the gold edge and out of sight. It isn’t lost. It’s still out there in the world, past the edge of the window. Hold Left, and it comes back. The next part gives it a box, and closes the gap.
1.7 The Edges of the Box
Now the edges close in.
1.7.1 Keep Inside Box
Push the Fighter left or right, and it stops with its wingtip tucked under the gold. Up, it stops a little short of the top. Down, it drops only a little below where it started.
Nobody playing Sky Ace will ever notice Keep Inside Box, though every flight depends on it. It doesn’t push back, and it doesn’t steer. At every step it looks at where the Fighter is. If the Fighter has crossed an edge of its box, Keep Inside Box puts it back on that edge. Inside the box, it does nothing at all.
So there’s still only one thing that moves the Fighter, and that’s Top-down Controls. Keep Inside Box only tidies up after it.
Make Keep Inside Box from the Starter list too, in its Movement group. The box is four Shared Variables, in meters: minimumX and maximumX across, minimumY and maximumY up. The 0, 25, 0 and 18.75 on this card are only where a box begins. Yours may begin up and down at other numbers, because Myth’s starter has changed since this game was made. Leave them. The Fighter’s own four are on its card, and they replace all of them. The engine’s description under its name says what this part has said: every step, it holds the Object inside the box you give it.
Across, the Fighter’s box takes nearly all 22.5 meters of the window. Up and down, it leaves a strip free at the top and another at the bottom. Later chapters put their bars there: the gun level along the bottom in Chapter 2, and the score along the top in Chapter 3.
Clamps an instance to an authored rectangular play area every Step.
Any ObjectAttach it to the Fighter. It lands in the Attached Logic under Top-down Controls, and its four join moveSpeed under Shared Variables. Type the Fighter card’s four values into their Value boxes. Your hands know the way now. It’s the same list, and the same kind of box.
Run the game, and take the Fighter all around its box.
Watch for each of these.
- The game fills your screen. Dark riveted panels stand on either side, and the middle ones carry a gold wings badge, with SKY ACE under it.
- In the window between them, the Pacific Ocean slides slowly and steadily down.
- The Fighter waits near the bottom, nose up.
- Hold an arrow key, or W, A, S or D. The Fighter flies that way at once, and stops the moment you let go.
- Hold Up and Right together. It flies on a slant, no faster than straight.
- Fly from the left side of the box to the right. It takes about two seconds.
- Push left or right. The wingtip tucks under the gold edge, and the Fighter stops.
- Push up. It stops a little short of the top.
- Push down. It drops only a little below where it started.
- Press Alt+F4. The game closes, and you’re back in the editor.
The sea slides by itself. The frame sits on the screen, over everything. Top-down Controls turns Fly into the Fighter’s speed, every step. Keep Inside Box puts the Fighter back whenever it crosses an edge.
Underneath those four pieces is the idea this chapter started with, the two kinds of place. The world is in meters, and things move in it. The screen is in pixels, and things stay put on it. The Main Camera picks the piece of the world you see, and the Main View puts that piece in the frame’s window. Every chapter from here builds on both: the planes in the world, and the score and the gun level on the screen.
1.8 If It Didn’t Work
Something may be a little off the first time. That’s normal, and it’s how everyone learns where things live in the editor. Run the game, watch what it does, and think it through one piece at a time.
The game covers your screen, and the editor is gone? Press Alt+F4. It closes the game, and the editor is right behind it.
The game opens, but there’s no frame and no sea? Perhaps it started in another Scene. Look at Start Scene in the Game Settings, under General. It should say Gameplay · 2D.
The frame is there, but its window is a plain blue, and nothing slides? The sea is missing. Open Gameplay’s settings, and pick the Pacific Ocean under Screen Backgrounds, in the Add Background… list.
The frame is there, but a dark strip runs along one edge of its window? Look at the Main View. Width 720 and Height 960 go in first, then Left 600 and Bottom 60. If Bottom went in first, type it again now.
The sea covers the frame, or the frame sits small in a corner? Look at the Screen Frame’s Transform. Its Space should be Window / UI, with the Render Layer on UI. Then check its Sprite’s size, 1920 by 1080.
The frame sits off to one side? Select it in Gameplay, and look at its Screen Offset (px). It should read X 0 and Y 0.
No Fighter? Look in Gameplay for its placement, at X 11.25 and Y 8.125.
The keys do nothing? Open the Fighter and switch the list to Logic, where Top-down Controls should be in the Attached Logic. Then look in the Input Manager, where Fly needs its eight keys, each under its direction.
Two Commands in the Input Manager? If you made a Fly of your own, Top-down Controls never listens to it. It listens only to the Command it brought. Delete yours with the red button beside its pencil, and rename that one Fly.
The Fighter crawls? Perhaps the 10.313 never reached the Fighter. A Fighter flying at 6.875 still has the starting number. Open the Fighter, find moveSpeed under Variables, and type the card’s value into its Value. It wakes up.
The Fighter flies off the edge and keeps going? Keep Inside Box is missing from the Fighter’s Attached Logic, or its four Values still hold the starting numbers. They should read 1.313, 21.188, 7.188 and 30.
Each of these is one small fix. Make it, run the game again, and you’re back with the chapter. And if you’d like to compare, the catch-up download in the Goal is this chapter’s game, finished.
The Fighter’s numbers are yours to play with. Double its moveSpeed and feel how jumpy a plane can get. Halve it, and feel it wade. Move the edges of its box: let it climb right to the top of the window, or keep it low and close to home. The setup card’s Main Camera line tells you where the top is. Fly each one for a while, and find the Fighter that feels like yours. Then write your favorites down, and put the card’s numbers back before Chapter 2, which starts from them.
Still stuck? Search the manual, or ask in the Myth Engine Discord (opens a new tab).
One silver Fighter over an empty sea, and it flies. In Chapter 2, it gets its guns.