Article | The Watch

Monthly

Design - New map layout (WIP)

In order to provide a better gaming experience, certain changes have been made to the game's layout. The size has been reduced to minimize travel time between points, while the complexity of the layout has also been decreased to allow for more meaningful choices. In addition, the number of platforms has been decreased to encourage players to interact with one another. Lastly, the map style has been changed from a tug-of-war approach to an arena style to provide players with more movement options while reducing complexity. These changes aim to enhance the gameplay and create a more enjoyable experience for all players

Design - Pre-Match Selection Screen (WIP)

Pre-Match Selection Screen will allow players to select their Units, Flash Blocks, Glitch Blocks and Skins before a match. It should provide a quick access to the available blocks selection, highlight all the necessary information and contain basic navigation functionality.

First iteration for the screen (MVP) is as follows:

*Pre-Match Selection - MVP Visuals Concept*

‍

Functionality-wise the screen should be as modular and customizable as possible, to ease all the upcoming modifications.
For the MVP version it should contain 4 main functional elements:

A - Blocks Inventory,

B - Quick Access Panel,

C - Block Information,

D - Navigation elements

‍

‍

A. Blocks Inventory contains the full list of Blocks and Units available in the game, divided into several sub-sections. Sub-sections basically just a few filters (Flash Blocks, Glitch Blocks, Units) that player can switch between using the buttons in the upper side of the screen. Blocks are filtered by Stars amount (descending) and Name (ascending).

Available Blocks are presented with normal icons and stars amount on them
Unavailable Blocks are presented with greyed icons without stars and Lock icon above them
Empty slots can be presented either with grey boxes with high transparency or be empty altogether
There are no hard requirements for grid size yet. We should start with 2-3 rows and 5-8 columns for now. The best options would be to make the grid adjustable through the code, so we can change it later, if needed.
If Available and Unavailable blocks are not fitting into a single screen, then horizontal scroll bar should appear
[TBD] Filter buttons for sub-sections can be customizable through the editor. There is a possibility that blocks can be also filtered by functionality later on (Offensive, Defensive, Utility, etc.)

B. Quick Access Panel represents the same amount and order of Icons that player would see on his Quick Access Panel while in game match. The only difference, is that we can make icons larger on the pre-match screen for convenience

Order of slots should be exactly same as in a match
Slots should have button bindings listed below them
Player can place blocks in these slots using drag-and-drop approach
Only fitting slots should be highlighted while player drags a block. For example, if I’m dragging a Flash Block, only Flash Blocks slots will be visible normally, while the rest of them will be greyed out or became partly transparent
Units (Assault, Zero and Heavy) are locked in their slots and cannot be replaced for MVP
After selecting a Unit player can select a skin in the Block Information section
Empty slots for Units, Glitch and Flash Blocks will have different icons imagery to help distinguish the slots. We will probably start with 3 slots for units, 1 for Glitch and 3-5 for Flash Blocks

C. Block Information shows information of the last selected block. Player can select a block by left clicking on it or by dragging it. Selected block itself (in quick access panel or inventory) should be highlighted with a border. Th information should contain the following:

Block Name
Block Type
Small Block Icon
Cooldown (for Flash or Glitch Blocks) and Energy (for Units)
Animation depending on the block type:
For Flash and Glitch Blocks it should show visuals for block usage
For Units it should show an animated 3D model of a skin. Animation selection and order should be modifiable in the editor
In case of units this section will also contain UI elements to select a skin (left/right arrows to navigate and breadcrumbs below the animation to highlight the navigated place.
Description. Please, note that it will contain several elements that will be changing while leveling up stars for the card later when we’ll have meta progression.

D. Navigation buttons:

Back button allows to return to the main menu and cancel pre-match selection
Ready button allows to confirm pre-match selection and start a search for the opponent
After pressing it, button turns into Cancel button that will cancel opponent search process and return the screen into its previous state

‍

Design - In-Game Shop (WIP)

The screen should allow players to navigate through the list of items available for purchase, make purchases and check the logs of their previous purchases.

First iteration for the screen (MVP) is as follows:

‍

For the MVP version it should contain 5 main functional elements:

Header
Tabs
Content (Items)
Purchase Logs
Currencies

‍

‍

1. Header

Contains Shop icon, title and exit button. This section is universal and remains persistent through tabs and all the future sub-sections

2. Tabs

Quick filters of items to show. Amount of tabs, their tabs and filters should be customizable from the editor. Note, that later in development a new Showcase tab will be added. It will have different layout but should still be accessible through the same tabs system

3. Items

List of Items available for purchase on the tab selected above. Should contain 6~10 items on page and show navigation scrollbar in case all the available items do not fit on a single page. Each store position (item) should be fully customizable from the editor and contain the following:

a. Icon

b. Item (or items list)

c. Quantity (quantity for each position in case of lists)

d. Name (position name, can differ from the original item name)

e. Description (position description). Will be partly shown on preview with possibility to show tooltip with a full description on hover

f. Price (later it would also support customizable currencies)

g. [TBD] Labels (optional). Only one can be selected for each position

I. Special icons that will be added on top of the item. Can be chosen from a predefined selection (“Hot”, “%”)

Ii. Time Limit label. Start and End date for the position should be set up, remaining time will be calculated and shown on the label

Iii. Supply limit label. Amount available for purchase should be set up, label will automatically calculate amount still available to buy and show it as a label (“Remaining: <X>“)

4. Purchase Logs

A button that opens pop-up with previous purchases. Simple pop-up with the following content:

a. Date/Time of a transaction (preferably in a local users' time)

b. Position name

c. Price

d. Result (so failed transactions with the reason for fail should be shown as well)

5. [TBD] Currencies

A list of in-game currencies that will be available to use in the shop.

Tech - Unit Pooling system (Complete)

We have incorporated an upgraded unit pooling system that significantly minimizes the memory consumption, allowing for a much greater number of VFX to be displayed while keeping the PC's workload well-managed.

Tech - Unit Avoidance system (Complete)

We have made significant improvements to the Avoidance system, enabling seamless interaction among units even when a single unit passes through a group or squad of other units.

Game UI - Additional Units have been added

We are dedicated to providing our users with the best possible user experience, and to achieve this, we are putting in a lot of effort and iterations to enhance the game UI. This involves refining in-game overlays as well as the game menu. Please find below some work-in-progress screenshots showcasing some of the early iterations: