Monday, July 14, 2014

Development Update #008 - UI (User Interface)


The reason I haven't talked about UI much is that we didn't have much of it until recently. Actually, we still don't: the screenshots in this post are just mockups made in Photoshop. I tested some of the graphics in game though, and they seem to work fine for the most part.

Anyway, my initial idea was to have as little stuff on the screen as possible: no black area on the top of the screen, no health/mana orbs on the bottom of the screen... Since we already have Stamina and Magic show above the player model, we didn't really need to show them anywhere else. We needed to show what spells and deals the player currently had though, for which I tried something similar to Bastion (and a lot of other games, I'm sure), where the different UI elements kind of float on screen, trying not to obstruct too much of the game view. I kind of liked this approach, but I ultimately decided on the one you see above (which is kind of close to the black area of Zelda, or maybe a bit like Castlevania or Ninja Gaiden, though I originally decided against it).

This might not be the final UI design, but it is pretty close. I think it's simple and clean enough and doesn't take too much screen space (and the icons for acquiring new spells and items will only show up for a few seconds). It also provides pretty much all the information the player needs, so it's fit for purpose.

I also downloaded Color Oracle, which simulates different types of color blindness, to test how the game would look to someone with color vision deficiency. The game seems to look fine for the most part, but people with Tritanopia might have some trouble distinguishing between the green and blue of stamina and magic, respectively. The new UI also has text for which is which though, so it might not be a big problem. I will have to ask around.

Some of the spell icons.
Most of the icons for the spells are also ready. I wanted all of them to be of the same shape and for that shape not to be a square. I tried different rectangles, triangles and all sorts of weird shapes, but in the end I decided to go with the circle, since it wasn't the most generic choice (that would be the square) and also was notably different from the deal icon shape (which is... the generic square).


A few deal icons.
The deal icons were originally made to look like a piece of paper (this was of course to resemble a traditional, written business deal). However, it didn't quite fit with the rest of the UI, which had started to look more and more modern in style. So I tried a more abstract style of simple rectangles and finally the square that it is now. Though the shape itself is rather generic, it's, again, fit for purpose: it vaguely resembles the piece of paper it was originally meant to be and it is not round, which separates it from the spells. Good enough, right?

I've tried to design the content of the deal icons in such a way that they clearly show what the deal is (or at least hint at it so you can remember the deal you made). The first one in the image makes Stamina orbs give Magic instead. The second does the opposite. The third one makes your attack come from your current Magic instead of your current Stamina. The fourth doubles your maximum Magic but reduces your maximum Stamina to half. These are, in my opinion, pretty simple and effective. Once again though, the blue and green might look almost the same to some colorblind people, so I might need to change the colors slightly, or make some other adjustments. I'm thinking of adding a tooltip that pops up if you hover your mouse over the icons too, so that might also be enough.

The actual act of making (or not making) a deal will look something like the image below. The portrait of the Businessman will most likely be a touched up 3d render or a simplified drawing of the character. A moving portrait is also a possibility, but probably not necessary. 
To take or not to take.

Until next time.

Wednesday, July 2, 2014

Development Update #007 - Weather Effects

This level has some steady snowfall and occasional heavier snowstorm-like effects.

Most of And So It Was happens indoors, so there aren't that many weather effects we needed. We have a snowy level (above) and a forest level (below) though. The snowy level needed snow (obviously) and since I thought the forest level looked a bit bland at first, I tried adding some rain, and it did wonders to the atmosphere/feel of the level (at least in my opinion):
I didn't want to add too much rain, but enough for it to be clearly visible. There is also some subtle mist in the level.

The .gif compression is pretty high in the above images, but I think the effects are still visible enough (still screenshots of semi subtle effects didn't seem like a good idea).

Both effects are made with Unity's Shuriken particle editor. The snow effect is pretty simple. It has around 20 blurry sphere particles and 10 actual snowflake-looking particles flowing downwards at slightly different velocities. There is also a little bit of random sideways movement to simulate wind (so they don't fall straight down). The particles have a lifetime of 20 seconds (meaning they will disappear 20 seconds after spawning), so more than those 30 will be on screen, but the maximum is a hundred (modern computers can easily render a lot more than that, but since more isn't needed, it's good to keep the maximum number relatively low). The heavy snowfall is similar, but the particle velocity is slightly higher and it has big cloudy particles as well, to simulate the mist-like effect that comes with heavy snowfall.

The rain is pretty straightforward (or downward) as well. Basically the particle system just emits white lines with slightly varying sizes and velocities. There are also ripples on the ground, but they aren't actually caused by the raindrops (a.k.a. the white lines), but 5 of them spawn in a random spot in the same area (but obviously lower than the actual rain) a couple of times in a second, creating a nice enough illusion.

Until next time.

Friday, June 27, 2014

Development Update #006 - First Boss

The Guardian, chillin'.

I posted the above gif on Twitter a few days ago. Since then, I've made some progress towards creating the actual boss fight, notably making the explosion particle effect which you can see in the gif below. The explosion will be this Guardian's main attack. He will hover towards the player and explode a certain number of times. If the player is inside the blast radius, he will take damage (unlike in the gif, where the Boy is just hanging out, not even paying attention to the Guardian).

