Game Basics SNG Game Play and System Planning
Hello
This is SNG game designer Park Hyeong-Seon
I'm here to tell you about SNG gameplay
and the process of system design
I will explain step by step
how you make a system design plan
as a systems designer
with some actual examples
and reviewing those plans
step by step
Through this process
I want you to imagine yourself
as a game systems designer
and that you are looking at an actual game design plan
and think of what you would have done
Game Overview and Gameplay Screen
First, let me go over the full plan document
A full plan is the detailed plan
for the entire game's system
It will first and foremost need a short description of the game
So it needs to describe
what this game is about
In this game, you are a villager in a farming village
and as you grow crops and sell them to make profit
the village will grow
Next is a flow chart of the game's major gameplay flow
and the elements of the game
You spend gold to install buildings, grow crops in the field
create products in facilities, make profit from customers and orders
then spend crops and products, earn gold
That is the major gameplay flow
The reason gold is spent in the beginning
is because there are no buildings to begin with
and you have to pay to build them
Which is why at the beginning of the game
the player has to have some gold to begin with
Otherwise the gameplay flow can't begin
The core elements of this game
is harvesting crops, producing products, and making profit
Here are the descriptions of these elements
You plant crops in the field to grow and harvest them
After you plant a crop
a set amount of time has to pass
for it to grow and be available for harvest
Also, after you get a workshop
these crops can be used as ingredients for crafting
But there are storages to store crops in
and storage space is limited
so storages also have to be expanded
that is a problem for the player to solve
So the system is made
so that there is a limit to storage space
in order to persuade the player
to make an in-game purchase
And as for the creating profit element
As the player's level increases
orders will be unlocked
and the player can fulfill NPCs' orders
to obtain EXP and gold
There will also be visitors
that buy whatever the player sells
So that's another way to get gold
Leveling up will also unlock the roadside shop
where you can sell items to other players
By selling products and crops
to other players
players can obtain gold
All of this gameplay content
also has to be made into a flow chart
When you plant crops in a field
the crop will grow and eventually be harvested
Those crops go in production buildings to be processed
You can try making this flow chart yourself
And as for the order board and roadside shop
That is where players can sell
their products to make a profit
But these exist
as objects and UIs
So the system works
by the player selecting them
to upload products or sell them
Or if a certain product is being requested
You have to deliver
the exact item in the requested number
to gain gold and experience points
There is also a social aspect to this game
You can visit friends' farms from your friend list
and help them out
This system exists to increase player retention
Retention means the percentage
of days that the player returns to the game
Because in order for the player to stay longer
they should have friends in the game
The social function exists
so that friends can communicate
such as asking each other for help
and visiting others' farms
Now, in order to design the overall game
you have to start from the gameplay screen
When you first turn on the game
After some notices pop up
you will see the default screen of the game
There are trees and fields
cows, pigs, chickens and so on
You can get eggs
or pork and beef from the animals
You could also get milk
So you can see where resources are made
Also on the screen
is a production building where you can put those resources through
If you press the friends button, you will see your friend list
If you press the store button, the store pops up
Let's look at
the composition of the initial gameplay screen
When you first begin the game
Not all of the areas will be open
For example, there will be 9 areas in total
and only the center will be open to begin with
Because if all of them are unlocked by default
that means all of the content is accessible from the beginning
Which will decrease players' retention
So you have to plan in detail
which areas will be open by default
and what the overall landscape
is structured like
in order for the artist to make illustrations based on that
and for the programmer to render the features
And as for the locked areas
usually if you select them, you will get a message
and you can unlock them
by leveling up or meeting certain requirements
then paying a certain amount of gold
Now you have to set
the initial building environment
This is a 30x30 field, for example
What does this mean?
You can see that the landscape is in a grid
A grid will have multiple cells
and it will have an X-axis and a Y-axis
30x30 means that it is 30 cells long, on both axes
Each building has a specific size as well
For example, the house is 3x4
so 3 cells on the X axis, and 4 on the Y axis
A tree will be 1x1 or 2x2
So you have to design
how large each building is
and also the size of the field
and all of the buildings
You also need to make an initial setup
of the buildings for the start of the game
Now then, let's set up the
zoom in & out options of the game
If this is a mobile game, for example
the game will initially begin
with the screen zoomed in
But that makes each of the buildings too large
and the player may want to see more things at once
To do that, you take two fingers
and pinch them to zoom out
That makes the screen look like the right image
But in order to implement this
you need to set up
how much the maximum zoom in
and maximum zoom out is
Once that's set up
you can send that to the client programmer
They will define between the phone screen
and the buildable area
and set the details of how much we can move the camera
in either Unity
or Unreal Engine
There has to be details
for all of the possible cases
such as maximum zoom out
and maximum zoom in
such as camera placement
and the X and Y coordinates
By setting the camera
based on how the phone screen would look
at maximum zoom
you can set standards
for the actual rendered camera
A common menu has to be set
for the gameplay screen
On the top, there would be
basic player information
player level, experience points
building limit, gold
crystals, and the option button
Most games will have
a building limit
which decides how many buildings you can have
So you can build up to a certain number
and in order to increase this number
you can build a special building
So building limits are a way
to put a limit on content
Crystals or gems are currencies
that require in-app purchases
They can be bought directly with cash
and are used to instantly complete things
In order for the player to gain experience
they can grow crops
make products, ship them to customers
and build buildings
By earning experience
the experience gauge will change from the before image to the after
These also have to be defined by the designer
You can design them using visuals and text
When the player levels up
the experience requirement changes
and some states of the player change
New content may be unlocked as well
These should go in a data table
Once the level increases
a pop-up will show the level up rewards
It should contain a message showing the gold and crystals
the player obtained
If there are none obtained, there shouldn't be a relevant message
If there is some content unlocked by leveling up
once the rewards pop-up is closed
there will be a pop-up of the unlocked content
It will show content the player can now access
such as new buildings
Leveling up also has the effect of making the player feel good
Hopefully then they will keep visiting the game
That is why buildings are unlocked one at a time
and leveling up provides rewards
But leveling up requires experience
There has to be information
on how much experience is required to reach each level
So now you have to design
a table of the required experience per level
The higher the player level gets, the higher the required experience
And so to the rewards
such as the amount of gold
You also need to plan out in detail the building limit
You can see on the top
there is a four leaf clover symbol
When you place a decoration, the gauge increases
and placing other types of buildings decreases the gauge
So you will have to figure out
the maximum building limit
and how to show that on the screen relative to the current limit
If you select the + button on the right of the building limit gauge
you will move to the decor store
You can see the UI on the screen
The store UI consists of multiple tabs
and if you tap on one, you get a list
So that's how to design a store
Next is resource UIs
If we want to get more gold
pressing the + button here will get us to the gold popup
You can get gold here
by buying them with paid currency
for example, crystals
So now we have the gold store
You also have to display the maximum amount of gold
In UIs such as this, you have to show the player
how much of the currency they can have at a time
Usually hundreds of millions
or billions is okay
You can display the maximum with nines like this
Next let's go over the options
When we are playing a game
we will sometimes open the options
to configure things related to gameplay
such as turning sound on or off
or just the ambience and sound effects
You can also usually choose from here
whether or not you want push notifications
The log out button can also be here
If there is an option that turns on or off
the button will switch between on and off as well
So for the music settings here
you can tap the button to switch it between on and off
If it's on, background music will be on
and if it's off, so is the BGM
The same is for sound effects
Push notifications can also be turned on
or off to block all messages
It seems simple when you see it like this
But if you were trying to plan in more detail
there are different types of notifications
For example, when crops are ready to harvest
or when a friend request has arrived
You first have to decide
what type each notification is
and how many types of notifications there are
Then you can decide if you will have one on/off button for all of them
or if you want them separate
when designing the game
The support button
will move you to the support web page when tapped
so when you have a problem
you can look at the FAQ
or talk to someone
So they often have a URL link attached to them
The credits button
is where you can see who the developers are
The terms & conditions button will get you to the terms & conditions page
When you create an account
or log in to the game
you will have to agree
to the terms & conditions and privacy policy to play
The help button will get you to the in-game help menu
The official community button
obviously moves you to the online community
So though we're just skimming over it now
because it is not the core part of the game
this is a necessary part of it
and you have to plan it in detail as well
Now we have to create a UI link
that moves the player from the gameplay screen
to the shop UI
When you click on the shop button
you are moved to the shop
When you first arrive, the store
should be in its default state
and detailed descriptions about the things on sale
should be a separate function
There is also a friends button on the main screen
through which you can access
the friends UI
You can see your friend list and add new friends
You can make the game so that it displays people
by category, such as friends, visitors, and people who helped you
There are multiple ways of implementing this
We could use an API
such as Facebook or Kakao
to add friends through them
Or we can use a social network service API
such as LINE
Or you can recommend people in the game
to other players
so they can make friends directly in the game
Each game takes a different approach
so you can choose your own policy
And what you have to decide next
is how to display friends on the UI
You can show human-like characters, or players' profile pictures
Or you can show images of other characters
by random, that's up to your choice
You also have to decide how much information
that friends will know about each other
You can show on the UI
the friend list, the list of visitors
and the list of people who helped this player
The reason I made the example this way
is just to make it visually tidy
You can make the friend profiles
so that if you click on one
you will go to their farm
That is a very common implementation
Now if you want to visit another player
to give them help
you can revive their wilted crops
or give them gifts, such as seeds
So through this social system
using a friend list
you can make players help each other out
and raise the retention rate
to a very very high level
The screen will move
from the player's farm to their friend's
When moving to another player's screen
the UI has to be different from yours
Because you are not playing like your home
but viewing your friends'
There are two meanings
to being able to view friends' homes
Firstly, there is an actual function
where you can help friends using the social function
such as giving them gold
and being of help to them
And the opposite as well
Your friend may help you
and appear on the helpers list
which makes you want to help them back
As a result
you will end up helping each other
making the two closer friends
You can leave a message on their visitor log
or chat together online
You might end up becoming friends
with someone you don't know in real life
But the second meaning is when you visit a friend
and you see that their farm
is much well decorated than yours
you become conscious of that
If your farm doesn't look nearly as nice
as your friend's
and you become jealous of their progress
you will start to wonder
how your friend got their farm to look so nice
so you will take a closer look
to get some ideas
By exploring your friend's farm
you will get some hints for a better looking farm
and your farm will progress as well
The charm of social network games
is that the buildings don't just have functions
but they can be decorated
by changing their color and such
If you visit your friend
and see how their decorations are placed
you can gain insight on how to decorate
and there is also a high freedom of placement
Social network games are fun
because you play them with friends
Anyway, when you move to another player's home
you can see the shop button is replaced with a 'my home' button
When you tap on it
you will return to your farm
So the designer has to get rid of the shop button that was there
and add a my home button
And if you want to make the social aspect a bit stronger
You can show players which friends visited your farm
and have a separate list
of visitors and friends who helped on the farm
Then the player will visit them back
and the social aspect is strengthened
Building Buildings and the Production System
Now let's learn about
the building system
The building system is the most basic of SNGs
Because in order to plant crops
and make progress
you need to build production facilities
and put resources into them
to make more processed products
So buildings either have function or are decorations
and they exist in the same building system
First you buy a building from the shop
then you place it wherever on the buildable area you want
The building is bought as you confirm your placement
and the building is now being built
After you place the building
a set amount of time will pass
before the building is complete
and you gain experience points
So you buy it from the shop, place and confirm
then time passes
and when the wait is over, you tap to complete
But you can alternatively spend crystals
to finish the building instantly
So instant completion
is often used to make building quicker
70 to 80 percent of profit from SNGs
come from players
who want to shorten their wait
I'll also go over moving buildings
If you want to move your building
after you have built it
You might want
to rotate the building
and/or move it around
So you also have to design buildings
so they can be selected and moved around
If you drag one over
and press the green check mark
it will be built there, or you can press the X button to cancel
and press the rotate button to rotate
Select building from the shop
move to the gameplay screen
place it where you want
and press confirm
That also confirms your purchase
And as time goes on
this gauge will fill up
and the building looks different according to progress
At first there's nothing but rocks and dirt
But then the middle stage looks like it's taking shape
Then there's the final building
One thing to take note of here
is that you will have to design
assuming your game is an SNG
a hundred, or even hundreds
of buildings
When designing a game
you also have to think of how to optimize visual resources
If you make every single stage
of every building different
if you have 100 buildings planned
there has to be 300 illustrations
Then it also takes thrice the time
and human resources
it will be a huge hassle
Which is why except for the final stage
it's better to use a shard image resource
When planning a game
you have to put costs into consideration as well
such as the cost of illustrations
If you use some assets as shared ones
the production cost will be reduced
and the player won't really care
So that is something you have to consider
when planning out the game
So after building begins
and the gauge is filled
you can press a button to gain experience
and the building will be completed with a satisfying sound effect
Once you gain experience
the experience gauge will fill up immediately
That also has to be designed in advance
so the art team can make the resources
and the client server
can implement that system
And you can also
instantly complete using crystals
By using paid items
such as crystals or whatever they are called
you don't have to wait
and as soon as the crystals are spent
the building will be complete
Though you need to balance the game a bit here
For example, if you are skipping 30 minutes
then you pay 1 crystal
you have to decide
the balance of time and currency
If you want to spend crystals to instant complete a building
and you don't have enough crystals
there should be a pop-up
that asks you if you want to get extra crystals
and moves you to the crystal shop
If you tap on a building that is being built
related information will pop up above it
The UI elements will show
a 'complete now' button, along with
how many crystals it will cost
So you should number the UI elements in the plan
with descriptions of what they are
Now let’s learn the details
of designing
the building moving menu
This is a buillding named a field
When you want to move it
you would usually have to long tap on it
Then an arrow-shaped gauge will appear
and it will fill up as you hold
Once the gauge is filled
there will be a check mark, X, and rotation mark that pops up
and you cna move the building
You have to plan the system
in detail in order for
building movement to be implemented
Now let’s move it
Tap the building in movement mode
and drag it to the place you want
and the building will move in that direction
once it’s in the position you want
and tap on the check mark
movement mode will be disabled
and the building will move to a new position
So that’s how you should design the gameplay flow
Rotating the building is easy
You press on the rotation button
and it rotates in one direction
So you just have to add a description
in the gameplay flow about rotation
Tapping the cancel button
will cancel movement and put the building back where it was
A building should not be moved
to a place where there’s already another building
To account for a situation like this
the building will be highlighted green
when its new position is viable
But when it isn’t, it will be highlighted red
and tapping the check mark won’t do anything
You can put descriptions for that
along with the UI, UX and gameplay flow
Next I will explain to you about
the production system
Product producing using animals
If you select a field
and a hungry farm animal
choose the type of feed to spend
and give it to the animal
then the animal will yield a product
First we have to desrcribe the gameplay flow
of getting a product, using a flow chart
The player taps on a pen with animals in it
or on a hungry animal
and give it feed to get products
Feeding an animal
is done by tapping and dragging
a hungry animal
So if there’s a hungry chicken
you need an icon to indicate
that it’s in a hungry state
So you have to put in the design plan
a request for illustrations that indicate that
Then you can see a hungry animal
and select and feed it
The play flow should explain
that feeding an animal by tapping or dragging
feed from the UI
will make it a nourished state
An animal cannot be fed if it’s full
So you can’t give it feed
So you also have to add exceptions
Now the animal is fed
what happens is that
in the chicken’s case it will produce eggs
So you can feed a chicken
to get eggs after some time
And after the eggs are collected
the chicken will get tired again
and become hungry
So the chicken has a hungry and full state
You can feed it and wait a while
then tap the chicken to get eggs
So this is another play flow
you have to design
it would be called something like
harvesting from animal
if you press the pail icon there
you can take the chicken’s eggs
It doesn’t seem very nice
The chicken probably doesn’t like it
But anyway, we can get eggs
When you harvest from an animal
so when you drag the bucket icon
you gain experience as well as products
so that has to go in
The icon of the product obtained, in the correct number
so the eggs, have to be displayed
and the experience bar has to increase
Animation effects
also have to be planned
so you have to direct the way the icons move
for it to be rendered in the client
and for the art team to make the asset
And you can also use crystals here
just like when instantly completing buildings
you can instantly complete
waiting for the chicken to lay eggs
And if you don’t have enough crystals, there will of course be a pop-up
So you can depict in the flow chart
how a hungry animal is selected
and fed with feed
and after a set time, the eggs can be harvested
There is a conditional here
that branches depending on whether it is true or false
And you can write the flow chart
in a way so that the programmer can understand
how each case should go
You also need a data table
Here is the ID, name, EXP
and crystal cost of each product
And also production time, product yield, base price in gold
minimum price, maximum price, production source, and feed required
You have to write the data table
including these columns
Now let’s learn about producing products in production buildings
These buildings are a very important part of SNGs
You select a building, then the product
and spend the required ingredients
to make a processed product
So you first select a completed production building
and drag the product you want
to the production slot
and spend ingredients to begin production
Let’s take a closer look at the UI
Once you tap the factory
A pop-up for selecting the product shows up left of the building
and below the building is the production slots
Now with the pop-up still up
you can touch the product you want
to lift the icon up
and above that will be a pop-up
of the product information
You can see that the icon
is enlarged with a shadow below it
to make it seem like it’s floating
and now it can be dragged around
and put into the slot
You can select and drag the product to below the building
and the icon can be out in the slot, which will be highlighted
Once the product has been put in
it is then in production
and will be finished in a certain amount of time
Likewise, because it takes time to finish
the player can alternatively spend crystals
to complete it instantly
So you can spend crystals to get products right away
and the production slot must be empty to begin producing
If all the slots are full, production can’t be started
And when the player tries to produce something
there should be effects that indicate that ingredients are spent
These kinds of effects need detailed explanations
provided to the UI designer or animator
in order for them to be created
So you should take care
to put a lot of detail into the effect descriptions
When a product is selected
if a product is already being produced in the first slot
the next slot will be selected
and dragging & releasing will place the product there
I also put in a description here
of how the spending of ingredients is shown as effects
This way
the art team can work on the effects
and so can the client
Let's also look at the details of the production building's pop-up UI
The selection UI plan
has a diagram on the left and descriptions of it on the right
There are each descriptions for
the production slots, queues, and button to add extra slots
A product will be unable to produce at the factory
when there is a missing ingredient
If an ingredient is missing
the game should be programmed so production doesn't happen
And the player should be notified with a pop-up
Ingredients can also be bought with crystals
but the player might not have enough crystals either
You also need a pop-up designed for that
And when the factory has finished producing
because enough time has passed
A small icon will start floating above it
and tapping on it will take you to a UI
so the storage UI
and you will get the item with a special effect
When a product is finished in the production building
the player obtains the product, and the storage UI appears
The number of products in storage will increase and EXP will also be obtained
So you have to design how that is represented
Production can also be instantly completed
using crystals
So you can try creating
an example UI
for when instant completion is used
and crystals are spent
If the player feels
that there aren't enough production slots
they can also spend crystals to add more slots
by pressing on the + button you can see here
and select 'add slot' on the pop-up and a slot will be added
Usually, each time a new slot is added
the crystal cost will increase
As you can see on the example UI
there can be up to eight slots in this game
They can be opened one at a time, using crystals
and each time a slot is opened, the cost increases
These you can also put in a data table
in order to implement
This is a flow chart
of production in the factory
The player selects a building and drags a desired product to a slot
Whether there are enough slots
and whether there are enough ingredients
These conditionals
will have different outcomes depending on whether they are true or false
To create a data table of the products produced from a building
you can make a list of all the possible products
and make them the rows of the table
Now, I'm going to talk about how to define harvesting fruits from trees
This mechanic
is simpler than that of the production building
It's not complicated at all
There are trees that grow fruits
But they are slightly different from fields
First, you should make a flow chart
of the process of harvesting a fruit
starting from placing the tree
Once a tree is placed in the building area
fruits will start to grow
You can grow them instantly for crystals
Once the fruits are ripe and ready to harvest
the player can obtain them
You can see there are fruits like this
Trees can be moved after being planted
Once they are planted, fruits will grow
and tapping the tree will let you harvest them
We have a bucket to harvest them with
So fruits can be harvested from trees
harvesting a fruit will obviously
also get you experience
Once fruits have been harvested
The thing about fruit trees
is that fruits don't grow from them infinitely
They will only grow about three times
before you have to get rid of the tree
And that costs crystals
So this is actually a system
where the tree takes up space
and you will eventually have to get rid of it
This is a system that requires in-app purchases
that revolves around the fact
that trees can only produce three times
So trees exist as a paid gameplay mechanic
Crystals can also be used here
to make the fruits grow instantly
You can also call friends for help
So when a tree is wilted, you can either pay to get rid of it
or use the social function
A friend
can visit your farm and revive the tree
So fruit trees are not just a paid feature
but also a social feature
If you call for help
and a friend responds, it will come to life again
But you can't do this infinitely
so sooner or later, you will have to pay to remove it
So you can revive friends' trees
by tapping on a tree like this
When a friend revives your tree
you can see from the icon
which friend is the one that helped you
And you can also click on it
to instantly move to that friend's farm
So the tree also provides a social feature
Of course, there has to be a flow chart
of the process of reviving a tree
harvesting from it
and the tree wilting again
So you should try creating a flow chart
starting from planting the tree, then harvesting from it
all the way to the tree wilting and being revived
As for the fruit data table
it contains information on apples, strawberries, lemons, grapes, and so on
And the columns will have information
on what type of tree each of them grow from
what level they are unlocked at, and their EXP yield
Those have to be set by the designer
Thank you for listening
Game Overview and Gameplay Screens Game Overview A brief introduction to the game The main progression of the game And a summary of key components Game Content Map Design Data
Gameplay screen Terrain composition Setting range of zoom Configuring upper menu
Building Construction and Product Production System Building Construction System Building Construction and Moving Building Construction Description Building Construction Directly Using Modification Building Movement Description
Production system Producing products using animals Producing products in production buildings Harvest fruit from trees