- Designed the suspense narrative structure and prop-based environmental storytelling to guide player progression and puzzle-solving.
- Developed proximity triggers, UI/audio feedback, and level password validation logic; engineered in-game video projection for seamless cutscene transitions.
- Utilized ChatGPT to accelerate C# script drafting and prototyping, optimizing lightweight digital media game development.
Video Diplay
Game Development Workflow
1. Project Overview
Echo Town is a first-person exploration game. Players can freely move around a cemetery and progress through the story by interacting with characters, collecting items, solving puzzles, and watching videos, eventually triggering the ending.
2. Pre-Development Setup
· Import the cemetery environment asset package.
· Fix pink materials: go to Edit → Rendering → Upgrade Materials to URP.
· Enable Chinese language support: go to Window → TextMeshPro → Import TMP Essential Resources. Otherwise, Chinese text may not display correctly.
3. Core Development StepsStep
Step 1:Create the Player
· Create an empty GameObject named Player and set its Tag to Player.
· Add a CharacterController component: Radius 0.35 (character width), Height 1.8 (character height).
· Create a child GameObject named Camera inside Player and set its height to 0.7 to position the viewpoint near eye level.
· Attach the FirstPersonController script.
· Function: enables WASD movement, mouse-look, and interaction by pressing E.
Step 2: Build the UI
· Create a Canvas to contain all UI elements and attach the UIManager script.
· DialoguePanel: displays character dialogue.
· PromptText: displays “Press E to Interact” in the center of the screen.
· ItemDetailPanel: displays the item name, a 3D model preview, and a text description.
· PasswordPanel: allows numeric password input using buttons 1–0 and includes Clear and Cancel buttons.
· Assign all UI elements to UIManager so they can be managed centrally.
Step 3: Create the Game Management System
· GameManager — Game Progress Controller: tracks the current story stage, such as whether the player has met the old man.
· UIManager — UI Controller: controls the visibility of all UI elements.
· ItemPickupUI — Item Inspection Interface: displays information about collected items.
Step 4: Create the 3D Item Preview System
· Purpose: allows players to rotate and inspect items within the UI.
· Create a RenderTexture, a PreviewCamera, and a PreviewStage to hold the 3D models.
· Set the camera output to the RenderTexture.
· Display the RenderTexture in a UI RawImage.
· Configure the camera to render only the preview models.
Step 5: Create the Story Trigger System
· Create a trigger system using the TriggerZone script.
· Old Man Trigger (Trigger_OldMan): when the player enters the area, the old man’s dialogue is triggered and the corresponding story stage is unlocked.
· Cemetery Entrance Hint (Trigger_SearchingHint): the hint is triggered only after the player has met the old man.
Step 6: Create the Relic Collection System
· Place three collectible items in the scene: a pocket watch, a tape recorder, and an old photograph.
· For each item, add a Collider component, enable Is Trigger, and attach the CollectibleItem script.
· Gameplay: the player approaches an item and presses E to collect it; item information is displayed.
· Collecting all three items unlocks the next stage.
Step 7: Create the Tombstone Password System
· Add a trigger collider to the tombstone and attach the TombPassword script.
· The tombstone can only be interacted with after all three items have been collected.
· Press E to open the password input interface.
· The correct password is 716. Entering it unlocks the next story stage.
Step 8: Play the Story Video
· Place a plane (Quad) in front of the tombstone, add a VideoPlayer component, and hide the plane by default.
· After the player enters the correct password, the video display becomes visible and the story video starts playing automatically.
Step 9: Create the Subtitle Cutscene
· After the video ends, display: “The memories have been recovered, but she is still waiting.”
· Then display: “Head to the broken bridge by the lake.”
· The player presses E to advance to the next line and proceed to the next stage.
Step 10: Create the Opening Story Sequence
· Automatically play a six-part text-based story sequence when the game begins.
· Use the IntroSequence script to control the sequence.
· The player presses E to advance through the dialogue one line at a time.
Step 11: Create the Ending at the Broken Bridge
· Place an EndingTrigger area at the broken bridge and add the character Lin Xia to the scene.
· When the player approaches the trigger area, Lin Xia appears.
· The player presses E to initiate dialogue.
· Lin Xia gradually disappears using a fade-out effect, followed by the ending subtitles.
Step 12: Create the Main Menu
· Create a separate scene named MainMenu.
· UI elements: game title, Start button, and Quit button.
· Clicking Start loads the main game scene; clicking Quit closes the game.
4.Complete Game Flow
- Main Menu
- Opening Story Sequence (press E to advance)
- Meet the Old Man
- Explore the Cemetery
- Collect Three Relics
- Enter Password: 716
- Play Story Video
- Subtitle Cutscene
- Head to the Broken Bridge
- Lin Xia’s Ending