a♄?

An old Decker project.

It's silly to post about it at this point. But, y'know.
This is about a year old, I think.

It's a weird outpost near an ocean at night where you can explore and click around a bit and then nothing happens.

The question "How do you do this in Decker?" was asked and I am compelled to answer.

This is a long post! It's so long! Don't open it on your feed unless you're really interested! Open in New tab or something!

I guarantee things in here will be confusing. I am so happy to clarify anything if anyone is interested.

Getting set up for this kind of thing

Step 1: Run Decker
Step 2: Toolbars

Find them at Decker > Toolbars in the menu.

They give the ability to switch between interact mode and widget mode with a single click (always useful) and also you can see all your drawing tools on the left side of the screen.

On the right side it will show either the 1bit pattern options OR the colors in the current 16-color palette. You can switch back and forth and use any and all of the options in your project. But the toolbar will only show one 'mode' at a time.

You can switch to color 'mode' while any drawing tool is active in the menu with
Style > Color

(It's good to keep in mind that some menus are context specific. For example, you can't see the menu option to change fonts unless you're interacting with text. )

If you would like to change the default color palette... there's a few ways. The easiest, as of the most recent version of Decker (1.49), is to drop a .hex file onto the program window. Just drag and drop.

You can get a premade hex file from places like lospec (maximum 16 colors for Decker, have fun!) or by making one. To make one you can save a vertical list of hexcodes as a .txt file, rename the file extension to .hex -- and then drag it onto Decker (1.49 or later) and there you go.

Then there's a lot of drawing to do, if you're me.

I'm going to briefly touch on the art side of it. I only work directly in Decker these days. Lots of other people prepare work outside of Decker and import it -- I haven't done it enough to have any wisdom on the subject.

But hey I just recorded a little timelapse of me a drawing a card in the style of the above project and making some small widgets for it. Clip time is 3mins30 and the actual time was ~30 minutes.

This is not a tutorial please don't worry about trying to understand the menus at the speed it's going. It's just... a visual example because I think sometimes it's hard to know what goes on inside other people's processes.

I hope it makes it seem less... Intimidating? Drawing is drawing, but the tools are pretty straightforward. Good ol' reliable line tool and fill bucket. And I hope this shows that the scripting side of it, even if it's unfamiliar at first, isn't a huge undertaking. It's just a matter of knowing some of the lil' things you can do, and building on that knowledge over time.

There are two modules I use with the widgets at the end of the video clip (the 'zazz.bob' and 'dd.' stuff) and I know it goes by very fast. For the record, the things I did in the clip are straight out of the examples in the official module decks that come with downloadable Decker. So you can find them in there with the documentation -- but also I'm happy to explain them if needed.

Zazz handles some kinds of animations, and Dialogizer is a robust and customizable dialog box handler.

Modules are really good at taking over the hard work for specific kinds of tasks, like certain types of moving images, or grid-based pathfinding, or dialog boxes which can also be written in a less-codey(!) way if you're doing something that uses them a lot... like a visual novel.

You can always transfer modules into your cool new deck from their example decks with the File > Resources menu. You can transfer other useful things with that menu as well, like fonts and sound effects.

But now it's time to look at my old code and figure out what the hell was going on.

Here's the gif again, above. And below is... an attempt to explain.

These are almost all 'canvases' -- the image container widget.
Widgets are... interactable things, scriptable things. Things that exist on the card.

And there's a couple things happening here.

1. Any canvas can be made 'draggable', so it can be moved around in interact mode.
2. The 'rect' module can do things like detecting if a draggable canvas is overlapping something else -- in this case, rect is using the invisible 'slot' and 'area' canvases to tell if tell if the draggable things are in the right place.
3. Changes to visibilty. Usually between "None" (completely invisible) and "transparent" (any white area of the canvas that hasn't been specifically made opaque white will become clear).
4. Copy and paste. Copy image from one canvas, paste it on another one. Easy.

Here's all the stuff in the bag, in all variations:

These "strap"s, "gem"s, and "dia"s are copied and pasted onto the "real" versions of the canvases that are in the scene to make things look like they've changed.

On the other hand... When the invisible button (buttons: widgets that do things when you click 'em.. usually) that opens the little net pouch thing is clicked, netclosed is set to "none" visibility, and netopen is set to "transparent"(and so, becomes visible) and it looks like the pouch opened. In the same script, the tiny diamonds are set to draggable so they can be pulled out and put into the thingy on the wall.

Here's a script. The one inside "gem1".

on release pos do
if me.draggable
 if rect.overlaps[me area1]
 sleep[5]
   me.pos:rect.constrain[me slot1]
   sleep[10]
 gem1.paste[gem1active.copy[]]
  gem1.draggable:0
  sleep[15]
  canvas1.toggle["solid"] 
  gem2.draggable:1
  sleep[20]
  pock2.paste[strap0.copy[]]
  end
 end
end

It's not perfect, but let's... let's try. Ignore the 'sleep's -- those are just pauses for pacing.

• When the mouse click that was holding me is released
• if I (gem1) am draggable
• AND if the rect module sees my position as overlapping area1
• Then constrain my position to slot1 (a smaller area, which puts gem1 in a specific place)
• Paste the active version of my gem sprite onto my canvas
• Make me stop being 'draggable' (because I'm in the right place! hooray!)
• Show canvas1 (this is the animation in the wire which has been running the whole time invisibly.... I guess I forgot to name it)
• Make gem2 draggable (in case it is unfamiliar... 1 is true, 0 is false)
• Paste the "open strap" sprite onto gem2's "pock"et strap (just a visual detail)
• end, end, end (and we're done.)

That is... most of what's happening here, visually. Looks cooler than it actually is.

If some of it is confusing.... I get it. This is the project where I learned these things. I found it confusing at the time.

This part isn't about helping at all. I'm just talking about what I want to now.

Hey, have a tiny piece of the project as an unlocked deck. You can go into widget mode and look at the mess. There is....... a lot of stuff I would change if I made it now. But y'know what.... I was really proud of this at the time and I kind of still am.

There's also two(!) eggbugs in there.

Also... awhile ago I made another intro level thing and put it in the worst possible for beginners. It's a post-game bonus section of a previous project on itch.io -- you can skip the 'game' part of it by clicking here on the main screen:

Sorry for the long post. Decker is... flexible? And in a way it can be hard to figure out how you're "supposed to do things" -- because there isn't one correct way. You can make beautiful games with no scripting at all. Or you can learn some scripting if you think it's cool or useful for you.

You can use the drawing tools, or import images, or make things with no art at all. It's all good. BUT.... if you're into the kind of thing I tend to publish, then I hope something in this was helpful.

I'm going to shut up. But if someone asks me a question I will happily start talking again okay bye