Introducción al Desarrollo de Videojuegos con GameMaker · Module 1: Introduction to GameMaker, Installation, and First Project
Getting Started with the Workspace and Assets
Lesson 3 of 60 · 50 min
Also available in: ES
Introduction to the GameMaker Integrated Environment
Over the years, the GameMaker Integrated Development Environment (IDE) has evolved into an agile, flexible, and highly visual ecosystem designed to support both solo indie beginners and seasoned commercial studios. When you open the software for the first time, it is easy to feel overwhelmed by the sheer number of toolbars, panels, buttons, and contextual menus. Beneath this visual density, however, lies an exceptionally logical architecture built to make 2D game development straightforward, ensuring that every visual asset, audio clip, and piece of logic has a predictable and accessible home.
GameMaker's core philosophy centers on the visual interconnection of its components. Unlike engines where code editing, level design, and resource management live inside rigid, isolated tabs, GameMaker uses an expansive, virtually infinite canvas. On this workspace, different elements of your game unfold in linked windows, allowing you to trace data flow and code behavior spatially. Learning how to navigate this environment, structure your project cleanly, and adapt the interface to your workflow is an essential first step toward turning any creative game concept into a polished reality.
General Anatomy of the GameMaker Interface
To master the IDE, we first need to identify the key functional areas that make up the main software window. Each of these zones handles a specific stage of the development cycle. The top bar houses global menus for file handling, editing, and builds, alongside quick-access buttons to run the game in standard mode (play icon) or debug mode (bug icon), as well as target platform selectors. Surrounding this bar, the main operational panels are arranged across the screen.
| Component | Default Location | Primary Purpose |
|---|---|---|
| Menu Bar and Controls | Top edge of the screen | Project management, running the game, debugging tools, and build target selection. |
| Asset Browser | Right side (or left, depending on preferences) | Organizing, creating, searching, and structuring all game assets in a clear hierarchy. |
| Workspace | Central area of the interface | An infinite two-dimensional canvas where asset editors, event lists, and code windows open and interconnect. |
| Inspector Panel | Adjacent to the Asset Browser | Quick inspection and editing of properties for the currently selected asset or instance. |
| Output and Console Bar | Bottom edge of the screen | Displays compiler messages, syntax warnings, runtime errors, and live debug logs. |

