【Unreal Engine】Editor UI Basics: Using Viewport, Outliner, and Details Panel

UE Editor Overview

When you first launch Unreal Engine (UE), have you ever felt overwhelmed by the countless windows, buttons, and panels before you? The UE editor is highly functional, but this complexity can be a major barrier for beginners. However, once you understand the main components and their roles, your learning efficiency will dramatically improve.

This article explains the roles of the main interface elements and basic operations for smooth development.

---

Main Editor Panels

The Unreal Engine editor consists of multiple windows (panels) specialized for different functions. First, understand the roles of the four most frequently used panels.

Panel Name	Role	Operations Beginners Should Learn
Viewport	The 3D workspace. Where you edit and view the Level (scene).	Camera movement, object placement/move/rotate/scale.
World Outliner	A list of all Actors (objects) in the current Level.	Object selection, hierarchy management, search.
Details Panel	Displays and edits properties (settings) of selected Actors or assets.	Adding components, direct input of position/rotation/scale values.
Content Browser	Manages all assets used in the project (models, textures, Blueprints, etc.).	Asset import, folder organization, search, drag & drop to Actors.

These panels have independent functions but work together to enable efficient Level construction.

---

Viewport Operations

The Viewport is the center of UE development. Becoming proficient here greatly affects your UE mastery.

2.1. Camera Control Basics

Camera control is similar to first-person game controls.

• Camera Movement: Hold right-click and use W (forward), S (back), A (left), D (right) keys.
• Camera Rotation: Hold right-click and move the mouse.
• Fast Movement: While holding right-click, scroll the mouse wheel up or hold Shift. You can also fine-tune speed with the Camera Speed slider in the viewport's top-right.

2.2. Object Manipulation Basics

Important shortcuts for manipulating Actors placed in the Level.

Operation	Shortcut Key	Notes
Translate	W	Move the selected object.
Rotate	E	Rotate the selected object.
Scale	R	Change the selected object's size.
Focus View	F	Instantly move camera to selected object. Use this when lost!

Best Practice: Efficient Viewport Operations

• Using Grid Snap: In UE5, grid snap is enabled by default. Click the grid icon at the top of the viewport to toggle ON/OFF. Hold Ctrl while operating to temporarily disable snap for free placement. Snap values can be changed from the dropdown next to the grid icon.
• Checking Game View: Press G to hide editor icons and gizmos (manipulation handles), showing the actual player view (game view).
• Locking Selection: Right-click an Actor in World Outliner and select "Lock Actor Selection" to prevent accidental selection. This can also be set in the "Actor" section of the Details panel.

---

Content Browser Usage

The Content Browser is your project's "warehouse." How you manage assets is key to project health.

3.1. Importing and Organizing Assets

• Import: Click the "Import" button or green "+ Add" button in Content Browser's top-left, or drag & drop directly from Explorer.
• Organization: Always organize related assets into folders. Following recommended folder structures (e.g., Blueprints, Materials, Meshes, Textures) eliminates confusion in team development.

Common Mistake: Breaking References

Directly moving or deleting assets in Content Browser can break other Blueprints or Levels that reference them.

• Correct Move Method: Within the same project, drag & drop within the UE editor, then always run Fix Up Redirectors (right-click > Fix Up Redirectors In Folder). Migrate is for copying to different projects.
• Caution: Force Delete ignores references and force-deletes, which can break other assets. Always verify reference relationships before using.

---

Blueprint Editor Basics

One of Unreal Engine's powerful features is Blueprint, a node-based visual scripting system. You can build game logic without programming knowledge.

4.1. Blueprint Basic Structure

The Blueprint Editor consists mainly of these elements:

• Event Graph: The main workspace for building logic. Place nodes and connect with wires.
• Components: A list of functionality the Actor has (meshes, cameras, lights, etc.).
• My Blueprint: Where you manage custom elements like variables, functions, and events.

4.2. Practical Blueprint Example: Simple Message Display

Here's the most basic Blueprint for displaying a message when the game starts.

// Blueprint Code (Event Graph)
// 1. Add Event BeginPlay node
// 2. Add Print String node
// 3. Connect execution pins (white arrows)
// 4. Enter text to display in In String
// 5. Compile and Save

// Pseudo-code for node structure
Event BeginPlay -> Print String (In String: "You've mastered editor operations!")

Explanation:

1. Event BeginPlay: An event that executes once when the game starts.
2. Print String: A debug node that displays specified text in the top-left of the screen.
3. Connecting these two nodes with execution pins (white triangles on the right side of nodes) completes the logic: "display text when game starts."

Important Step: After building logic, always click the Compile and Save buttons at the top of the editor. Changes won't apply to the game without this.

---

Details Panel and World Outliner Coordination

The Details Panel and World Outliner are the pair that governs Actor "settings" and "placement."

5.1. World Outliner: Scene Overview

In the Outliner, you can organize Actors into folders.

• Organization Tips: Create folders like Lights, Props, Characters to quickly find target Actors even in large scenes.

5.2. Details Panel: Property Editing

The Details Panel handles all settings for the selected Actor.

• Adding Components: Add meshes, particles, collisions, and other functionality from the Add Component button.
• Using Search: When there are too many settings, enter property names (e.g., Location, Material) in the search bar at the top for quick access.

Key Points for Editor Operations

The Unreal Engine editor is complex, but its basics can be summarized as a simple cycle: "place in Viewport, select in Outliner, configure in Details Panel, manage assets in Content Browser."

• Viewport Operations: W/E/R for object manipulation, F for focus, right-click+WASD for camera. Grid snap is ON by default, Ctrl temporarily disables it.
• Asset Management: Watch for reference breaks when moving/deleting in Content Browser, always run Fix Up Redirectors.
• Blueprint: Always Compile and Save after building logic.