The Guardian gets a bit angry when the Boy enters the room.

After a certain number of explosions the Guardian will get dazed from all the exploding and will be vulnerable for a short time. I have yet to decide how much health this guy will have, but since even with full stamina (meaning the player will do 4 damage on each hit) the fight should be even moderately difficult, I imagine it's going to have to be quite a lot.

Right now this guy only has some placeholder code to test the animations and effects, and our programmer hasn't even gotten his hands in him yet, so it will be a while before the fight is implemented in the game. I still have to animate his death/destruction/defeat as well, but still, things are looking pretty good so far.

A dazed Guardian. Constant exploding is apparently quite exhausting.

This will probably be the only boss I will explain the mechanics of, since I want players to figure most of them out themselves. I wanted to show this one off though, since he is the first, and he looks pretty cool, and I'm kind of excited for that.
Until next time.

Monday, June 16, 2014

Development Update #005 - Enemies and (other) Characters

I've been animating (and modeling) characters for the past week or so, trying to get every animation needed in the game finished, and I think I'm pretty much done (with the current characters that is, there is still more to come). I posted these pictures on Twitter a few days ago:
A King
A Guard
These are only two of the enemies the player will encounter early on in the game (in the first and second levels), so I thought I'd take a screenshot with every character currently in the game:
From the back: Boy, Businessman, Guard, King, Ghost, Ghost King, Lurker, Rabbit Thing, Rat (a.k.a. Rat Man) and Stumper (a.k.a. Stumpy)




We're trying to make each enemy different both in appearance and gameplay. For example, the normal Guard only has a fairly quick basic attack, while the King has slower but more powerful attacks as well as a special power attack. The ghosts don't have collision, but walking through them damages the player. Lurkers notice the player from afar because of their big ears. Rats are weak but attack in groups.

These are all normal enemies (with varying hp pools, attack power and special attacks, and to some extent behaviors), but what about bosses?
Well, none of them have been modeled or animated yet, but I have been working on some initial designs. Here is a sneak peek:
I don't want to talk about the bosses too much yet though, since the designs might still change and none of them have been implemented in the actual game yet.
Until next time.



Saturday, June 7, 2014

Development Update #004 - Destructible Barrels and Boxes


The idea for this update came to me when I was running around in some of the newly created rooms in the game, where there are a lot of barrels and boxes but not much else. I started thinking about how I play other somewhat similar games. In The Legend of Zelda I smash every pot there is to see if there are any rupees inside. In Diablo or Torchlight, or even Warcraft 3, I destroy pretty much every object that can be destroyed. Smashing things in games is fun, so why not have at least a little bit of that in ASIW as well?

The idea is that the containers would have a certain chance of having a random item (a health/magic orb, or maybe an upgrade or weapon...) inside, which would make it worth opening them.



I modeled the inside parts for the barrels and boxes, cut them to appropriate pieces and rigged them so that each piece has a bone that can be animated. Then I made one animation for each model to test this out. The animations are somewhat exaggerated, but I think they look pretty cool (neither are quite finished however, and I might make a few variations for each as well, we'll see).
I also added a dust particle effect to go with the animation.



The programming on these is really basic right now and has problems like them opening before the Boy actually hits the object. The animation can start right as the Boy raises his sword, and then he hits even though the destruction animation has already started (this can be seen in the second hit of the barrel gif above). There is no item spawning yet either, but I imagine it will be quite easy to add.
Also, the destructible stuff will probably only be limited to containers (and maybe some old school crack in a wall kind of stuff later), since it would be a lot of work to make all the props like this.
Until next time.


Saturday, May 31, 2014

Development Update #003 - Traps and Secrets

While our programmer's been working on the level generation, combat and ai (among other things), I've been working on traps (and other environmental dangers). I posted a picture of some of the traps a few days ago on Twitter, but I thought it would be better to show them in action, so I tried my hand at making a few animated gifs (the file size is a bit large for an image file; hopefully they load and can be viewed alright):

Some laser(ish) beams in action. Getting touched by a beam will drain one Stamina Point. Getting trapped between beams can be... well, bad.

You don't want to get hit by these rocks. It just might  be a quick trip back to the main menu if you do.



I also started working on some secret areas. Even though the game's levels will be randomly generated, the fact that individual rooms are created by hand allows for adding some good ol' secret areas. If I posted a screenshot of every secret area they wouldn't be so secret anymore, so here's a look at only one for now:
Not all walls are walls.

I try to give the player little hints on where an entrance to a secret area might be, but they can be easily missed. In this case, the room is symmetrical, and the "same" wall on the other side of the room has acid pits in front of it. This one doesn't, so it could indicate a secret. Or the player running at a wall for no reason. But hopefully a secret.
Until next time.

Saturday, February 15, 2014

Screenshot Saturday #12

The spell effects are coming along nicely, though there are still a few to go. Most of them will go through some minor tweaks as well, but we are getting there (getting all of the effects ready, that is). Here's one:
Barbaric Blow. This spell will give the player a buff that will make him do double damage with his next attack.