Difference between revisions of "Reskin Walkthrough"

From Pearhub Wiki
Jump to navigation Jump to search
m (clarification)
 
(3 intermediate revisions by the same user not shown)
Line 5: Line 5:
To check this, go to your build-settings (File->Build Settings...).
To check this, go to your build-settings (File->Build Settings...).
If it is set to WebGL, click on 'Dedicated Server' and press the 'Switch Platform' button in the lower right-hand corner of the window.
If it is set to WebGL, click on 'Dedicated Server' and press the 'Switch Platform' button in the lower right-hand corner of the window.
= Defining the Game Version =
You'll need to add
FarmingGame
to the 'GameVersion' enum in 'Assets/Scripts/CompanyMap/Master.cs'
[[File:110 farmingGameTutorialGameVersionEnum.PNG]]


= Adding Building Sprites =
= Adding Building Sprites =
Note that newly added Sprites must be set to be centered bottom center, so that they will align with all other sprites.
In 'Assets/Scripts/CompanyMap/Master.cs', add
In 'Assets/Scripts/CompanyMap/Master.cs', add


Line 28: Line 33:


Then drag the building images into the newly-created folder.
Then drag the building images into the newly-created folder.
Note that newly added Sprites must be set to be centered bottom center, so that they will align with all other sprites.


[[File:040 farmingGameTuroialImages.png|Building Images dragged into 'Assets/Images/CompanyMap/FarmingGame']]
[[File:040 farmingGameTuroialImages.png|Building Images dragged into 'Assets/Images/CompanyMap/FarmingGame']]
Line 36: Line 43:
[[File:050 farmingGameTuroialSprites.png|Inspector of '_Master' after adding the Sprites]]
[[File:050 farmingGameTuroialSprites.png|Inspector of '_Master' after adding the Sprites]]


= Adding the Building Type Definitions =
= Adding the Stats =
Add
// Farming Game
Farmhouse,
Field,
ChickenCoop,
Barn,
into the <code>BuildingType</code> enum in 'Assets/Scripts/CompanyMap/Building/Building.cs'
 
[[File:055 farmingGameTuroialBuildingTypes.png]]


Then, add
You need to add stats that every employee has.
// --- Farming Game ---
To do this, create a folder called 'FarmingGame' in 'Assets/Scripts/CompanyMap/Employee/StatTypes'.
case BuildingType.Farmhouse:
Then create
    effects = new Effect[]{
  AgricultureStat.cs
        new Effect<Company>(Owner, (building) => {Owner.Owner.prestige += 100;}),//DEBUG
AnimalHusbandryStat.cs
    };
  ForestryStat.cs
    slots = new Employee[2];
  MechanicsStat.cs
    break;
scripts inside of that folder.
  case BuildingType.Field:
    effects = new Effect[]{
        new Effect<Company>(Owner, (building) => {Owner.Owner.prestige += 100;}),//DEBUG
    };
    slots = new Employee[2];
    break;
  case BuildingType.ChickenCoop:
    effects = new Effect[]{
        new Effect<Company>(Owner, (building) => {Owner.Owner.prestige += 100;}),//DEBUG
    };
    slots = new Employee[2];
    break;
  case BuildingType.Barn:
    effects = new Effect[]{
        new Effect<Company>(Owner, (building) => {Owner.Owner.prestige += 100;}),//DEBUG
    };
    slots = new Employee[2];
    break
to the switch-statement in the <code>SetType</code>-method.


The line <code>new Effect<Company>(Owner, (building) => {Owner.Owner.prestige += 100;}),//DEBUG</code> can be replaced by any effect.
[[File:55 createStatScripts.PNG]]
The anonymous function (<code>(building) => {Owner.Owner.prestige += 100;}</code>) in the effect will be executed every tick.
In this example, 100 prestige will be added to the owner of the owner of this building.
That is to say that the player owning the company that owns this building will receive 100 prestige per tick.
Any legal C#-code can be written in this anonymous function.


'''Note that effects don't currently work though, and are still subject to change.'''
Note that you should create ''exactly'' 4 stats, as this is the number the game was designed and tested with.
However, it is technically possible to have more of fewer. If you want to experiment with the number of stats,
you should '''thoroughly''' test everything before shipping.