Deep Dive into the Asset Browser
The Asset Browser is the central nervous system of any GameMaker project. This panel houses every visual, audio, and logical element that breathes life into your game. Far from being a simple operating system file viewer, the Asset Browser stores metadata and internal links that the engine relies on to interpret your project. Every asset created here receives a unique identifier that you will reference both when designing levels and when writing GameMaker Language (GML) code.
Within the engine, assets are grouped into distinct categories based on their function and role. Becoming familiar with the most common asset types is essential before you start populating your project tree:
| Asset Type | Recommended Prefix | Core Role in the Project |
|---|---|---|
| Sprites | spr_ | Static images or multi-frame animations that define the visual look of characters, environment props, and UI. |
| Objects | obj_ | Interactive logical entities that hold variables, event listeners, and gameplay behavior scripts. |
| Rooms | rm_ | Levels or game screens where object instances are placed and interact with one another. |
| Sounds | snd_ | Sound effects and background music tracks imported in formats such as WAV, MP3, or OGG. |
| Scripts | scr_ | Collections of custom GML functions and helper routines that can be reused across multiple objects and events. |
| Fonts | fnt_ | Vector or bitmap typefaces rasterized by the engine to render crisp text on screen. |
| Tile Sets | ts_ | Optimized image grids used to paint level geometry and backdrops efficiently onto tile layers. |
| Sequences | seq_ | Cinematic cutscenes, UI transitions, and screen animations controlled via a visual timeline editor. |
| Shaders | shd_ | Programs executed directly on the GPU to render advanced graphical and post-processing effects. |
Consistent asset naming is one of the most valuable professional habits you can develop in game programming. In GameMaker, all asset names share a single global namespace across the entire project. This means you cannot name a Sprite and an Object with the exact same identifier. If you call both your character's art and their interactive logic 'player', the compiler will flag a critical identifier collision error. To prevent this, standard industry practice is to append a concise three-letter prefix followed by an underscore indicating the asset type (for instance, 'spr_player' for the graphic and 'obj_player' for the logic).
💡 Golden Rule: Asset names in GameMaker must never contain spaces, punctuation marks, or accented characters. They must always begin with a letter or an underscore and use only alphanumeric characters (A-Z, a-z, 0-9) and underscores (_). For example, use 'spr_coin_bronze' instead of 'spr_coin bronze' or 'spr_coin#1'.
Advanced Organization: Folders, Tags, and Filters
As a game project expands, its asset list can quickly grow from dozens to thousands of individual items. Without a clear organization strategy, locating a specific animation frame or utility script becomes tedious. The Asset Browser helps you keep projects manageable through two complementary tools: traditional hierarchical folders (Groups) and dynamic metadata labels (Tags).
Folders (groups) allow you to arrange items according to your team's workflow. Developers generally follow one of two popular conventions: grouping strictly by asset type (with dedicated top-level folders for Sprites, Objects, and Rooms) or grouping modularly by game subsystem (such as a 'Player' folder containing 'spr_player_idle', 'spr_player_run', 'obj_player', and related scripts). For beginner and intermediate projects, a balanced hybrid approach works best: top-level folders organized by asset type, containing feature-specific subfolders inside.
Tags introduce a flexible, non-hierarchical categorization layer. You can attach the same tag to multiple assets regardless of which folder they live in. For instance, you could assign the tag 'enemy' to 'spr_slime', 'obj_slime', 'snd_slime_hit', and 'scr_slime_ai'. Using the search and filter bar at the top of the Asset Browser, you can filter by the 'enemy' tag to isolate all related assets instantly, bypassing the folder structure altogether.
The Workspace and the Infinite Canvas
The Workspace is the interactive visual centerpiece of GameMaker. Unlike traditional text editors or IDEs that rely on rigid, full-screen tabbed layouts, the Workspace is an open, two-dimensional canvas where chained floating windows live side by side. Double-clicking an asset in the Asset Browser opens its editor window on this canvas. If you inspect an Object and click on one of its event actions, a secondary code editor window springs up, visibly linked to the parent object by an elastic connector line.
This spatial layout lets you inspect an object's main settings, collision masks, assigned events, and underlying GML code simultaneously within a single panoramic view. Moving through this infinite canvas efficiently requires getting comfortable with mouse and keyboard navigation shortcuts:
| Navigation Action | Mouse Input / Keyboard Shortcut | Practical Result |
|---|---|---|
| Pan (Scroll canvas) | Click and hold the Middle Mouse Button (scroll wheel) + Drag | Glides the camera smoothly across the canvas without selecting or moving windows. |
| Alternative Pan | Hold the Spacebar + Left Click and Drag | Provides smooth, reliable canvas navigation when working on a laptop trackpad. |
| Zoom In / Out | Hold Ctrl (Cmd on macOS) + Scroll the Mouse Wheel | Zooms the workspace view in or out to inspect close-up code or take in a wide birds-eye view. |
| Frame Selected Window | Press F12 (or double-click the window title bar) | Instantly centers and frames the active window in the middle of your screen. |
| New Workspace Tab | Click the '+' icon on the top tab bar | Opens a fresh, blank workspace canvas to keep distinct systems or sub-projects tidy. |
💡 If you ever lose your place on the infinite canvas and cannot track down an open window, press Ctrl + T (Cmd + T on macOS) to open the 'Go To' quick-search palette. Type the name of the asset you need and press Enter: the Workspace camera will instantly glide across the canvas and frame that window.
Panel Management: Docking and Floating Windows
One of the most practical features of GameMaker's modern interface is its flexible docking engine. Peripheral panels—including the Asset Browser, the Inspector, the Output console, and room layer lists—are never permanently locked into place. You can detach any panel by clicking and holding its tab or header bar and dragging it away from the window frame.
As you drag a panel across the screen, blue docking guides will highlight available drop zones along the screen edges and adjacent to other open panels. Releasing the mouse over one of these guides snaps the panel cleanly into that side of the interface, automatically resizing surrounding panels to share the space. If you drop the panel into an open area away from any guide, it turns into an independent floating window.
Floating panels are especially powerful for multi-monitor setups. In a professional dual-monitor setup, you can dedicate your primary screen entirely to the infinite Workspace and code editors, while moving the Asset Browser, Inspector, and debug console over to the secondary display. This maximizes your visual workspace for level editing and logic flow without sacrificing fast access to your asset library.
The Inspector Panel: Unified Contextual Editing
Historically, tweaking an asset in GameMaker required opening a dedicated window inside the Workspace for every single change. Modern versions solve this clutter with the contextual Inspector panel. Working similarly to property inspectors in digital content creation tools and modern game engines, a single click on any asset in the Asset Browser or any instance placed in a Room immediately displays all its configurable properties inside this compact side panel.
Using the Inspector, you can adjust a Sprite's origin point, assign a sprite to an Object, tweak visibility, or toggle persistence without cluttering your Workspace with an extra chain of windows. This keeps the central canvas tidy and speeds up repetitive property tweaks significantly.
System Preferences and Environment Optimization
A step that many new developers overlook is fine-tuning the IDE's Preferences. GameMaker installs with conservative defaults intended to run safely across all kinds of hardware, but taking a few minutes to configure key settings early on prevents accidental work loss, boosts IDE responsiveness, and tailors the editing experience to your ergonomic needs.
To open this window, go to the top menu and select 'File > Preferences' (or 'GameMaker > Preferences' on macOS). You will find a hierarchical settings tree covering everything from general appearance to compiler paths and asset pipeline tools.
| Preferences Category | Recommended Setting | Configuration & Benefit |
|---|---|---|
| General Settings > Paths | Project Location | Set this to a reliable local fast drive (SSD), avoiding cloud-synced folders (like OneDrive or Dropbox) that can lock files during compilation. |
| General Settings > Workspaces | Single Click to Open Resources | Disable this option to prevent accidentally opening cluttering windows; rely on deliberate double-clicks instead. |
| Text Editors > Code Editor | Font Size & Family | Increase font size (12-14 pt) and choose a clear monospaced typeface (such as Consolas, JetBrains Mono, or Fira Code) to reduce eye strain. |
| Text Editors > Code Editor | Code Completion Delay | Set to a low value (150-200 ms) so autocompletion tooltips appear swiftly as you type GML code. |
| General Settings > Compiling | Automatically Save Project | Keep this enabled. It forces GameMaker to save all pending changes before compiling and testing your game. |
| General Settings > Backups | Backup Interval & Max Backups | Set automatic backups to every 10-15 minutes with a pool of at least 10 rotating revisions to recover smoothly from unexpected crashes. |
💡 Critical Cloud Sync Warning: Do not keep your active, open GameMaker project folders inside directories automatically synced by OneDrive, Google Drive, or Dropbox. Background sync processes can lock project JSON files mid-save, leading to project file corruption during compilation. Always work out of a dedicated local directory (e.g., 'C:\GameMakerProjects\') and rely on manual backups or Git version control for cloud redundancy.
The Code Editor and Visual Customization
GameMaker's built-in code editor includes smart syntax highlighting, auto-indentation, and real-time syntax checking through a built-in static analyzer (linter). Under 'Text Editors > Code Editor > Styling' in Preferences, you can adjust the color scheme assigned to each language token. By default, GameMaker highlights GML syntax using distinct colors:
| Syntax Element | Default Theme Color | Conceptual Meaning |
|---|---|---|
| Built-in GML Functions | Warm Orange / Brown | Native engine functions and procedures (e.g., instance_create_layer, place_meeting). |
| Built-in Variables | Bright Green / Emerald | Automatic instance-level properties managed by the engine (e.g., x, y, speed, sprite_index). |
| Custom Variables | Light Blue / Cyan | User-defined variables initialized in your scripts and events (e.g., hp, jump_speed). |
| Constants and Asset IDs | Golden Yellow | References to asset identifiers, built-in constants, and keycodes (e.g., vk_space, spr_player). |
| Strings | Light Gray / Cream | Literal text fragments enclosed in quotation marks (e.g., "Score!"). |
| Comments | Muted Olive / Pale Green | Developer notes prefixed with // or enclosed in /* */ that the compiler skips entirely. |
Learning these color cues makes it easy to catch typos before compiling. If you declare a custom variable like 'player_speed' and the editor paints it yellow or green instead of light blue, you know immediately that you accidentally collided with a reserved system keyword or an existing asset name.
Practical Walkthrough: Setting Up the Workspace for a Retro Platformer
To solidify what we have covered and prepare your environment for building our 2D retro platformer, let us walk through a complete workspace setup exercise. This structured routine establishes a clean, reliable foundation for the upcoming coding lessons.
With these adjustments in place, you have transformed a generic default interface into an organized, clutter-free workspace safeguarded against accidental data loss. Maintaining clean asset hierarchies and navigating the IDE comfortably are the hallmarks of an efficient, professional game developer.
Hands-on Consolidation Exercises
Complete these three exercises to practice canvas navigation, panel docking, and asset structuring. Verify each result against the provided success criteria before moving forward.
Summary
- GameMaker's IDE is built around an infinite 2D Workspace canvas, complemented by customizable, dockable utility panels.
- The Asset Browser is the central hub for all game resources (Sprites, Objects, Rooms, Sounds) and requires disciplined naming prefixes (spr_, obj_, rm_).
- Projects stay organized over time by pairing a structured folder hierarchy with dynamic metadata Tags and quick filters.
- The docking system lets you detach panels into independent floating windows, making multi-monitor workflows smooth and flexible.
- The contextual Inspector panel lets you edit asset properties instantly with a single click, keeping the Workspace canvas uncluttered.
- Configuring key Preferences early—such as auto-saving before builds, reliable backup intervals, and readable editor fonts—safeguards your project and maximizes development productivity.
Practise what you learned
Exercise 1 · 1 point
In GameMaker, it is perfectly valid to name a Sprite 'player' and an Object 'player' as well, since they belong to different asset categories.
Exercise 2 · 1 point
According to standard asset naming rules in GameMaker, which of the following resource names is completely valid?
Exercise 3 · 1 point
Match each action or shortcut with its corresponding function:
- Ctrl + T (Cmd + T on macOS)
- Mouse wheel / Pan
- Tagging system (Tags)
- Elastic link line
Sign in to save your progress — Sign in