SRDCAT Sneak Peek: Collections

Hey folks! Saker here. It’s about time I stopped tinkering for a bit and show off some of the results of my labors! This will be the first of a series of posts covering the functionalities of SRDCAT as I build them. For this article, we’ll cover an aspect of SRDCAT that is (mostly) complete: the Collections interface.

Collections are the heart of SRDCAT, the part that first inspired me to make it. All the other sections are mutations that have grown out of the possibility space that Collections created.

The Origin Story

I’ve always been interested in SEACAT, and had my eye on it as it developed. Luka had created these long, extremely evocative lists of Skills, Traits, and Mutations, and they fascinated me—not only due to their sheer number and quality, but because they were all perfectly iterable: the game treated them all the same way. In early 2021, I approached Luka with an idea: I wanted to practice working with React, and SEACAT seemed like the perfect game for it, as React should, in theory, be very effective at visually rendering long lists of iterable data points. So I’d try my hand at making a digital SRD for SEACAT (hence the name). The first prototype was a collection of traits, each represented as a digital card*. We liked the idea and decided to move forward with it, and that prototype grew into the current Collections interface.

The Collections

Without further ado, here is what the Collections interface currently looks like**:

Let me give you a tour of what you’re seeing here. At the top is the main navbar, with two other mysterious icons that we will cover in future posts. Below that are the Collections tabs: one each, from left to right: Items, Skills, Traits (a category which combines Traits, Mutations, and Burdens), Spells, and Creatures. “Why are Traits, Mutations, and Burdens all jammed into one category?”, I hear you ask. Great question! It’s because the game treats the three in exactly the same way, and tab space is pretty valuable real-estate (spoiler, there will be additional tabs added in the future). Below that is the Search Bar, and below that is the Card List, each of which deserve their own section.

The Search Bar

The first thing the Search Bar can do is, obviously, search. It can search by name or snippet, as seen below:

Press the magnifying glass button to search, and the “C” button to clear. We’ll get to the “R” button in a minute, but it’s possible you already can guess what it does.

Card Tags interact with the search interface like so: if you click on a card tag, the card list will sort to all the cards containing that tag. Example below is what happens if I click the “#mutation” tag:

What’s more, if I click on another tag, it sorts to all the cards containing both those tags. Example below is what happens if I click on the “#cosmic” tag after “#mutation”:

Now here is where our mysterious “R” button comes in. If you press it, it will select a random result based on your current search criteria. So if I pressed “R” right now, it would select a random mutation with the “cosmic” tag:

But if I pressed it with no search criteria, it would give me a random result from between all traits, mutations, and burdens:

So while SEACAT currently contains 160+ traits and mutations, the Search interface allows you to pare them down and pull random results from them quite easily.

The Cards

Now let’s dive into an example of the expanded version of one of the cards seen above:

Here I got to have fun building all sorts of functionality into these digital cards: everything colored orange is a button (except the border).

• The card name is a button that expands and collapses the card.
• The little icon that looks like an eyeball-headed humanoid waving at you is the Add to Character Sheet button (to be explained further in a later post).
• The tags are buttons that sort the Card List (as we’ve seen above).
• The two arrow buttons next to the Rank adjust the Rank levels (here’s an image of the card after the right arrow is pressed).

• And finally, the D20 icon in the Rank text controls an inbuilt table which randomly modifies the text when the D20 is pressed (here’s an image of the card after the D20 is pressed).

That’s all for now!

Stay tuned for next time, when we delve deeper into the Hero Sheet! Until then, may your journeys into the cosmic infinities be ever fruitful.

* We ended up liking the “game object as card” idea so much, it grew into our UVG/SEACAT cards project (more on this in a future post).

** One thing to keep in mind is that all icons currently included in SRDCAT are a work in progress. Many of them are placeholders, and even more have been made from scratch in AFDES. As a future step, we will be creating a custom icon set, but functionality is the most important thing right now.

Support the
singularity
.

further the omniscience.