Minesweeper With Friends
Kaarel Rüüsak
Minesweeper With Friends is a third-person multiplayer implementation of Minesweeper for the PC. This game was originally conceived about a year ago, and has been developed as part of this course in the previous semester: https://courses.cs.ut.ee/2022/cg-pro/spring/Main/Project-MinesweeperWithFriends
In this semester, I would like to focus on developing the animations and visuals, so that I could use a variety of visually appealing assets throughout the game.
Video showcase of the results:
Milestone 1 (04.10)
Scoreboard blueprint:
- Figure out how to implement tabs in Unity UI (5/2 hrs)
- Create empty scoreboard page loosely based on the blueprint (5/1 hr)
- Bugtest and fix the new scoreboard (1/2 hr)
- At least local scores should work
- Research how to best integrate scoreboard with steamworks (2/2 hrs)
- (Optional) integrate the scoreboard with steamworks (0/2 hrs)
Implementing tabs in Unity UI
There are many ways to implement this feature in Unity. I will mention a few of them and explain my reasoning behind choosing or discarding them. Note that in my case I am using Unity 2019.4.7f1, so I ruled out some options exclusive to newer versions of Unity, such as UI Toolkit.
1. Just linking up some default Unity toggles
This approach would solve my problem and the resulting system would be functional. However, it only allows triggering scripts (i.e. for animations) whenever the value is changed, nothing more specific. For example, I would like tabs to "pop out" with a movement animation whenever they are selected, but this is not possible with just default Unity tools.
2. Creating my own custom tab system
This is a completely viable solution, however, I decided to avoid it unless if necessary. I figured that since I have bought some Unity Asset bundles in the past, I may find a pre-existing modular system to solve my problem. This would save me time and energy, both now and in the future. However, if the reader is looking for a good tutorial on how to implement tabs, I found a great tutorial for it:
3. Using DoozyUI
Doozy UI is a fully functional framework for implementing UI with sound effects, animations, etc. I personally have the V3 of DoozyUI, but this has been depreciated and is no longer actively supported. Additionally, switching to Doozy UI in this stage of development would require rewriting a lot of my code and redoing my UI. For all these reasons, even though DoozyUI offers an elegant solution to my problems, I decided against using it for this project.
4. Using "Better UI" by Thera Bytes
Better UI is an interesting add-on created by Thera Bytes which allows to dynamically extend the functionality of Unity UI. Using it is very simple, just right-click on the problematic component (in my case, Toggle) and select "Make Better". This will give it more advanced functionality to invoke multiple animations, or trigger other scripts. This asset has just the functionality that I needed for this project and I decided to use this.
Implementing tabs
A simple tabs system has been implemented, however, I did not have the time to fully connect it to the back-end and fix bugs.
Implementing Steamworks
Steam is a digital distribution platform for video games, and Steamworks is an API that helps integrate various Steam features into games. These features include achievements, leaderboards and an easy way to connect to friends in multiplayer games. Steamworks is relatively well documented, you can find the full documentation here: https://partner.steamgames.com/doc/home.
Steamworks.NET
The Steamworks API is written entirely in C++, so implementing it directly into Unity's C# environment would be difficult. Fortunately, there is a free and open-source API called Steamworks.NET which works as a C# wrapper for Steamworks, bridging this gap. However, this wrapper is not documented very thoroughly with usage examples, so these will have to be based on the C++ documentation or examples found from the internet.
Implementing a Steamworks leaderboard
Valve's official Steamworks page contains a detailed guide for the C++ implementation of leaderboards, which would help guide development in the right direction: https://partner.steamgames.com/doc/features/leaderboards/guide Additionally, I was planning on using content from this tutorial as a basis for the syntax of Steamworks scoreboard integration:
Unfortunately, although I have managed to implement a peer-to-peer lobby system using Steamworks.NET in the past, I have found that I cannot implement a proper Steamworks leaderboards without creating an official Steam app. In order to do so, I will later create a company and pay the 100$ initial fee and put the game on Steam. However, this takes some work that is outside the scope of this milestone, so I was unable to achieve the bonus objective for this milestone.
Milestone 2 (18.10)
- Polish and improve the current leaderboard (7/3hrs)
- Find/create a shader or other tool to blur the background while some other menu is open (4/4hrs)
Blur Shader
The blur shader was more difficult to implement than I anticipated. Traditional methods of blurring the background which included several camera passes are have been disabled in URP due to performance concerns. Many developers resorted to using a depth-of-field post-processing effect instead, but some players may prefer to play without post-processing, as it significantly affects performance. So, instead I sought out a method directly through shaders and without resorting to post-processing. Additionally, because I am using Unity 2019.4.7f1, I can't use the URP 12.1 features to create shaders like this:
https://www.artstation.com/artwork/b5Wwrk
Finally, I resorted to using this tutorial as the basis for my blur effect:
The effect is imperfect, as it creates more of a "mirror images" appearance rather than a completely indistinct background. I have improved this shader by adding some random noise to the texture sample offsets, which creates more of an artistic "stained glass" appearance compared to the original. You can see the effect here:
Milestone 3 (1.11)
- Animate transitions for the blur effect (2/2hrs)
- Add a moving blurred background to the main menu (4/3hrs)
- Create a low-poly 3D model for cash (1/2hrs)
- I plan to animate this in the future to help players intuitively realize they're picking up money
- (Optional) Create a low-poly 3D model for a lasso powerup (3hrs)
- This needs to be a dynamic model that wraps around the existing player models
Animating transitions for the blur effect
This was successful. Whenever the player enters the main menu, the blur effect is applied as a smooth transition. When returning to the game, I left that transition as immediate, since I don't want the blur effect to hinder the players' speed when they are trying get back into the game. Preview:
Adding a moving blurred background to the main menu
I was very excited to make my main menu more interesting, as it was currently just a blank screen with buttons and a title. Initially, I thought it would be a good idea to use my previously implemented "water waves" shader to create a nice dynamic and moving background, here is the result of this quick experiment:
When I saw this menu, I realized that this effect is not suitable for my game. The main menu should represent the environments or activities that the game is about, otherwise it may give the players a strange first impression. A main menu with waves in the background is most likely a game about sailing, or at least a game focused on island life. Technically, Minesweeper With Friends is set on an island, but the focus of the game is minesweeper and nothing else. Because of this, I came up with a different background: a scrolling unsolved minefield! After some trial and error, this is the result:
The reader may also notice that the blur effect is a bit simpler than what was showcased in the previous milestone. This is because I have been experimenting with some (unfinished) additional blur shader effects, which I have disabled for these previews.
Creating a low-poly 3D model for cash
At this point I didn't have a lot of time to come up with a cash 3D model, so the result isn't anything special. However, I plan to make the model relatively small and perhaps improve upon it later, so this will do for now:
Milestone 4 (15.11)
- Implement animations for cash flying to the player who earned it (3/2hrs)
- In Blender, create a "zombie" version of the player model (4/5hrs)
- Needs to have removable bits and pieces
- This will be used for the survival mode: as players lose health their character models lose meat
- If the player character's brain/head falls out, they die
Implementing 3d animations for earning money
This animation was successfully added to the game, although it still needs to be synchronized with the user interface. Here's a demo of it in action:
Creating a "zombie" version of the player model
In order to achieve a dynamic health system, I decided that the character must be split into five removable parts:
In order to achieve this, the character model has an analogous skeleton model inside of it, so that when necessary I can scale the hand or elbow bones to 0 and the character will still be able to move around or use its weapon. This skeleton also includes a separate "hand" component, which can be enabled in order to retain hands while removing elbows.
Resulting model: