Kilkakon.comMenu

Shimeji-ee Affordances Tutorial

Download Now Source Code DeviantArt Group Video Affordances Tutorial

This tutorial will walk you through the various steps required to make an interaction animation between two different shimeji. It expects you to have a working understanding of how to edit the xml files to add frames and the like.

You can also download a working example for free from my Patreon. Note that this version is not guaranteed to be using the latest version of Shimeji-ee, so if you plan to use this particular example for your own shimeji you should update it to the latest version.

Interactive actions have the following components:
  1. A shimeji Broadcasts an affordance
  2. Other shimeji detect this affordance and move towards it (ScanMove)
  3. Once the shimeji meet, they Interact. If the interaction finishes successfully, they change to the given new Behavior. Otherwise, they continue as normal in their respective sequences.

Broadcast

Let's start with broadcast. There are three versions: These correspond to Animate, Stay and Move respectively, and work in the same way.

For this example, let's make a Broadcast action. Take the sit action of the shimeji you want and make a copy of it.
<Action Name="Sit" Type="Stay" BorderType="Floor">
    <Animation>
        <Pose Image="/shime11.png" ImageAnchor="64,128" Velocity="0,0" Duration="250" />
    </Animation>
</Action>
Then, modify it so it becomes a Broadcast action instead of a Stay as shown in the code snippet below.

Note the new parameter, Affordance. Any shimeji searching for an affordance will need to use this same value.
<Action Name="SitAffordance" Type="Embedded" Class="com.group_finity.mascot.action.Broadcast" Affordance="Cuddle" BorderType="Floor">
    <Animation>
        <Pose Image="/shime11.png" ImageAnchor="64,128" Velocity="0,0" Duration="250" />
    </Animation>
</Action>
Create a new sequence for the action as normal.
<Action Name="BroadcastAffordance" Type="Sequence">
    <ActionReference Name="SitAffordance" />
</Action>
Add the new action into behaviors.xml as appropriate. I recommend a high frequency as it relies on another shimeji noticing it.

For this example, place it in the "On the Floor" condition block.
<Behavior Name="BroadcastAffordance" Frequency="1200" />

ScanMove

ScanMove refers to moving towards a target shimeji that is Broadcasting the affordance of interest.

Start by making a copy of the run action in the shimeji that will be looking to Interact with the first shimeji, as seen here.
<Action Name="Run" Type="Move" BorderType="Floor">
    <Animation>
        <Pose Image="/shime1.png" ImageAnchor="64,128" Velocity="-4,0" Duration="2" />
        <Pose Image="/shime2.png" ImageAnchor="64,128" Velocity="-4,0" Duration="2" />
        <Pose Image="/shime1.png" ImageAnchor="64,128" Velocity="-4,0" Duration="2" />
        <Pose Image="/shime3.png" ImageAnchor="64,128" Velocity="-4,0" Duration="2" />
    </Animation>
</Action>
Modify the action to the new ScanMove type. Take note of the new attributes: Note that the behaviour properties are expecting Behavior names, which typically refer to sequences, not Actions with image frames.
<Action Name="RunAffordance" Type="Embedded" Class="com.group_finity.mascot.action.ScanMove" Affordance="Cuddle" Behavior="IHugYou" TargetBehavior="IAmHugged" BorderType="Floor">
    <Animation>
        <Pose Image="/shime1.png" ImageAnchor="64,128" Velocity="-4,0" Duration="2" />
        <Pose Image="/shime2.png" ImageAnchor="64,128" Velocity="-4,0" Duration="2" />
        <Pose Image="/shime1.png" ImageAnchor="64,128" Velocity="-4,0" Duration="2" />
        <Pose Image="/shime3.png" ImageAnchor="64,128" Velocity="-4,0" Duration="2" />
    </Animation>
</Action>
Create a new sequence for the action.

Note the small Stand before the ScanMove—this is important! Without it the ScanMove will not work.
<Action Name="Hunt" Type="Sequence">
    <ActionReference Name="Stand" Duration="${20+Math.random()*20}" /> <!-- a small delay is needed to prevent an infinite loop -->
    <ActionReference Name="RunAffordance" />
</Action>
Add into behaviors.xml as normal. It should be a high frequency.

For this example, place it in the "On the Floor" condition block.
<Behavior Name="Hunt" Frequency="1000" />

Interact

Now that we have the two shimeji meeting, they need to Interact with each other. You can either have art showing each of them separately in their own frames, or one of them using frames with no images set and the other having the art of both. Either way you should use the Interact action so they know to stop if they are torn apart by the cursor or environmental changes.

You can also use the optional Behavior attribute to force one or both of them to execute a behaviour should the interaction complete successfully. Other behaviours in the sequence/NextBehaviourList would follow on from an interrupted interaction.

For this example, one of the shimeji will become invisible for the duration of the Interaction. The other will display art for the both of them. The first shimeji, with the art shown, would use an action like this:
<Action Name="HugAction" Type="Embedded" Class="com.group_finity.mascot.action.Interact" BorderType="Floor">
    <Animation>
        <Pose Image="/hug1.png" ImageAnchor="64,128" Velocity="0,0" Duration="8" />
        <Pose Image="/hug2.png" ImageAnchor="64,128" Velocity="0,0" Duration="8" />
        <Pose Image="/hug3.png" ImageAnchor="64,128" Velocity="0,0" Duration="8" />
        <Pose Image="/hug4.png" ImageAnchor="64,128" Velocity="0,0" Duration="50" />
        <Pose Image="/hug3.png" ImageAnchor="64,128" Velocity="0,0" Duration="8" />
        <Pose Image="/hug2.png" ImageAnchor="64,128" Velocity="0,0" Duration="8" />
        <Pose Image="/hug1.png" ImageAnchor="64,128" Velocity="0,0" Duration="8" />
    </Animation>
</Action>
And the associated sequence:
<Action Name="IHugYou" Type="Sequence">
    <ActionReference Name="HugAction" />
</Action>
The second shimeji uses a pose with no image, measured to be as long as the other action. It uses the Behavior attribute to force a behaviour change should the Interaction complete.
<Action Name="HuggedAction" Type="Embedded" Class="com.group_finity.mascot.action.Interact" BorderType="Floor" Behavior="SitAndSpinHead">
    <Animation>
        <Pose Velocity="0,0" Duration="98" />
    </Animation>
</Action>
And the associated sequence:
<Action Name="IAmHugged" Type="Sequence">
    <ActionReference Name="HuggedAction" />
</Action>
In behaviors.xml, these should appear in the list with their frequency set to 0 and be hidden from view. If they are not listed, the Shimeji Interactions will not work.
<Behavior Name="IHugYou" Frequency="0" Hidden="true" />
<Behavior Name="IAmHugged" Frequency="0" Hidden="true" />
Back to Main