Obtaining new Bandanas

[michalove]

I finished the loading and saving of bandana color.

Also, I added a sort of splash-screen that gets displayed, when a bandana is collected in the campaign. There, we can display info, about how to use the new ability. At the moment, there is only text, but I would like to add some images, too.

[Germanunkol]

There's one thing that might still be confusing (correct me if I misunderstood anything): In the campaign, obtaining a bandana means adding more abilities. So when the player has the red Bandana he can wall jump, glide, use the hook etc. But in the editor we allow the user to select abilities individually, so a player might be able to hook, but not glide...? Maybe we should simply add small icons at the bottom right of the screen, one for each currently available action? Then in the splash-screen that appears when you get a new Bandana, there could be an animation of the ability and one frame of this animation could be put into the icon, maybe with a background in the colour of the bandana it's associated with.

But that still leaves the question: If I choose gliding and the hook as abiliities in the editor, but not the wall-jump, then which colour will the player's bandana be? It seems so inconsistent...

[michalove]

You understood correctly. By allowing each ability to be enabled separately, I thought, the user levels could be more flexible. And I agree that it is confusing and inconsistent at the moment. The simple solution is to only allow the abilities "stacked" such as they are in the main campaign. Then we have no problem with the colors and so on.

On the other hand, a level with only gliding, but no wall jump might be interesting, too.

I like the idea of having icons for the abilities. But they should not be displayed permanently. In the campaign, it would be sufficient to show them for a moment after obtaining a new bandana. Additionally, they could be shown in the pause menu (similar to the status menu in Zelda games, where all the collected items are shown).

Then in the editor/user levels, the list of icons should be shown, when the level is started for the first time. Again, only for a couple of seconds.

Now for the bandana color: Either we make it a selectable property and the level creator can choose it, or we pick the ability with the highest "rank" and pick the color according to this ability (if you can use the hook, then red, even if you cannot wall jump).

[Germanunkol]

One more idea I had: As it was before, we could always show the character wearing the Bandana currently in use (Red bandana when player uses red). In addition, we can add the other Bandanas he has to his belt, so it looks like he's got them tucked into his belt. If we make this simple enough, I think it would look cool. We could also animate them in a simple manner. So we'd draw the ninja first and then any Bandanas he currently has.

This would allow the user to quickly see which Bandanas he has and would allow the campaign version to stack them while still allowing the userlevels to have any variation of Bandanas available. Also, I don't think it's much work... What do you think?

Edit: Sort of like this:

[michalove]

I like the idea. Let's try it. Technically, we have to copy all animations, that exist and then draw all possible bandanas in each position. Shouldn't be too much work.

[Germanunkol]

I added a red bandana to the player with the white bandana (commit d1b6d02ab4f1bf1ea3a6b15ed13c29a422d29500). You can test it by playing the first few levels.

I generally like it, but I don't think we can display all 5 or so bandanas on there at once. It will get too crowded and impossible to read, I think... Maybe symbols on the screen are better after all, so all available Bandanas are displayed on the GUI and the ninja swaps the bandanas automatically when they're used...?

[michalove]

I agree that displaying all 5 bandanas at once is too much. If we still want to communicate the list of available abilities, we should definitely use some GUI/icons. In my opinion there is no need to swap bandanas on the fly. For example for the parachute: For me it is okay, if the ninja uses what ever bandana he has at that moment. So first it will be the blue one, but then later the red one and so on. For me, that is no problem. The bandana is more like a "rank" which tells you, in what "level" the player currently is. For the communication/icons/GUI, this is my idea: In the beginning of a level, show all the available abilities in form of icons at the bottom. Fade out similar to the level name. If the user plays for a while, we don't need to display the abilities in every level. So it might be sufficient to only display the abilities, when a new "session" is started and when a new bandana is collected. Additionally, we can display all the abilities in the pause-menu (when esc is pressed). What do you think?

[Germanunkol]

That sounds good. Although I think we should display the items shortly at the beginning of each userlevel. During the campaign, I think it's enough to show after a new bandana is collected or when a new session is started, like you said.

[michalove]

Yes, that is what I meant.

