© 18
20
N
IG
ED ES
TO M
k
eu
Ch ng
Lo
N
,C HA
To m
GAME DESIGN PORTFOLIO
UI/UX Design Plantopia
“Talking Things” The Preliminary Idea
Objectives & Goals: To deal with loneliness. To create a personal interactive phone application which the user could use the camera to transform surrounding objects to talking things through an augmented reality. Therefore providing temporary social needs as well as a virtual friend. UI/UX Design “Plantopia” | 7
Persona
8 | Design Portfolio by Tom CHAN
UI/UX Design “Plantopia” | 9
Design Function & Feature
“Talk to things�
Capture Use the camera to scan the surroundings to capture objects, the personalities are created by its colour, texture, size, etc.
10 | Design Portfolio by Tom CHAN
Personalize The things captured could be renamed or undergo other changes of its characteristics. User could also equip or apply doodle makeup to its appearance.
Organize User could manage the things by sorting and placing them in the virtual room. Functions like making favourite or removing things could be done in this mood.
Task Flow
UI/UX Design “Plantopia” | 11
User-Testing By using “POP� Low fidelity prototype with user interfaces and tested with a sample size of seven.
12 | Design Portfolio by Tom CHAN
UI/UX Design “Plantopia” | 13
Test Results
14 | Design Portfolio by Tom CHAN
UI/UX Design “Plantopia” | 15
Design Insight Possible improvements
#1 “Discover an item” May turn on cartoon mode initially.
#2 “Talk to an item”
#3 “View an item’s info”
May add talk function or info to direct way of communication.
Better UI design and may show item’s info once it is collected.
16 | Design Portfolio by Tom CHAN
User/Data Flow
UI/UX Design “Plantopia” | 17
“Plantopia” Cross-platform Design Developed from “Talking Things”
Objectives & Goals:
To treat plants better. By the personification of plant, it creates a sense of being so that the user will care more about it. A sensor will be assigned to each plant in order to track down the status and reminds user for extra care if in need. Each plant will have a individual personification, user could interact with them to know about their origins and biological characteristics.
18 | Design Portfolio by Tom CHAN
Persona
UI/UX Design “Plantopia” | 19
Wireframe & Mockup Core Screens
20 | Design Portfolio by Tom CHAN
UI/UX Design “Plantopia” | 21
22 | Design Portfolio by Tom CHAN
UI/UX Design “Plantopia” | 23
Design Pitch
24 | Design Portfolio by Tom CHAN
UI/UX Design “Plantopia” | 25
26 | Design Portfolio by Tom CHAN
UI/UX Design “Plantopia” | 27
28 | Design Portfolio by Tom CHAN
UI/UX Design “Plantopia” | 29
30 | Design Portfolio by Tom CHAN
UI/UX Design “Plantopia” | 31
Game Concept GEONS
“GEONS” The Gravity Puzzle Game “Manipulation of gravity, lost in dimensions!”
Overview: Story
Game Play
Plato’s secret adventure in the world of forbidden knowledge, Sophia.
Connect all the stars in a knowledge sphere in the shortest way.
Character
Key Features
You are the legendary philosopher Plato who could use geons to build bridge.
The bridge is extremely tortuous. The everchanging “ground” is also intriguing.
Genre
Target Machine
Puzzle, Arcade, VR
Android or iOS, Oculus
Game Concept “GEONS” | 35
36 | Design Portfolio by Tom CHAN
High Concept
One day, Plato was meditating on the relationship of geometric solids. He discovered a set of solids that possessed mathematical symmetric beauty beyond all the others. He was exited towards this discovery and named them “the Platonic solids”. While he was mesmerized by their construction, he passed out as being exhausted. Suddenly, he heard a voice was calling him. “Plato, Plato!”, he opened his eyes and tried to regain conscious. “Well done Plato, well done.”, he was confused and wondered what place was this. “This is the realm of intelligence. Wisdom and secrets are everywhere. The One has granted you this opportunity to bring some of these knowledges to the mortals.” The voice whispered. “But how? I don’t even know where am I.” He shouted out to the void. “Just use your willpower to connect those beautiful solids together to build a path. Beware of those dark spatial rifts, they will tear you apart and your conscious will left in limbo forever.” Plato was scared by that dark energy from the rift even in a distance. “Don’t worry, I have trust in you. Just reach to that beacon of light so that you could get to another dimension before this collapse. Now go, good luck!” As being overwhelmed, Plato shook his head and tried to focus his willpower to control those enormous solids. Unexpectedly easy, the first one was built. The great path begins...
Game Concept “GEONS” | 37
Map of Sophia
Sophia does not exist like a planet with its own geographical constraint. Instead, it’s a spiritual space that gods and entities teleport among them. The centre of Sophia is the realm of The One where he controls all the knowledges (includes the forbidden knowledges). Under his administration, there are several realms of individual major civilizations: Greek, Chinese, Egyptian and Hindu.
38 | Design Portfolio by Tom CHAN
Setting & NPCs
The Game World Sophia, the space of knowledge, is the secret realm controlled by The One which keeps all the knowledge of humanity. The One will grant these knowledges to the mortals to develop their civilizations from time to time. For each of the civilizations, a few “gods of knowledge” will be assigned to monitor their degree of development. The gods have their own realms like an office, whilst The One will grant them knowledges to be applied to their own people. The One want to see these knowledges to be put in good uses instead of leading a selfdestruction. Therefore, gods have to carefully apply them in order to let their own people thrive gradually.
Game Concept “GEONS” | 39
Sphere of knowledge If a god is being worshiped fairly by his own people, he could seek The One to give an appraisal for his own godship in terms of morality and prosperity of his people. If The One is satisfied for his management, a sphere of knowledge will be granted to the god.
The god has to comprehend the knowledge before applying to his people. Without this activation, the sphere will remain useless to them. The wisdom of a god of wisdom is depends on how greatly he is being worship in the mortal world. How wise is the god of wisdom? The greater the worship, the wiser the god.
40 | Design Portfolio by Tom CHAN
Gods of Knowledge For each of the realm of civilization, a few gods will be running the development depends on the beliefs of their own people.
Greek
Chinese
Apollo
Wenchang Wang
Athena
Bodhisttava of wisdom
Olympian god of light, music, poetry, knowledge, and the sun.
Olympian goddess of wisdom, war strategy, and civilization
Coeus
Titan of intellect
Metis
God of literature and scholarship.
Manjushri Kong Zi
Sage of education and culture
Lao Zi
God of wisdom
Oceanid of wisdom and wise counsel
Patron of scholars
Muses
Bao Zheng
Personifications of knowledge and the arts
Prometheus
Titan of forethought
Lü Dongbin
Star of scholars
Guan Yu
God of military scholars
Egyptian Neith
Goddess sometimes associated with wisdom.
Hindu Saraswati
Thoth
Goddess of knowledge and all literary arts including music, literature and speech.
Sia
God of intellect and wisdom.
God of wisdom and scribe of the gods.
Ganesha
The deification of wisdom.
Seshat
Goddess of wisdom, knowledge and writing. Scribe of the gods.
Isis
Goddess of wisdom, magic, health and marriage.
Serapis
God of knowledge and education.
Game Concept “GEONS” | 41
Plato Potato
Concept illustration by Joel Priddy
42 | Design Portfolio by Tom CHAN
Plato Potato PC, the protagonist Philosopher, God candidate
Description Height: 6’ 2” Weight: 165 lb Race: Greek Eye Color: Brown Hair Colour: Dark Brown Skin Colour: White Shape of Face: Long Distinguishing Features: The belt with the motif of platonic solids. Manner of Dress: Greek robes Mannerisms: Always playing with his beard. Health: Good. He is a health man in his mid-thirties. Hobbies: Studying philosophy and mathematics. Meditating. Speech Patterns: Often get impressed and said “Woah! That’s amazing!” towards the things that he saw in Sophia. Also, he will compliment the player in the game with this speech pattern like the voice effect in Candy Crush.
Attributes & Skills “Comprehend” Plato has been enlightened by a sphere of knowledge: the knowledge of Sophia, which he discovered the set of solids that could be used for comprehending every sphere. Pandora used the sphere on him to try unleashing all the forbidden knowledges. The way how Plato “comprehend” is to build connection between pivots (cubes) by solids.
Game Concept “GEONS” | 43
Pandora Concept Refs. by Aelin Ashryver Galathynius & Photographer: Sarah Brevick Model: Natalie Davis)
44 | Design Portfolio by Tom CHAN
Pandora NPC, the sidekick & the ultimate antagonist Goddess of Curiosity, Stalker of Sophia, Plato’s Guidance
Description Height: 4’ 9” Weight: 72 lb Race: Greek Eye Colour: White Hair Colour: Cyan Skin Colour: White Shape of Face: Diamond Distinguishing Features: Her glowing hair. Manner of Dress: Nude, covered by fog. Mannerisms: Always giggle at the end of her speech. Health: Unknown, seems no one is worshiping her. Hobbies: Observing people’s act of curiosity. Speech Patterns: Often compliment others and encourage other to do what they want to do. She likes give positive comment with a lot of words like “Woah! That sounds great! What don’t you give a try?”
Attributes & Skills “Hypnotize” Pandora could hypnotize other by making the target feeling craze towards their own curiosity. For those who get hypnotized, they will become kind of fearless but yet reckless for not taking any concerns about the consequences.
Interactions The player will be guided by Pandora in the beginning of the game. She will lead the play go through the main storyline until she got revealed by The One for her own conspiracy, unleashing all the knowledges to the mortals.
Game Concept “GEONS” | 45
The
One
Concept Art by Halil Ural and Fesbraa
46 | Design Portfolio by Tom CHAN
The One NPC, the antagonist? God of Sophia
Description The One is the genuine God in Sophia. His existence is the knowledge itself. He does not have an actual physical form like any other gods. All is one and one is all. Height: Unknown Weight: Unknown Race: Unknown Eye Colour: Unknown Hair Colour: Unknown Skin Colour: Unknown Shape of Face: Unknown Distinguishing Features: His voice would likely to be his all features. Manner of Dress: Unknown Mannerisms: Unknown Health: Unknown Hobbies: Unknown Speech Patterns: Slow and wise. Poems and riddles.
Attributes & Skills “Enlighten” The One could enlighten people or gods to make them wiser. The One has the wisdom to decide who should be wiser. There are gods that who were mortals before, it was The One made them god in Sophia.
Interactions The player confronts The One at the end of the story and realizes that he was hypnotized by Pandora. The One grant the player the wisdom to reverse his fault by sending Aristotle and Socrates into Sophia to aid him.
Game Concept “GEONS” | 47
Game
Flow
Mechanics Goal
To reach the destination from the starting point in the three-dimensional level. 50 | Design Portfolio by Tom CHAN
Building Blocks
By using these “Platonic Solids”, player builds a bridge to reach the destination. Game Concept “GEONS” | 51
Construction
The player will be assigned for a random solid each time. To build a “path”, player attaches the solid to the current solid’s edge. 52 | Design Portfolio by Tom CHAN
The angle of the connection could be adjusted by inputting the build command in the right moment of time. Player could also move to other edges to build by tapping the ground. Game Concept “GEONS� | 53
Checkpoints
On the way to the destination, player has to reach different checkpoints in the threedimensional level to gain points and game recourses like solids and time. The checkpoints are like the dots in constellation whereas each level reveals a zodiac of that particular civilization such as cancer for Greek. 54 | Design Portfolio by Tom CHAN
Scoring Base score for each solid:
Streaks Whenever a new solid is connected within a short period of time, a streak is accumulated. If the player succeeds to reach the next checkpoint within the limit of solids used, the more streaks performed, the higher marks the player gains. However, the difficulty increases whenever the streaks stack up by making the solids drop faster.
Score from checkpoint to checkpoint
Game Concept “GEONS� | 55
By following this mechanism, each checkpoint needs around 7 to 10 solids to connect which makes the average highest score (full combo) for each connection equals to 5,000 pt. 56 | Design Portfolio by Tom CHAN
Achievement
Each level will have different grading for the game result. From stage completed, to bronze, silver and gold. Game Concept “GEONS� | 57
Game Mode
Throughout the whole story, there are three types of game mode that the player will encounter. Each of the game mode has a slightly different gameplay in terms of restriction. Player will control different characters while experiencing in different game mode. Free mode is an arcade setting with no absolute ending. 58 | Design Portfolio by Tom CHAN
Game Fail
For each of the game mode, it has a different rule for losing the game.
For normal mode,
player will not lose.
For puzzle mode,
player will lose if all the solids had used up.
For time mode,
player will fail if the time ran out.
For free mode,
if the player ran out of time of solids, the game ends.
Game Concept “GEONS� | 59
Interface Home
60 | Design Portfolio by Tom CHAN
Settings
Game Concept “GEONS” | 61
Levels
62 | Design Portfolio by Tom CHAN
Shop
Game Concept “GEONS” | 63
Gameplay Main
64 | Design Portfolio by Tom CHAN
Interaction
Game Concept “GEONS” | 65
Goal!
66 | Design Portfolio by Tom CHAN
Stage Clear
Game Concept “GEONS” | 67
Puzzle Mode
68 | Design Portfolio by Tom CHAN
Fail
Game Concept “GEONS” | 69
Time Mode
70 | Design Portfolio by Tom CHAN
Fail
Game Concept “GEONS” | 71
Level Overview There are 60 levels in total for the whole game while divided into 5 chapters with 12 levels for each. The main storyline has a linear structure which the PC travels around different mini worlds. The chapters are “Greek Horoscope”, “Chinese Zodiac”, “Egyptian Symbols”, “Hindu Karma” and “All is One”. For each chapter, 12 levels are divided equally with 4 levels of normal mode, 4 levels of puzzle mode and 4 levels of time mode.
Normal Mode For each of the level map contains the distribution of all checkpoints while using varied size icons to show the depth of each checkpoint in the two-dimensional medium. There are two types of checkpoint. The normal one with the dot icon will give normal score for streak bonus while deluxe one with the star icon will give double score for streak bonus. Nonetheless, the streak limit for both of them shall be set around 7 to 10 for each checkpoint to checkpoint distance. The ranking of normal mode is close, as the player could only gain points by achieving high streak combos.
72 | Design Portfolio by Tom CHAN
Puzzle Mode While the building blocks in normal mode is unlimited but cannot be chosen by the player, the solids in puzzle mode are open to player to choose but yet limited. Each time player successfully reaches the checkpoint within limit, 8 solids (12 for deluxe) will be refilled to the player’s inventory (solids’ types are randomly assigned). If the player cannot reach the checkpoint within limit, only 7 solids (10 for deluxe) will be refilled. Player lose the game whenever run out of solids. However, if there is any solid left at the end of the game, extra points will be given for each in an accumulative algorithm. Therefore, the ranking of puzzle mode will have a further distribution in order the challenge player for saving the solids.
Game Concept “GEONS” | 73
Example: A-VII: Cancer
Total Score = Base Score + Sum of Extra Solids Bonus Point For this example, there are possible 20 extra solids that might left (Max – Min) and there are 15 checkpoints, therefore the basic score shall be in range of 30000 to 70000 (5000pt x 15).
Total Score of A-VII: Cancer = Basic Score ( 30000 ~ 70000) + Sum of Extra Solids Bonus Point ( 1000 x (1+2+…+20) ) 74 | Design Portfolio by Tom CHAN
By following this method of calculation, players are encouraged to try their best to save the solids. While having a high base score like 70000 but with less than 13 solids will only have silver rank, a low base score like 30000 but with more than 15 solids will have gold rank! Game Concept “GEONS� | 75
Time Mode The time mode has a similar mechanism to puzzle mode, but the solids refills will be replaced by time.
Note that 25 seconds (40 seconds for deluxe) will be refilled for each success connection of checkpoints within limit, 20 seconds (30 seconds for deluxe) if players fail to do so.
76 | Design Portfolio by Tom CHAN
Free Mode Both time and solids are limited resources in free mode. It works like an arcade game that is without an ending. Players shall build as much as connections of checkpoint they could within the progression of game’s difficulty. Multiplayer mode could also be applied that the level contains limited checkpoint whereas player compete to be the one who has the most checkpoint connection.
Secret Each level will have a secret checkpoint that contains a secret artifact that the player could collect them. Players could review them in the collectibles to read the story about them.
Game Concept “GEONS” | 77
78 | Design Portfolio by Tom CHAN
Game Concept “GEONS” | 79
Game Environment The Lightning Hall
The Lightning Hall
“The Lightning Hall” A Sci-Fi X Sino Game Environment “Follow the steps of God, unleash the Power of Lightning”
Hall Elevation
Chamber
Exterior Egnima
Game Environment “The Lightning Hall” | 83
Blockout in Maya
84 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 85
Blockout in Maya
86 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 87
Blockout in Maya
88 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 89
Block-Model Test in Unreal
90 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 91
Block-Model Test in Unreal
92 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 93
Basic Shaders & Lighting
94 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 95
Basic Shaders & Lighting
96 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 97
Basic Shaders & Lighting
98 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 99
Basic Shaders & Lighting
100 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 101
Hero Asset Development
102 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 103
Hero Asset Development
104 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 105
3D Scene Early Phases
106 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 107
3D Scene Early Phases
108 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 109
3D Scene Early Phases
110 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 111
3D Scene Mid Phases
112 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 113
3D Scene Mid Phases
114 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 115
3D Scene Mid Phases
116 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 117
3D Scene Mid Phases
118 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 119
3D Scene Mid Phases
120 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 121
3D Scene Final Phases
122 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 123
3D Scene Final Phases
124 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 125
3D Scene Final Phases
126 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 127
3D Scene Final Phases
128 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 129
3D Scene Final Phases
130 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 131
3D Scene Final Phases
132 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 133
3D Scene Final Phases
134 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 135
3D Scene Final Phases
136 | Design Portfolio by Tom CHAN
Game Environment “The Lightning Hall” | 137
Board Game Design Hoots, Claws & Feathers
“Hoots, Claws &Feathers” The Board Game “Owl gangs battle to take ownership of The Great Tree. Take control of a gang and fight your friends in this 3 players’ territory war!”
Overview: Three Owl Gangs: The Hoots, the Claws and the Feathers face off and fight to take ownership of The Great Tree. Take control of a gang and fight your friends in this territory war to show which Owl has the most power! This is a collaboration project with Erika Flusin, an environment artist. Board Game Design “Hoots, Claws and Feathers” | 141
142 | Design Portfolio by Tom CHAN
Out in the wild, the Great Horned Owl “Hoots”, the Eastern Screech Owl “Claws” and the Barn Owl “Feathers” have come across a conundrum: they all want the same tree to be their territory. As a 3 player game, each player takes up their Owl and quest to claim the tree as their own. Each Owl will call upon their recruits as back-up, sending them on missions to start taking over the tree 3 loyal recruits at a time. After all if an entire area of the tree is filled with their recruits, the tree is as good as theirs! It won’t be easy though, as sabotage is afoot and these feathered flyers are willing to push and shove each other to get their way - sometimes off of the tree entirely ! Even so, alliances will be made, and the owl in the lead best beware. However every successful mission and claim is rewarded, and the smarter these owls play the faster they’ll have the tree as their own!
Board Game Design “Hoots, Claws and Feathers” | 143
144 | Design Portfolio by Tom CHAN
What you’re playing with? “For a task like this, you need the proper equipment. Here’s what it looks like! ”
The Peons
The owls and the tokens!
Three types, one type to match each owl! The tokens are your recruits that you send off to battle on the tree, and the owls are there to mark officially claimed territory when your recruits have been successful in securing an area!
The Great Tree Board The territory players fight!
The Cards Character cards! Recruit Cards! Mission cards! Upgrade cards!
Board Game Design “Hoots, Claws and Feathers” | 145
Character Cards
You pick these to choose the Owl you’ll support, as well as defining the player order! Hoots goes first, with 1 recruit draw on the first turn, Claws goes second with 2 recruits and Feathers goes third with 3 recruits. The game goes on from there with each player drawing 3 recruits at the start of every turn !
Recruit Cards
You need these owls to complete missions! Your recruits are: The Predator, the Hoarder, the Scout and the Parliament! The Parliament cards are your wild cards, since these groups of recruits offer actions (such as sabotage!) OR they can stand in for any missing recruit on a mission! 146 | Design Portfolio by Tom CHAN
Mission Cards
You need to claim missions to send recruits and place tokens on the board! The cards show which recruits are needed. Mission cards are color coded, so the color of the mission completed will define where the recruits are allowed to go! After every success, rewards are given!
Upgrade Cards
When you have placed an Owl on the board, some areas grant player upgrades as rewards! Upgrades are really valuable, and give recruits awesome boosts! Competition beware!
Board Game Design “Hoots, Claws and Feathers� | 147
The Setup Every player starts off with their Character card, Owls, Tokens, 3 Mission cards & 5 recruits!
HOW TO PLAY Let’s go through how a first turn would play out! 1.
The Hoots will be the first player to go!
2.
Since it’s the first turn, draw 1 recruit card. You’ll now have 6 cards in your hand. Hide these cards from your opponents!
3.
Look to your mission cards. Check if you have the recruits needed to complete a mission. If you do, discard the recruit cards and claim and keep the mission card!
4.
You now have three recruit tokens to place on the board. Remember to place the tokens on the same colored feathers as the mission you completed! Claim the mission reward.
5.
Play any Parliament cards you wish to use. It’s now The Claws player turn!
148 | Design Portfolio by Tom CHAN
Board Game Design “Hoots, Claws and Feathers” | 149
150 | Design Portfolio by Tom CHAN
How to Win? When all feathers in an area are occupied by recruits, you place an Owl to officially own the area and claim the reward! The player that has placed the most owls by the end of the game wins!
The Game ends when either: 1. The board has filled up and there are no more possible moves, Or
2.
The mission cards have run out!
Board Game Design “Hoots, Claws and Feathers� | 151
Board Game Design “Hoots, Claws and Feathers” | 153
Board Game Design “Hoots, Claws and Feathers” | 155
Level Design Furinkazan
“Furinkazan” The 3D Platformer Game “As swift as wind, as gentle as forest, as fierce as fire, as unshakable as mountain.”
Overview: The project was conducted through four major stages. First is to establish a virtual world that provide a platform for immersive experience. Second is to set the major encounter event for players to interact with. Thrid is to design the whole level structure and flow. Last but not least is to masterize the experinces from those stages and create a final complete playable level. Level Design “Furinkazan” | 159
160 | Design Portfolio by Tom CHAN
Living World Create a world that has simple interactivity
Assets used in this scene is from the free package “Infinity Blade: Grass Lands” by Epic Games. Level Design “Furinkazan” | 161
Igniting Brazier
Branching Gate
162 | Design Portfolio by Tom CHAN
Levitating Rocks
Demonic Call
Level Design “Furinkazan� | 163
Ramming Doors
Pushing Statue
164 | Design Portfolio by Tom CHAN
Rolling Through
Hell Entrance
Level Design “Furinkazan� | 165
166 | Design Portfolio by Tom CHAN
First Encounter Combine event sequences into a complete experience
Complete three mini challenges to finish this encounter!
Level Design “Furinkazan� | 167
168 | Design Portfolio by Tom CHAN
Level Design “Furinkazan� | 169
170 | Design Portfolio by Tom CHAN
Level Design “Furinkazan� | 171
172 | Design Portfolio by Tom CHAN
Level Design “Furinkazan� | 173
174 | Design Portfolio by Tom CHAN
Level Design “Furinkazan� | 175
176 | Design Portfolio by Tom CHAN
Level Design “Furinkazan� | 177
178 | Design Portfolio by Tom CHAN
Level Design “Furinkazan� | 179
180 | Design Portfolio by Tom CHAN
Level Design “Furinkazan� | 181
182 |
Level Design Document
184 |
Level Design “Furinkazan� | 185
186 |
Level Design “Furinkazan� | 187
188 |
Level Design “Furinkazan� | 189
Level Design “Furinkazan� | 191
Level Design “Furinkazan� | 193
194 | Design Portfolio by Tom CHAN
Playable Level The “Challenge of Wind” level was created with Gameplay, UI and Sounds.
Assets used in this scene is from the free package “Infinity Blade: Ice Lands” by Epic Games. Level Design “Furinkazan” | 195
Game Menu
“Ancestral Hall”
Final Reward
Access Denied
Interior
The Ancient Text
196 | Design Portfolio by Tom CHAN
Interaction
Reveal the Ancient Text
Conditions of Final Reward
Lights Echoing
Lights on when approach
Enter the Level Level Design “Furinkazan� | 197
Entered level “Challenge of Wind”
Level Objective 198 | Design Portfolio by Tom CHAN
Initiate the Challenge
Preview of the Path
Destination
Green (Time) Pickup Tutorial Level Design “Furinkazan� | 199
Time Depleting
Time Replenished
Sprint (Ability) Tutorial 200 | Design Portfolio by Tom CHAN
Sprint Activated
Checkpoint Reached
Jump
Jump Failed
Player Died
Player Respawn on New Checkpoint Level Design “Furinkazan” | 201
Yellow (Cooldown) Pickup Tutorial
Cooldown Reset 202 | Design Portfolio by Tom CHAN
Sprint Activated
Time Running out
Ran out of Time
Player Respawn on Checkpoint
Picking up Yellow Crystal
Sprint & Jump
Destination Reached Level Design “Furinkazan” | 203
Level Half-Finished
Centre Brazier 204 | Design Portfolio by Tom CHAN
Display of Game Progression
Teleporter Activated
Teleport Back
Starting Place
Initiate the Other Challenge
Preview of the Path
Destination Level Design “Furinkazan� | 205
Turret
Player Get Hit
Turret Firing
Player Died
Player Respawn at Start
Turret Detected
206 | Design Portfolio by Tom CHAN
Health Pickup
Health Restored
Enter the Cave
Checkpoint Reached
Cooldown Reset
Sprint & Avoid Level Design “Furinkazan” | 207
Player Get Hit
Sprint
Advance Turret 208 | Design Portfolio by Tom CHAN
Health Restored
Half Time Passed
Player Get Hit
Sprint & Jump to Reach
Checkpoint Reached
Reaching the Final Destination Level Design “Furinkazan� | 209
Final Sprint
Keep Sprinting 210 | Design Portfolio by Tom CHAN
More Turrets
Final Destination
Level Finished
Display of Game Progression (Level Finished) Level Design “Furinkazan� | 211
Redeem the Reward
Activating 212 | Design Portfolio by Tom CHAN
Activated
Ability Unlocked
Return Path
Level End Level Design “Furinkazan� | 213
VR Game Production LIVE @ 5
“LIVE @ 5” The Weather Reporter Game “This is Maria Weather, Reporting Live!”
“LIVE@5” is a VR game where you play as a weather reporter. You must complete your reports as the weather gets increasingly difficult to combat. The player plays as Maria Weather, the only reporter left alive after the apocalypse in Savannah. Deliver the first hand hot weather news to our sadistic citizens. A chance to experience CRAZY WEATHER conditions in this stylized VR environment! VR Game Production “LIVE @ 5” | 217
218 | The Team
The Team A SCAD Collaborative Project with ESRI Core teammates are students from Digital Media Major alongside Architecture, Sound Design, Writing and Performing Arts students
Core Team (left to right):
Other Majors:
Programmer
Artist
Sound Designers
Kuan LIU
Anna ROAN
Programmer & Game Designer
Game Designer & Producer
Jay BLASKO
Tom CHAN
Michael BRITT Ryan SULLIVAN Ashton FAYDENKO
Lead Programmer
Lead Artist
Drew DiCenso
Xiao Peng SHEN
Artist
Professor & Voice Actor
Jay BURNS
Aram COOKSON
Artist
Artist
Paige COLLINS
Muhammad AIMAN
Music Composer
Luke HAYES Voice Actress
Priya Ghosh Writer
Joaquin TRAPERO
VR Game Production “LIVE @ 5” | 219
220 | Savannah from ArcGIS
Savannah, The City Landscape Provided by Esri, The Geographic Information System Company
This SCAD collaborative project was a VR game production through Esri, a geographic information system company, and students from school of digital media of SCAD. The game environment was create based on the actual data of the landscape of Savannah by Esri ArcGIS. VR Game Production “LIVE @ 5” | 221
222 | HTC VIVE
The Virtual Reality system “Let yourself be visually, physically and emotionally amazed by new virtual worlds”
As a VR game, the HTC VIVE is the targeted hardware for player to interact with. It gives the player a headset with a screen, headphones, and two remote type controllers. In this game, the player has to battle using these tools as the reporter for blocking and dodging the flying objects. VR Game Production “LIVE @ 5” | 223
224 | The Gantt Chart
Project Management Coordination with Different Parties Schedule Planning & Resource Management
Since the production period is just ten weeks, which is particularly short for a VR game production, a wellorganized project management is needed. Having a team of nine people, we specialized teammates into either programming, art or design whereas sound design and other required talents were outsourced. After all, the project was gone under good execution with an alpha version of the game delivered at the end. VR Game Production “LIVE @ 5� | 225
226 |
Game Mechanics “Bet you were terrible at dodgeball.”
The core gameplay of this VR game is to dodge the incoming objects from different direction which will gradually kill the character. Not all flying objects are relatively harmless trash. Larger items must be blocked by your hands/an in-game item, or dodged. Failing to do so will slowly lead to you blacking out from a strike. Once the player has endure for a certain amount of time, the player wins the level and moves on to next level with higher difficuties settings in terms of bigger and faster trashes. VR Game Production “LIVE @ 5” | 227
228 | The Train Stations
Collaboration with Architecture Students The Train Stations Design
“LIVE @ 5” also collaborated with students from School of Architecture. Each game level is located at a particular spot in Savannah which could potentially be an ideal site for a train station. They contributed the design of train stations with professional knowledge of architecture and gave uniqueness to each of the environments. VR Game Production “LIVE @ 5” | 229
230 | Reference Images
Art Direction Research In-Game Aesthetics & Style “What will it look like in the game?”
One of the most important things about VR games is that they maintain at least 60 frames per second (FPS). Any less, and the player will become nauseous. To aid computing power and still have sweet gameplay, low polygon models are typically used. VR Game Production “LIVE @ 5” | 231
232 | Environments with Different Weather
Environment Crazy Weather in Savannah “I bring you amazing news. It’s raining cats and dogs! ”
There are five environments in “LIVE @ 5”. Besides the Van interior which is the game menu environment, four other locations in Savannah were picked, restylized, set-dressed and assigned with a unique weather condition. One was even raining cats & dogs! VR Game Production “LIVE @ 5” | 233
234 | The Team
Characters & Props
VR Game Production “LIVE @ 5” | 235
236 | Scoring System & Game Balance
Level Design Game Balance & Sustainable Gameplay
VR Game Production “LIVE @ 5” | 237
Promo Video “This is Maria Weather, Reporting Live!”
VR Game Production “LIVE @ 5” | 239
240 | The Team
Final Presentation The Sell Sheet
VR Game Production “LIVE @ 5” | 241
© 18
20
N
IG
ED ES
TO M
k
eu
Ch ng
Lo
N
,C HA
To m
GAME DESIGN PORTFOLIO