[[File:056 farmingGameTuroialBuildingSetType.png]]
Once you've created the scripts, open them and replace
: MonoBehaviour
with
: StatType


Next, in <code>DrawAreaOfEffect</code>, add
After you've done that, your IDE should underline the class-name and warn you that you need to implement inherited methods.
// --- Farming Game ---
If you hover over the class name with your mouse-cursor (or press Ctrl+. while your text cursor is on it), you should be prompted to implement
case BuildingType.Farmhouse:
those methods.
    GetNeighbor(NeighborDirection.NE)?.Highlight(Color.green);//DEBUG
    break;
case BuildingType.Field:
    GetNeighbor(NeighborDirection.NE)?.Highlight(Color.green);//DEBUG
    break;
case BuildingType.ChickenCoop:
    GetNeighbor(NeighborDirection.NE)?.Highlight(Color.green);//DEBUG
    break;
case BuildingType.Barn:
    GetNeighbor(NeighborDirection.NE)?.Highlight(Color.green);//DEBUG
    break
This is used to indicate to the player what effects the building has.
In this example, we simply make the north-eastern neighbor green, but the following image has a more elaborate example in <code>case Building.Office</code>.


[[File:057 farmingGameTuroialBuildingDrawAOE.png]]
Simply follow that suggestion by your IDE and it will automatically create all methods required.


Now, we'll add
[[File:056 implementStat.png]]
// --- Farming Game ---
case BuildingType.Farmhouse:
    s = Master.Instance.SpriteFarmhouse;
    break;
case BuildingType.Field:
    s = Master.Instance.SpriteField;
    break;
case BuildingType.ChickenCoop:
    s = Master.Instance.SpriteChickenCoop;
    break;
case BuildingType.Barn:
    s = Master.Instance.SpriteBarn;
    break;
to the <code>SetSpriteByType</code>-method. This simply associates the types we create with the sprites we added earlier.


[[File:058 farmingGameTuroialBuildingTypeSprites.png]]
After you've done this, all your methods will throw 'NotImplemented' exceptions.
You'll need to replace these exceptions with whatever makes sense for your stat type.


Finally, add
If you don't know what a method is for, you can hover over the method name with your mouse-cursor to get a brief summary of what the method should do.
// --- Farming Game ---
You can also look at how other stat types implemented that method.
case BuildingType.Farmhouse:
    res += "farmhouse";
    break;
case BuildingType.Field:
    res += "field";
    break;
case BuildingType.ChickenCoop:
    res += "chicken_coop";
    break;
case BuildingType.Barn:
    res += "barn";
    break;
to the <code>GetTranslationString</code>-method.
This will be used for adding translations for different languages.


[[File:059 farmingGameTuroialBuildingTypeTranslationString.png]]
Once you've defined your stat types, you need to register them in 'Scripts/CompanyMap/Employee/StatTypes/StatTypeInstanceManager.cs'.
To do this, add the following lines to the 'RegisterAll' method:
// Farming Game
Register<AgricultureStat>      (Master.GameVersion.FarmingGame, 1);
Register<AnimalHusbandryStat>  (Master.GameVersion.FarmingGame, 2);
Register<ForestryStat>        (Master.GameVersion.FarmingGame, 3);
Register<MechanicsSkill>      (Master.GameVersion.FarmingGame, 4);