Could you code the GUI? For now, it would be enough to use some placeholder graphics. I imagine them similar to the level name, but at the bottom of the screen. Maybe with a similar tween for fade out, but with a different delay for each one(?).

We should then also move the level-name into the gui.lua.

[Germanunkol]

Yes, I'll do it. I'll probably get around to it tomorrow.

[michalove]

Almost all testers told me, they did not really realize that the bandana color changed. To emphasize this, I want to make a couple of changes. 1) I changed the outline color of the bandanas on the player images. Instead of using black is mixed the actual bandana color 50% with black. Now more pixels are actually filled with the bandana color, which makes this more clear. 2) I am working on the splash screen that is shown after collecting a bandana. Here is a quick mockup: The arrow is probably a bit too much. We could rather have it animated. Do you have any idea how to emphasize the color of the bandana? We could first show the Ninja in the previous state, then somehow animate a bandana. But how? Can we draw images of him, tying the know?

[Germanunkol]

Quick idea that comes to mind is: We could let the ninja walk behind a curtain, let him "change clothes" there and walk out with the new bandana. Not great, but it might be a start...

Just before reading your text I was playing the transition between world 1 and 2 and noticed that the change from white to yellow is really subtle. Maybe the second Bandana shoiuld be green?

[michalove]

Changing the order of the colors might be an option. Until now I though of the bandana as a belt you have in various martial arts. There you always have the sequence white, yellow, green, blue ...

But we could change that for more variation. For example maps for temperatures often have the sequence blue, green, yellow, red. See here for example: http://www.wholesaletankless.com/userfiles/image/Ground%20water2.jpg

Then the new order would be: white, blue, green, yellow, red. What do you think?

[michalove]

But before we change the order of the colors: I changed the graphics a little bit and in my opinion the color is much more exposed than before. That might be enough.

[michalove]

I improved the display of the GUI-Bandana icons and added some animations. This works well in the campaign. Todo: Also implement it properly in the user levels.

[Germanunkol]

That looks really, really good!

[Germanunkol]

I really like all the new graphics, also those on the "New Bandana Panel" that pops up. I was thinking though that it might be nice to see the bandana on the panel as well, larger, like a cloth in the new color either behind the title or, if that's annoying, hanging from the side of the panel itself?

Just an idea.

[michalove]

I tried your idea. Here are two mockups.

Generally, I like the first one more. The only thing is that the large yellow area looks a bit cheap. Maybe we need to add some shades there. What do you think? Or is that not what you wanted?

[Germanunkol]

Hm, I see what you mean and I agree. Yes, shades would help, I think, maybe only around the edges (similar to how the Bamboo Box has a shadow on the right and top edges, maybe), and leading into the area a little bit from the sides, hinting at folds. Another thing I'd change is: I would make the shapes less uneven. Right now it's the only thing on that image which is not rectangular. Maybe try something more along the lines of the green banner on this image: http://www.misskatecuttables.com/uploads/shopping_cart/8378/large_banners-set.png ?

On 05/14/2015 11:27 AM, michalove wrote:

I tried your idea. Here are two mockups. upgrade_bg https://cloud.githubusercontent.com/assets/3463790/7629344/0552d566-fa2c-11e4-85d9-58ccc4b7040d.png upgrade_side https://cloud.githubusercontent.com/assets/3463790/7629355/0f2a2a4e-fa2c-11e4-81d9-cbcf5f4b016f.png

Generally, I like the first one more. The only thing is that the large yellow area looks a bit cheap. Maybe we need to add some shades there. What do you think? Or is that not what you wanted?

— Reply to this email directly or view it on GitHub https://github.com/michalove/platformer/issues/216#issuecomment-101983151.

[michalove]

Here we go: First one is very straight the second one a bit curved and the third one very curved and round

I think number 3 is the best one. What do you think?

[Germanunkol]

They're all very cool. Yes, use the third one! :)

Only thing: I'd put the shadow of that you currently have onto the left side instead. Otherwise it "clashes" with the direction of the light that the bamboobox uses...

[michalove]

Thanks for the note. I switched the shadow. It was a good idea to add the bandana. I think it is very clear now, that a new bandana is added.