This course provides a full guide on trading card game battle mechanics.
The material in this course is divided into 6 Sections. Section 1 features a short introduction to the course.
In Section 2 we will focus on making cards. We will use Unity UI features to create both faces and card backs of our cards. Spell cards and creature cards will be designed a bit differently. Creature cards will have distinctive oval frames around creature images. You will learn how to rotate cards that are made with Unity UI properly. We will do some scripting to make a simple system that will allow us to create and edit our cards as assets in Unity.
In Section 3 we will continue working on different visual elements: mana pools, rope timer, hero portraits, end turn button and so on. By the end of this Section we will assemble a visual layout of our Battle Scene that our players will see in the final version of the game. We will also explore several scripts that will help us drag cards in the game, organize and display enlarged previews of cards and creatures.
In Section 4 we will prepare our project for bringing in all the scripts that will handle Logic in our game. We`ll start by taking a look at a small slideshow that will explain the relationship between Visual and Logical parts of our game. We`ll add several new Visual features – Damage Effects that will display amounts of damage taken by creatures or heroes in the game, a simple system that will show messages in the start of each turn and targeted dragging for spell cards and creature attacks.
Section 5 is the most complicated Section of this course in terms of scripting. We`ll bring all the remaining scripts, including all the Logic scripts into our project. Our goal for this Section is to establish the most basic game mechanics of drawing cards from deck, playing creatures onto the battlefield and attacking either our opponent`s hero or his creatures. We will also discuss turn management and test our burning rope timer.
In the final section of this course you will learn to create spell and creature effects for your game. Creature effects might be caused when the creature enters the battlefield, when the creature dies, when the turn starts or ends or even when certain events occur in the game (like: when your Hero takes damage, draws a card, etc…). We will also take a look at a simple AI script that will control our opponent`s behavior and let us play this game against the computer.
I have tried to save the project that I was working in as often as I can so that you can easily pick up the material from any point in this course. All these assets that are used to create cards, creatures, hero powers and other game elements are free for commercial use and available for download with this course. You can find detailed info on art and scripting assets and links to some other useful resources in the Credits file that you can download with this course.
Cards
-
1Introduction to This Course
This Course presents an in-depth guide on card game battle mechanics. We`ll start from creating a single card and gradually work towards making a complex battle system with custom spells, creatures, heroes and hero powers, computer AI and so on.
-
2How to Watch This Course
In this Lecture we`ll discuss different ways to watch this course. My main points for getting maximum benefit from this course:
- While you watch this course, experiment and try to make your own game with your own art/ game mechanics, etc…
- Skip to the parts of the course that you are most interested in.
- Explore. Download the final version of the course and try to add your own cards or creatures to this project.
- Communicate: ask your questions and post your suggestions. You can find my contact info in the Credits file.
Battle Scene Visual Layout
-
3Introduction to Section 2
In this Section we will focus on cards. Main topics of this section are: working with Unity UI to create Spell Card and Creature Card Game Objects, using custom scripts to rotate cards properly, managing and editing the information about our cards using ScriptableObject assets.
-
4Preparation
In this Lecture we will create an empty Unity project for our future card game. We`ll take a closer look at the downloads folder that you`ll get with this course and import all the Sprites into our newly created project.
-
5Creating a Card Template with Unity UI
For this game our instrument of choice for creating cards is Unity User Interface features (UI). In this Lecture we will experiment with Unity UI and create a template for a single card. We will discuss UI anchoring – a very important concept while working with user interfaces in Unity.
-
6Simple Decorations
In this Lecture we`ll apply a texture to our card template. We`ll also add a simple frame decoration around the edge of our card.
-
7Creating a Face Side for a Spell Card
In this Lecture we will continue decorating our card template. We`ll add all the remaining visual elements to our card: ribbons that will display the title and type of our card, a mana cost icon, a description field and an image that will display the main graphical element on our spell card.
-
8Creating a Card Back and Adding Beautiful Text Outlines
In this Lecture we`ll make a card back that will be used for all the cards in our game. We`ll take a look at a set of custom scripts that will help us apply smooth outlines to Text components in our game.
-
9Card Rotation
In this Lecture we will explore a custom script that will let us rotate the cards properly. This script will ensure that we show the card's face when the card is facing with its face side towards the camera and that we show our card`s back when the card is facing with its card back towards the camera.
-
10Editing Cards with Scriptable Object Assets
In this Lecture you will learn how to store data by creating your own assets in Unity. This method will be used for creating and managing cards (Card Asset) and heroes/characters (Character Asset) in our game project.
-
11Applying the Visual Appearance from a Card Asset onto a Single Card
In this Lecture we`ll check out the script that will help us read the information from our CardAsset and apply it to the card in our scene, changing its mana cost, description, title, main graphic, etc…
-
12Card Glow and Creature Cards – Part 1
In this Lecture we`ll spend a couple of minutes in Photoshop and I`ll show you an easy way of creating glow outlines for any custom shape. We`ll apply pre-made outline to our spell cards.
-
13Card Glow and Creature Cards – Part 2
In this lecture by making several adjustments we`ll turn our spell card template into a new template that will be used for our creature cards. You will learn how to use UI Masks in Unity to mask a certain portion of our card`s main graphic. This will help us add non-rectangular frames to our creature cards.
Preparing To Introduce Logic Scripts To Our Game
-
14Introduction to Section 3
In this Section we will add more visual elements to our battle scene: player portraits, mana pools, a rope to measure time until the end of the turn, a simple background image. We`ll create one more prefab that will represent creatures in our game. We`ll have our first discussion on how dragging of cards and creatures works in this game. And we`ll use a tweening engine (in our case – DOTween Engine) for the first time.
-
15Simple Dragging Script
In most modern card games players interact with the game by dragging cards and creatures on the battlefield. In this Lecture we`ll discuss the basics of card dragging and explore the simplest script that can be used for implementing dragging in our game.
-
16Advanced Dragging Script
In this Lecture we`ll take a look at a modified version of our dragging script from the previous Lecture. New dragging script will offer the same functionality, but it will rely on another script component to answer questions like: can we drag this card right now, what should happen when we start/finish dragging this card, what should happen during dragging process, etc…
-
17Creating Card Previews – Part 1
In this Lecture we`ll discuss a method that we`ll use to display enlarged previews of our cards and creatures. This will help players read descriptions and stats for each card.
-
18Creating Card Previews – Part 2
In this Lecture we`ll take a look at the script HoverPreview.cs that is responsible for displaying all the previews of our cards and creatures.
-
19Making a Creature Game Object
In this Lecture we will create a prefab of our creature. Creatures will have oval frames and display their cards as previews.
-
20Making a Mana Pool – Part 1
In this Lecture we will design the visual representation of our custom mana pool. You will learn how to use layout groups to organize UI elements in Unity. Just like in Hearthstone, our players will have a maximum of 10 mana crystals. Each turn a new mana crystal will be added to their mana pool. Mana crystals can later be used to play cards and use hero power.
-
21Making a Mana Pool – Part 2
In this Lecture we will take a look at the script that will control the behavior of our mana pool. And we`ll configure everything in Unity Editor to test our mana pool`s performance.
-
22Making Player Portraits – Part 1
In this Lecture we will design a game object that will display the portraits of our heroes in the game. It will use similar masking technique to the one that we used with our creatures.
-
23Making Player Portraits – Part 2
This Lecture is dedicated to making Hero Power buttons that should be displayed beside our player portraits in the scene. We will discuss an interesting topic of making non-rectangular buttons in Unity.
-
24Creating a Burning Rope Timer
In this Lecture we will create a rope fuse to count down time until the end of our players turn and create a sense of urgency by the end of the turn. We will also make an End Turn button and a simple numeric timer to display the amount of time left until the end of the turn.
-
25Creating a 3D Deck with Variable Thickness
In this Lecture we will create our player`s decks. We`ll bring in some elementary 3d elements to our scene to make the decks vary in thickness depending on the amount of cards that they contain.
-
26Assembling the Battle Scene Layout
In this Lecture we`ll use all the visual elements that we have created so far to build a layout of the battle scene that our players will see during the game.
-
27Organizing Cards and Creatures
In this Lecture we`ll take a look at the scripts that will help us neatly organize the moving elements of our game – cards and creatures. This script will be used both for our player`s hand areas and for their table areas.
Basic Game Mechanics
-
28Introduction to Section 4
In this Section we will start by studying the relationships between Visual and Logical parts of our game. Other topics discussed in this Section: targeted cards and targeted dragging, Damage Effects, showing “Your Turn” messages.
-
29Separating Visual Presentation from Logic
Most modern card games use so-called Authoritative Networking (logic running on the server and each player`s game acts only as a remote control to the server). Even though we are making a single player game, we`ll discuss how we are going to handle this visual/logic separation in our project.
-
30Introduction to Command System
In this Lecture we`ll take a look at the system that will connect our game logic and our visual representation – the system of Commands. Commands will also let us organize everything that should happen visually in the game (card draw, attacking, taking damage, etc…) in a certain order and show all these events in a sequence.
-
31Command System – A Use Case Scenario
Because understanding how Commands will work in this application is very important, in this Lecture we`ll go through an example scenario and check out what happens behind the scenes in our game during card draw, attacks, damage dealing, etc…
-
32Applying Visual Looks from a Card Asset onto a Creature
In this Lecture we`ll take a look at a script that will be used to transmit all the information from our Card Asset to our creatures. It will be used to change appearance of a new creature when it is played from hand and added to our player`s table.
-
33Using Character Assets to Create Class Cards
We will customize the look of our cards by making them either neutral (all heroes can use these cards) or we can make them belong to a particular character (class-exclusive cards). Class cards will have different color schemes. This color information for class cards will be stored in Character Assets.
-
34Applying the Info Stored in Character Asset to Player's Portrait
In this Lecture we`ll use the same approach that we have used with our cards and creatures to apply the looks to our players` portraits and hero power buttons from Character Assets.
-
35Damage Effects – Part 1
In our game Damage Effect is just a game object that will be drawn on top of the character that has taken damage. It will also display the amount of damage taken. This Lecture is dedicated to creating a Damage Effect game object and in the next lecture we`ll take care of scripting.
-
36Damage Effects – Part 2
In this Lecture we will take a look at DamageEffect.cs script that will handle displaying our Damage Effects and fading them after a couple of seconds.
-
37Targeting System – Introduction
For cards that say something like:” Deal 2 damage to target enemy” and for our creatures we want to have a system that will let our players choose target for spells and creature attacks. Instead of dragging these cards or dragging characters to attack, we will drag a special target gizmo. And we`ll draw an arrow between our game object and this gizmo.
-
38Targeting System – Troubleshooting and Testing
In this Lecture we will take a look at the code that is responsible for targeting behavior in our game. We will discuss how it handles line-drawing, rotating the pointy end of our arrow, moving the target gizmo and spacing all these elements correctly in our scene. And we will get to test these targeting features for our so-called “Targeted Spell Cards”.
-
39Message Manager
In this Lecture we`ll create a panel to show messages like: “Your Turn” or “Enemy`s Turn” to our players. We will check out a simple script that will be responsible for displaying these messages in our game.
Advanced Game Mechanics
-
40Introduction to Section 5
In this Section we want to establish the most basic mechanics of any trading card game: drawing cards from deck, playing creature cards and spawning a new creature on the battlefield, attacking with creatures, taking damage, showing creature`s death, etc…
-
41Adding All the Remaining Scripts
In this Lecture we will import all the scripts from our Downloads folder that we need to have in our project in order for this game to function, including all the Logic and Commands scripts, as well as some of the Visual scripts that we do not have in our project yet. We`ll take our first look at the Player.cs script, which is one of the main scripts of our game`s Logic.
-
42Assembling Game Logic and Deck Shuffling
In this Lecture we will start attaching our Logic scripts like Player.cs, Hand.cs, Deck.cs, Table.cs to the game objects that we have prepared in the hierarchy. We will take a look at the script ShufflingExtentions.cs that will let us shuffle the cards in our player`s deck when the scene is loaded.
-
43Dragging Scripts and GlobalSettings.cs
In this Lecture we will remove all the testing scripts that we have used to explain how dragging works in the game. Instead of them, we will attach all the scripts that will be actually used for dragging cards and creatures in the game. We will check out a script GlobalSettings.cs that will store references to our card and creature prefabs, time intervals that will be used for card transitions and other info that will affect our game`s performance.
-
44Turn Manager Script
In this Lecture we`ll take a look at the script that will be responsible for starting the battle between our players and switching turns in the game. We start working on making the burning rope in our scene functional by adding a script that is called RopeTimer.cs to our TurnManager game object.
-
45Rope Testing and Unity Events
In this Lecture we will introduce several changes to our project to be able to test our burning rope. We will take a look at RopeTimer.cs script that controls our rope. We`ll discuss UnityEvents, like the ones that you can find on UI Buttons in Unity and I`ll show you a way of adding these events to your own custom scripts.
-
46Card Scripts and ID System
In this Lecture we`ll take a look at the script CardLogic.cs that will describe a single card in the Logic part of our game. We will also discuss a system of IDs that will be used for our cards, creatures and even players to connect the entities from logic like Player.cs, CardLogic.cs and CreatureLogic.cs with the Visual game objects that represent them in our scene.
-
47Creature Script
In this Lecture we will discuss the script CreatureLogic.cs that will desctibe creatures in the Logic part of our game in utmost detail. We`ll take a look at all the methods and properties of this script and we`ll check out how this script works with our system of Commands to send messages about attacking and taking damage to the visual part of our game.
-
48Configuring Player Areas
In this Lecture we will continue working on our LowerPlayerArea. We will introduce a script PlayerArea.cs that will store the references to all the visual stuff that our player has and will help to establish the connection of our Player.cs object in Logic with all the visual stuff that belongs to this player. We will establish all the references of our HandVisual.cs script that include different sources of card draw and different spots to preview our cards.
-
49Table Script
In this Lecture we will take a look at a script TableVisual.cs that will be responsible for adding new creatures to our player`s table and making sure that they are placed on correct slots and that all the creatures are always centered on our table area. Some of the techniques that are used in this script are used in HandVisual.cs script to manage the card in our player`s hand.
-
50Hand Script
In this Lecture we will discuss the script HandVisual.cs that will take care of drawing cards in the visual part of our game. It will manage the cards in our player`s hand so that new cards will always be added to the rightmost spot in the hand and the hand as a whole always stays in the middle of the screen. This lecture will contain a comprehensive guide on using DoTween sequences.
-
51Command System – Scripts of Individual Commands
So far we have discussed our Command system in general. In one of our previous lectures we`ve taken a look at the Command.cs class that will be the base class for all the Commands in the game. In this lecture we`ll study actual command scripts like DrawACardCommand.cs or CreatureAttackCommand.cs and we`ll discuss how they work in detail.
-
52Decision Making in Dragging Scripts
In this Lecture we`ll take a look at two different scripts, that are both children of our DraggingActions.cs script. We`ll mostly focus on their OnEndDrag() method, the method that figures out what should happen when our players decide to play spells or attack with their creatures.
-
53Testing Card Draw
In this Lecture we will introduce several changes to our project and test card drawing features. Because card draw happens through the system of Commands, even if we decide to draw 2 cards right one after the other, second card will anyway be drawn only after the first card arrives to our player`s hand.
-
54Testing Playing Creatures and Dragging Attack Target
In this Lecture we will do some preparations and test playing creature cards from hand. This simple action will test the whole pipeline that will start in our DraggingActions script for playing a creature card, then this action will be passed to Logic, there it will create a new PlayACreatureCommand that will add a new creature to the battlefield.
-
55Testing Start Game Sequence
In this Lecture we will create a fully functional Top Player Area by creating a clone of our Lower Player Area Game Object that we`ve been working on in all the previous lectures. We`ll then be able to test our battle starting sequence by calling the method OnGameStart() in TurnManager.cs.
-
56Testing All the Basic Game Mechanics
In this Lecture we`ll make some final tweaks to our battle scene and test the battle mechanics of playing creatures and attacking with creatures. Advanced game mechanics like: making spells and creatures with special effects will be covered in our next Section.
Bonus Section / Downloads Section
-
57Introduction to Section 6
In this Section we will focus on making special effects that will be caused by our spells and creatures. We will also make a simple AI script that will let us play against а computer opponent.
-
58Spell Effects and Hero Power Effects
In this Lecture we will take a look at the script SpellEffect.cs that will be used for both spells and hero powers in our game. By the end of this Lecture we will test our “Coin” spell and hero powers for both of our players.
-
59Creature Effects – Part 1
In this Lecture we will take a look at the script CreatureEffect.cs that will serve as a base class for all the creature effect scripts in our game. We`ll talk about one of the ways to cause creature effects using this script that is similar to Battlecry and Deathrattle effects in Hearthstone (your creature will cause its effect when it is played onto the battlefield or when it dies).
-
60Creature Effects – Part 2
In this Lecture we will check out another way of creating creature effects, which involves listening to C# events. This way your creatures will be able to cause their effects when the turn starts or ends, when a spell is played, when a creature is played, when your player draws a card, takes damage, etc… In the end of this Lecture we will get to test all the creature effects and 2 more spells that will be present in the final version of our app.
-
61Game Over Condition and Restarting the Game
In this Lecture we will discuss in detail what will happen in the game when one of our players dies. Since we are making just this one Battle Scene, when the game is over we will display a simple one-button menu that will let us restart the same battle.
-
62Computer AI
In this Lecture we will first make all the necessary adjustments and play a single battle against our AI opponent. And then we`ll take a look at the script AITurnMaker.cs that will take all the decisions for our computer player in the game.
-
63Player Class: Detailed Overview – Part 1
In this Lecture, first, we`ll have some fun and make one AI player battle against another AI player. Then we`ll fix several bugs related to our Damage effects and Creature effects. After all the bugs are fixed we will start a detailed discussion of our Player.cs class.
-
64Player Class: Detailed Overview – Part 2
In this Lecture we`ll resume and continue our discussion of Player.cs class, mostly focusing on methods and stuff that our player can do in the game.
-
65Conclusion
In this final Lecture we will mostly discuss things that we did not cover in this course. Like making menus for character selection and deck building, initiating a battle from those menus and passing the info about our characters and decks into the battle scene. I`ll mention some of the things that I would personally like to add to this course in future. For example: support of “Taunt” creatures, a system of Buff Effects for creatures, etc…
Thanks a lot for watching this course. It`s been a pleasure making this course for you. And, of course, good luck with your own original trading card games!