Trading with NPC — devblog 12

Forest Whiskers
3 min readApr 6, 2024

--

I really like the approach of first making new functionality minimally functional and then bringing it to a convenient and beautiful state. I usually start by making plans and sketches on paper.

I started implementing the ability to trade with NPCs. And it’s epic in terms of size.

I decided that I don’t want to have money in the game after all. My main NPCs are animals. Why would they need money? So, everything is based on bartering. Each NPC has a set of items they sell or buy. Each item has its own value. And a deal can only be made if it’s fair (at least from the NPC’s perspective).

The first version looked like this:

On the left are the items the player has and wants to trade, along with the quantity in the inventory. On the right are the items the NPC has. Between < and > is the number of items to be exchanged. Arrows pointing towards the center increase the quantity, while those pointing in the opposite direction decrease it. So, to “sell,” you need to click > next to the player’s items. And to “buy,” you need to click < next to the NPC’s items.

In the center, there’s a “fairness” indicator. If the player wants many items and offers few in return, the red bar moves to the left. In this case, the deal won’t happen, and the TRADE button won’t do anything. Later, there will be a hint that the NPC disagrees with such a trade.

If the deal is fair, the bar will be green. Now, when TRADE is clicked, all promised items will disappear from the player’s inventory and new ones will be added.

And if the player is too generous and gives away a lot of items, the NPC will gladly accept them, but the bar will warn with a yellow color that the deal isn’t beneficial for the player. Later, I’ll add a warning here.

Then I redesigned it into visual icons, moving away from the initial sketch because I didn’t account for the quantity of items there.

On the left are the player’s items, on the right are the trader’s items. The border of the item changes color depending on the selected quantity for exchange. The darkest and grayest border indicates that nothing is selected. Slightly brighter if any quantity is selected. And the brightest if the selected quantity matches the available quantity. I’m still experimenting with colors and border thickness.

I darkened the background and added explanations of whose items are whose. I’ll play with this option for a while to see how it turned out.

And this is still not the end, I still have a lot of work to do on trading/bartering. But it’s a lot for one week of work, in my opiniom, all while having family and full time job.

--

--