Making An Upgrading Inventory System

Hi there fellow developers. I’m trying to make an inventory that’s similar to Brawl Stars and Clash Royale. Players unlock cards; when cards haven’t been unlocked by the players yet they’re black and white, when they have been unlocked they turned colored, and the player can click on them.

There’s a number saying the cards level. Players can upgrade a card once they get a certain amount of the same type of card.

Can someone please help me break down this system. Also would I have to use 2 different images for the black and white and colored image, or is there an option in roblox studio that can change the saturation of the image?

Thanks for reading.

2 Likes

You could simply just have both the black and the white images on there, both invisible. When the player does not have the card, the black image is visible. When the player does have it, the white is visible.

3 Likes

Just a little side note, you could upload the image of the card with color and then you can modify the ImageColor3 property of the ImageLabel to make it darker.

With that said, I’ll give you the infrastructure I would probably use for this.

For storing/accessing player data, use tables and store those server-sided. In terms of setting up the data structure for the player’s data table, it could look something like this:

local player_data = {
cards = {
["Example Card"] = {
Current_Level = 1;
Cards_Found = 0;
}
}
}

Basically, I would store each card as a key in a dictionary, and create some fields such as the cards the player has of that card and it’s current level. You obviously need other data for the card as well, but I think you could define that in a module, not the player’s data directly. Like, the cost per level, the rarities of the cards, technical stuff that never change.

Hope this helps. I can give you more of a breakdown if you have questions. :slight_smile:

3 Likes

Sorry about the useless reply above, I am dumb.

When it is deleted this will look even dumber

There are many ways you can store data, one is what was said above, and another can be more of a OOP implementation. They both will do the same thing, but it really depends on how you like to structure things.

A system I could think of would be to store player data, and have a ‘Card’ object. This card object will have its metatable set to some set of functions that will be able to unlock, lock, whatever the hell you want.

Here is some quick thing I made that uses this concept (Some features aren’t here because haha)

ServerScript -

local card = {}

card.__index = card 
card.State = false -- Default values
card.Level = 1
card.Quantity = 1

function card:set_state(state)
	self.State = state
end

function card:new(data)
	data = data or {}
	setmetatable(data,card)
	return data
end

function card:increase()
	self.Quantity = self.Quantity + 1
end

-- example card

local data = {Cool_Thing = "Awesome",Name = "Nice Card"} -- Put whatever data you want in the card
local plr_module = require(game.ServerStorage.data)
local new_plr = module:new()

local new_card = card:new(data)
print(new_card.Name)

new_plr:add_card(new_card)
new_plr:add_card(new_card)

for i,v in pairs(new_plr.Cards) do
	print(v.Quantity,v.Cool_Thing)
end

Module Script

-- I am ignoring saving as it's a pain and I hate pain.

local cards = {}

cards.Cards = {}
cards.__index = cards

function cards:new(data)
	data = data or {}
	setmetatable(data,cards)
	return cards
end

function cards:add_card(card_data)  
	local name = card_data.Name
	
	if not self.Cards[card_data.Name] then
    self.Cards[name] = card_data
	else
	self.Cards[name]:increase()
	end
	
end


return cards

Output is -

  Nice Card
  2 Awesome

This can be improved in loads of ways (the .Name is kinda dumb, I didn’t format it right) but this is just something you can do with OOP. Pretty cool. Probably not required.

1 Like