= Creating the Store =
(The number to the right of the comma is the stat's unique ID.)


In 'Assets/Prefabs/CompanyMap/UI/Store', duplicate (Ctrl+D) the 'ProgrammingGameBuildings.prefab' file and rename it to something more appropriate, e.g. 'FarmGameBuildings'.
[[File:057 registerStats.png]]
Make sure to rename the newly duplicated file (ProgrammingGameBuildings '''1'''.prefab), not the original one(ProgrammingGameBuildings.prefab).


[[File:060 farmingGameTuroialStorePrefabCreation.png]]
If you should ever need to remove a stat after you've shipped the game, make sure that
you don't override it's ID with a different stat.
If, for example you want to replace Forestry with tractor-driving, comment-out the
Register<AnimalHusbandryStat> (Master.GameVersion.FarmingGame, 2);
line and add a
Register<TractorDrivingStat> (Master.GameVersion.FarmingGame, 5);
beneath MechanicsSkill.


Now, when you open the prefab (by double-clicking), you should see this:
= Adding the Building Type Definitions =
Create a 'FarmingGame' folder in 'Assets/Scripts/CompanyMap/Building/BuildingTypes' and create
Farmhouse.cs,
Field.cs,
ChickenCoop.cs,
Barn.cs
scrips inside that 'FarmingGame' folder.


[[File:070 farmingGameTuroialStorePrefab.png]]
[[File:60 addBuildingTypeScripts.png]]


To associate the item in the store with a building-type, click on it in the hierarchy and set the <code>Building Type</code> in the inspector.
Once you've created the scripts for your new building types, you'll need to edit them.
Firstly, you should replace the
: MonoBehaviour
with
: BuildingType


<code>Unlock Prestige Level</code> and <code>Preview Level</code> aren't implemented yet, but will be used to determine at what prestige-level the player sees a silhouette/preview of the building and when he is allowed to buy the building.
After you've done that, your IDE should underline the class-name and warn you that you need to implement inherited methods.
If you hover over the class name with your mouse-cursor (or press Ctrl+. while your text cursor is on it), you should be prompted to implement
those methods.


[[File:080 farmingGameTuroialStorePrefabBuildings.png]]
Simply follow that suggestion by your IDE and it will automatically create all methods required.


Lastly, you'll need to reference the new store-prefab in _Master by adding
[[File:70 implementBuildingType.png]]
public GameObject PfFarmingGameStore;
in Master.cs


[[File:090 farmingGameTuroialStorePrefabDeclaration.png]]
After you've done this, all your methods will throw 'NotImplemented' exceptions.
You'll need to replace these exceptions with whatever makes sense for your building type.


and dragging your store-prefab into that variable-slot in the _Master-inspector.
If you don't know what a method is for, you can hover over the method name with your mouse-cursor to get a brief summary of what the method should do.
You can also look at how other building types implemented that method.


[[File:100 farmingGameTuroialStorePrefabRegistration.png]]
Once you've defined your building types, you need to register them in 'Scripts/CompanyMap/Building/BuildingTypes/BuildingTypeInstanceManager.cs'.
To do this, add the following lines to the 'RegisterAll' method:
// Farming Game
Register<Farmhouse>        (Master.GameVersion.FarmingGame, 1);
Register<Field>            (Master.GameVersion.FarmingGame, 2);
Register<ChickenCoop>      (Master.GameVersion.FarmingGame, 3);
Register<Barn>            (Master.GameVersion.FarmingGame, 4);


= Changing the skin =
(The number to the right of the comma is the building type's unique ID.)


To test your new skin, you'll need to change the line under <code>// Instantiate Store</code> in 'Assets/Scripts/CompanyMap/Master.cs' to
[[File:080 registerBuildingTypes.png]]
Instantiate<GameObject>('''PfFarmingGameStore''', GoBuildingStore.transform);
where ''PfFarmingGameStore'' is the variable we created earlier.


[[File:110 farmingGameTuroialStorePrefabInstantiation.png]]
If you should ever need to remove a building type after you've shipped the game, make sure that
you don't override it's ID with a different building type.
If, for example you want to replace Farmhouse with Tractor, comment-out the
Register<Farmhouse>    (Master.GameVersion.FarmingGame, 2);
line and add a
Register<Tractor>      (Master.GameVersion.FarmingGame, 5);
beneath Barn.


Now, when you start the game, you can build your new buildings.
= Changing the skin =
 
Select the '_Master' GameObject in the hierarchy and switch the 'Current Game Version' variable in the inspector to 'FarmingGame'
= Adding building options =
(the name you created [[#Defining_the_Game_Version|earlier]]).
 
Currently, clicking on your newly-added buildings will only pop-up a basic UI pane.
To add specific options for your new buildings, go to the hierarchy and add them under UI/Main/BuildingMenu/SpecificOptionsContainer.
'''The name of the game-object needs to match the name of the building in the [[#Adding_the_Building_Type_Definitions|BuildingType enum]]'''


Since we haven't added any real functionality to the buildings yet, simply duplicating and renaming one of the already existing game-objects is enough.
[[File:111 farmingGameTutorialCurrentGameVersion.png]]


[[File:115 SpecificBuildingOptions.png]]
Now, when you start the game, you should see that your changes have taken effect.


= Localisation =
= Localisation =
Line 198: Line 167:


Your file-browser will open.
Your file-browser will open.
Now, click right-click on the language-file you want to edit and open it with a Spreadsheet-editor (e.g. LibreOffice Calc, Microsoft Excel).
Now, right-click on the language-file you want to edit and open it with a Spreadsheet-editor (e.g. LibreOffice Calc, Microsoft Excel).
If asked, set the separator to 'Semicolon' (;).
Set the separator to 'Semicolon' (;) and disable all other separators.


[[File:130 farmingGameTuroialLocalisation.png]]
[[File:130 farmingGameTuroialLocalisation.png]]

Latest revision as of 07:36, 13 June 2022

This page will explain how you would go about implementing a new 'skin' in the game. Specifically, we will be implementing a farming-themed skin.

Important: Make sure Unity isn't set to compile for 'WebGL Platform'. To check this, go to your build-settings (File->Build Settings...). If it is set to WebGL, click on 'Dedicated Server' and press the 'Switch Platform' button in the lower right-hand corner of the window.

Defining the Game Version

You'll need to add

FarmingGame

to the 'GameVersion' enum in 'Assets/Scripts/CompanyMap/Master.cs'

110 farmingGameTutorialGameVersionEnum.PNG

Adding Building Sprites

In 'Assets/Scripts/CompanyMap/Master.cs', add

[Header("Farming Game")]
public Sprite SpriteFarmhouse;
public Sprite SpriteField;
public Sprite SpriteChickenCoop;
public Sprite SpriteBarn;

Your code in 'Master.cs' should look like this

When you now open the 'Assets/Scenes/Pearhub'-scene and click on '_Master' in the Hierarchy, you should see the sprite variables you just added in the Inspector.

Inspector of '_Master' after adding the Sprite-variables

Now create a new folder in 'Assets/Images/CompanyMap' and name it according to the skin you are creating. Since we are creating a farming-themed skin, we will be naming the folder 'FarmingGame'.

Project view after creating new folder and naming it

Then drag the building images into the newly-created folder.

Note that newly added Sprites must be set to be centered bottom center, so that they will align with all other sprites.

Building Images dragged into 'Assets/Images/CompanyMap/FarmingGame'

After the images have been added to the project, drag the images into their respective variable-slots in the Inspector of _Master. Note that, if you're using SVGs, you will need to click on the arrow to the right of the image and drag the sprite-file instead of the SVG-file.

Inspector of '_Master' after adding the Sprites

Adding the Stats

You need to add stats that every employee has. To do this, create a folder called 'FarmingGame' in 'Assets/Scripts/CompanyMap/Employee/StatTypes'. Then create

AgricultureStat.cs
AnimalHusbandryStat.cs
ForestryStat.cs
MechanicsStat.cs

scripts inside of that folder.

55 createStatScripts.PNG

Note that you should create exactly 4 stats, as this is the number the game was designed and tested with. However, it is technically possible to have more of fewer. If you want to experiment with the number of stats, you should thoroughly test everything before shipping.

Once you've created the scripts, open them and replace

: MonoBehaviour

with

: StatType

After you've done that, your IDE should underline the class-name and warn you that you need to implement inherited methods. If you hover over the class name with your mouse-cursor (or press Ctrl+. while your text cursor is on it), you should be prompted to implement those methods.

Simply follow that suggestion by your IDE and it will automatically create all methods required.

056 implementStat.png

After you've done this, all your methods will throw 'NotImplemented' exceptions. You'll need to replace these exceptions with whatever makes sense for your stat type.

If you don't know what a method is for, you can hover over the method name with your mouse-cursor to get a brief summary of what the method should do. You can also look at how other stat types implemented that method.

Once you've defined your stat types, you need to register them in 'Scripts/CompanyMap/Employee/StatTypes/StatTypeInstanceManager.cs'. To do this, add the following lines to the 'RegisterAll' method:

// Farming Game
Register<AgricultureStat>      (Master.GameVersion.FarmingGame, 1);
Register<AnimalHusbandryStat>  (Master.GameVersion.FarmingGame, 2);
Register<ForestryStat>         (Master.GameVersion.FarmingGame, 3);
Register<MechanicsSkill>       (Master.GameVersion.FarmingGame, 4);

(The number to the right of the comma is the stat's unique ID.)

057 registerStats.png

If you should ever need to remove a stat after you've shipped the game, make sure that you don't override it's ID with a different stat. If, for example you want to replace Forestry with tractor-driving, comment-out the

Register<AnimalHusbandryStat>	(Master.GameVersion.FarmingGame, 2);

line and add a

Register<TractorDrivingStat>	(Master.GameVersion.FarmingGame, 5);

beneath MechanicsSkill.

Adding the Building Type Definitions

Create a 'FarmingGame' folder in 'Assets/Scripts/CompanyMap/Building/BuildingTypes' and create

Farmhouse.cs,
Field.cs,
ChickenCoop.cs,
Barn.cs

scrips inside that 'FarmingGame' folder.

60 addBuildingTypeScripts.png

Once you've created the scripts for your new building types, you'll need to edit them. Firstly, you should replace the

: MonoBehaviour

with

: BuildingType

After you've done that, your IDE should underline the class-name and warn you that you need to implement inherited methods. If you hover over the class name with your mouse-cursor (or press Ctrl+. while your text cursor is on it), you should be prompted to implement those methods.

Simply follow that suggestion by your IDE and it will automatically create all methods required.

70 implementBuildingType.png

After you've done this, all your methods will throw 'NotImplemented' exceptions. You'll need to replace these exceptions with whatever makes sense for your building type.

If you don't know what a method is for, you can hover over the method name with your mouse-cursor to get a brief summary of what the method should do. You can also look at how other building types implemented that method.

Once you've defined your building types, you need to register them in 'Scripts/CompanyMap/Building/BuildingTypes/BuildingTypeInstanceManager.cs'. To do this, add the following lines to the 'RegisterAll' method:

// Farming Game
Register<Farmhouse>        (Master.GameVersion.FarmingGame, 1);
Register<Field>            (Master.GameVersion.FarmingGame, 2);
Register<ChickenCoop>      (Master.GameVersion.FarmingGame, 3);
Register<Barn>             (Master.GameVersion.FarmingGame, 4);

(The number to the right of the comma is the building type's unique ID.)

080 registerBuildingTypes.png

If you should ever need to remove a building type after you've shipped the game, make sure that you don't override it's ID with a different building type. If, for example you want to replace Farmhouse with Tractor, comment-out the

Register<Farmhouse>    (Master.GameVersion.FarmingGame, 2);

line and add a

Register<Tractor>      (Master.GameVersion.FarmingGame, 5);

beneath Barn.

Changing the skin

Select the '_Master' GameObject in the hierarchy and switch the 'Current Game Version' variable in the inspector to 'FarmingGame' (the name you created earlier).

111 farmingGameTutorialCurrentGameVersion.png

Now, when you start the game, you should see that your changes have taken effect.

Localisation

Currently, the labels of the buildings in the store still print the translation-string. To change this, we'll need to add translations for the languages we want to support.

Go to 'Assets/Resources/localisation' and right-click on a file, then open it in your file-browser (Explorer in Windows).

120 farmingGameTuroialLocalisation.png

Your file-browser will open. Now, right-click on the language-file you want to edit and open it with a Spreadsheet-editor (e.g. LibreOffice Calc, Microsoft Excel). Set the separator to 'Semicolon' (;) and disable all other separators.

130 farmingGameTuroialLocalisation.png

Add the translation-strings of the buildings you created in the first column and their translation in the second column. You can add the rows anywhere you like, though it might be a good idea to keep the localisation-files organised.

140 farmingGameTuroialLocalisationEnglish.png 150 farmingGameTuroialLocalisationGerman.png