CHoW #290 - Rough Idea

I didn't really intend to bother with this week's CHoW, and I'm still not sure if I'll bother much more with it, but I had an idea floating around and figured it wouldn't hurt to vomit it onto a Photoshop canvas. The theme is "Guardian of the Flame," specifically the olympic flame. A pretty weird brief, if you ask me. I don't do many creatures, but this week's brief stipulated that it didn't have to be humanoid, and I felt somewhat inspired by the lions I was doodling yesterday, and a few pictures of hulking tigers I glanced at today.

Edit: Worked on it some more.

Lions

Same deal, different animal. I'm sleepy.

Horsies!

Been a while since I did some aimless doodling, so here are some horses. The bigger one was done upside down, because I couldn't seem to be able to do it right-side up. Why horses? Why, several reasons! Because I'm generally bad at drawing horses, and also I was reminded of that fact when Jane mentioned that she was contributing to a group-effort of drawing the original 151 pokemon (kind of like Pokemon Battle Royale). She's doing Rapidash.

ImageMagick, Imagick, and whatever the hell else you want to call it

So I'm a GD boy, when it comes to writing php scripts to build and manipulate images - or at least, I have been for quite some time. I never ventured into ImageMagick, largely because it was significantly less accessible, what with having to be enabled on the server and all that. Besides, until recently I never really needed anything so complex that GD couldn't do the trick.

Yesterday I was experimenting with my avatar bases for AoA. I'm currently painting them in greyscale, then applying a single layer set to the "Color" blend mode in Photoshop. This way, I can make any tweaks I want to the value aspect of the image without having to redo several versions of the base (specifically the various skin tones). Unfortunately, as far as I could tell at that point, I was going to have to save off individual versions of the base for each skin tone, which was not at all something I was looking forward to.

So, as a programmer, I try to facilitate my laziness by writing code, and this time I went on a hunt for a native GD function that would allow me to blend two images together. I found a function that worked similarly to the "Overlay" blend mode (if you're in need of this kind of a function, look into the GD function, imagelayereffect() with the effect IMG_EFFECT_OVERLAY). Unfortunately, this was not exactly what I was looking for, and resulted in some very harsh lighting effects. In the end, I ended up writing a script to scroll through each pixel, convert RGB values to HSL, pull the hue and saturation and dump it into the greyscale image. It worked pretty well, but took a couple seconds. Combined with caching, this was a workable solution, but could not be extended much further, say, if I wanted to work with numerous layers all being processed individually in series.

At this point, I didn't need anything more than that, so I could have settled down with GD and things would have been fine. Fortunately, I don't settle easily, and I wanted to see if there was a better way. In comes ImageMagick. Note: it feels extremely different from GD, and documentation for the PHP functions is piss-poor. This is because ImageMagick is primarily intended to be used through a command-line, and the PHP functions attempt to abstract the commands into something more OOP-friendly.

I ultimately found that I understood better by working with the command-line functions, which can be used directly from PHP using the exec() function. I don't know much just yet, but from what I've gathered, the basic anatomy of a command is as follows:

convert file1.png file2.png file3.png +append file123.png

The above command opens three separate files and puts them into your working space. You can imagine this as being three files opened as layers on top of each other if you like, but you can also imagine them to be opened one beside the other. All that matters is the order; file1 comes before file2, which comes before file3. The command then flattens them all down, placing one after the other horizontally, and then saves them as file123.png.

convert - starts the command
file1.png, file2.png, file3.png - names of existing files in the folder from which the php script is being run
+append - a command that flattens the image down and places the 'layers' side by side horizontally. Conversely, -append could be used to arrange them vertically.
file123.png - the file name of the resulting image, saved relative to the php script's location in the file system.

Fairly easy to understand. It took some doing, but I eventually found a command that allowed me to achieve something *fairly* close to what I wanted, in this form.

convert female_base.png female_colour_peach.png -compose colorize -composite result.png

Here, -compose seems to be setting the blending mode to colorize, while -composite seems to flatten the whole image down as though they were layers placed on top of each other. Remember, I'm merely recording my own findings, so I may not be entirely correct in my assumptions. All I know is that this worked fairly well. It carried the hue and saturation of my female_colour_peach.png image and applied them to the corresponding pixels of the female_base.png image, whilst retaining the original brightness/value.

For all intensive purposes, this worked. I made a few adjustments, tinkering with levels and brightness of the resulting image (because Photoshop's color blend mode actually tinkers with the value levels a bit), but most importantly I ultimately decided to rewrite this using the PHP Imagick functions, as follows:

$base = new Imagick("female_base.png");
$overlay = new Imagick("female_colour_peach.png");
$base->compositeImage($overlay,imagick::COMPOSITE_COLORIZE,0,0);
$base->levelImage (0, 1.21, 65535 * .85);
$base->modulateImage(100,125,100);

Having written out the code as a command afforded me a greater understanding of how the Imagick PHP functions work. Here, I'm pretty much doing the same thing. I open my files, then I use compositeImage() to paste my $overlay image on top with a blend mode of COLORIZE (the 0,0 are referring to x,y offsets). Then I tinkered with the levels of the image with levelImage() and finally the brightness, saturation and hue with modulateImage().

And the final result is...

AoA: Female Avatar Base

For the past couple days, I've been working on a female avatar base, whose pose has been based heavily on the male character's. This is primarily because it would make it much easier to take a design made for one gender and apply it to the other with minor modifications.

I was also thinking - maybe I'll scrap the fat option, as I'd shown it on the male avatar in my previous post. It's not because I have anything against the obese! I just feel that a fatter base causes minor changes to the shape of the torso, so clothing that is placed on top of it would not necessarily fit correctly. Furthermore, since I can blend between normal and very muscular, but not from normal and fat, it sticks out awkwardly.

So here's the female, normal and super-fit.

And here she is wearing some of those fancy doodads called 'clothes'.

AoA: Level of Avatar Fitness

So I'm toying with the idea of giving avatars several points of customization, since as long as I'm not changing the overall silhouette of the figure, I shouldn't run into too much trouble with avatar clothing. Although I can see a few minor problems that can hopefully be ignored or be fixed later.

Here's the three basic levels of fitness. Extremely muscular, average, and chubby. Since none of the features actually move between the first two, I could give players the option to scrub between the two and find whatever level they're happiest with, but unfortunately that cannot be done with the chubby option.

AoA: Male Avatar... Genetalia?

Today's question is... Should I include the genitals (nothing detailed) or go ken-doll like most RPGs? I briefly asked Ethan that question, and he responded rather childishly - saying that it would be immature to give male characters genitalia. Weird kid. Anyways, I'll leave them on a separate layer and turn them off for now. I can always decide on it later on, and even leave it as a user preference to toggle them on or off.

AoA: Male Avatar Base

Ian thinks that this may be overly detailed, to the point that players would not be able to easily make clothes that would match. He may be right. At the very least, though, I can see the avatars having all sorts of customization options - the face, the level of musculature, etc.

I'll update this post instead of sticking up multiple posts of the various stages of the avatar base.

AoA: More Clothing Designs

Expanded on the stuff I posted yesterday - added two more peasant designs, a couple soldier designs, a watchman (non-military lawman) design and one more noble design. The three noble outfits gradually escalate in their connection to the military - the rightmost would likely be someone who rose into nobility through service in the army, while the middle would be a noble who served and the left would be a nobleman who chose not to join the army in any capacity.

AoA: Clothing Designs

Ian and I were discussing things, and we came to realize how poorly defined the whole world in which AO, and now more importantly, AoA, took place. We don't even know the general type of clothing people would wear in Avaricia. So, once I finally put down Diablo III for the day (which is awesome mind you), I doodled out some rough clothing designs.

AoA: Web Design?

I've... found it very difficult to focus on work today, what with my Diablo III collector's edition having arrived this morning.. But I managed! Sort of. I'm experimenting with the possibility of placing account settings and character settings in boxes above the main navigation - this would double up as boxes for the login and registration forms. Registration should be able to fit in there as well, as I'm planning on making it as quick and simple as possible - not really any longer than the login form. I figure that if people can register quickly, then we'd lose fewer users at that stage.

Behind all of this, there would be a background illustration intended to capture and hold the visitor's attention. Not usually a strategy I've used before, but it seems to be a functioning trend across most game websites. Here's a rough exploration of these strategies, minus the illustration.

AoA: More logo stuff

AoA: Logo work, Avatar base, continued

More work on both avatar base and logo fronts. Khuyen took a big chunk out of her evening to help me by painting over my design and changing it where she saw fit. I haven't yet incorporated anything since then to my own design, but I'll be sure to make use of this new perspective tomorrow.

 

On the avatar base front, I used this opportunity to experiment with applying colour in ways that would allow me to create several bases with different skin tones without too much extra work. This mostly involved using colour and overlay layers in photoshop. I also quickly scribbled on some simple clothing and hair to test out how it would look when dressed.

AoA: Logo work, Avatar base

I showed the logo design to a few particularly significant people (Ian, Luke, Khuyen). Got a positive review from the first two, but Khuyen felt I was capable of better. Unfortunately, thanks to some unsavoury internet problems on her end, I couldn't get anything more constructive than that. I'll admit that I felt very much ill-at-ease with the use of the heavy block text, but I still liked the overall design. It's difficult for me to trash something I genuinely like without being thoroughly convinced first. But she does have much more design training under her belt... Hm.

Having already chugged through the colour-experiments on the logo by this point, I decided to plow on ahead. I also happened to become even more dissatisfied with the text at this point, because it became even more dominant compared to the coloured elements. Below is my most recent rendition of the logo. Only the leaves are lacking any hand-painted texture (because I'm heading to bed).

Almost simultaneously while working on this, I was switching over to a rough attempt at painting a female avatar base. I'll probably make a lot of these 'attempts' as I figure out the appropriate anatomy and posing. God, the posing. As Jane rather tactlessly (albeit accurately) declared some time ago, my figures tend to be pretty horrible. This, compounded with the incredibly difficult task of finding a pose that is both neutral, but can be used to show a character properly wielding weapons, will undoubtedly result in a slew of test-runs. I think I should warm up with some figure drawing tomorrow before I start on another...

Age of Avarice Logo

While I was fumbling around, trying to come up with vague logo ideas, Luke (largely unaware of what I was doing) mentioned something about a crest. Based on that offhand comment, I started in a completely different direction from the one I was initially taking. I didn't really know what I was doing or what I was going for - just trying to combine various elements (snakes, suns, stars, laurels, etc.) into something that would fit the game. Here are a few things that resulted from brainstorming, along with a somewhat more finished one-colour logo.

The first two were me following a direction that ended up being a dead end. I wanted to incorporate snakes to represent the constant atmosphere of treachery, deceit and mistrust, but the curves looked far too... well, wrong. It really makes me appreciate Jane's dragon snowboard design that much more. I'd link to it, but I don't think she's posted it anywhere.


The latin phrase (courtesy of Luke again), "Omnes Quod Nitet Aurum Est" supposedly means "All that Glitters is Gold".

The Age of Avarice

So I've mentioned Anathema Online and Legend in the past, but I'll step back and re-explain what they were, in the spirit of starting afresh.

Anathema Online was my attempt at taking freeform roleplay to the next level - basically an MMORPG for writers, with the structure of a proper game, and the freedom of roleplaying. Players could create characters (represented with avatars) and move around the game world (between rooms, buildings, towns). They could open businesses like restaurants or shops, sell custom clothing for avatars, and also craft weapons and armour. Of course there was a combat system as well, but eventually siege warfare entered the game as whole towns and kingdoms started going to war against one another. It ran between November 2006 and October 2008, just short of a full two years. Our largest user base at any given time was at best a measly 30 players, but people seemed to enjoy it well enough.

Of course, it cannot be ignored that AO quickly fell victim to feature creep, as we expanded the game in order to cater to growing needs and concerns. When I finally decided to close the game, it was not only because the player count waned, but also because I felt that development was becoming far too messy. The HTML/CSS was nowhere near standards compliant, the code was inefficient and the database was poorly structured. It was all a learning experience, after all - my first major PHP/MySQL based project, and for having developed it while in high school, I'm still rather impressed with myself.

Legend was intended to be its successor. While it followed a similar structure, the design was significantly more geared towards a structure game, on occasion sacrificing player freedom in certain areas. This was intended to be my attempt at building a cleaner, more functional version of AO - however, development was shaky, and I often had to put it down for months at a time in order to focus on school work. My goals were far too lofty, and the world I was attempting to create was too vast. Recently, I decided to abandon this project. Once school ended and I got a chance to sit down and look at the code, I realized that there was just too much. Continuing would only result in more complication.

So now, I've stepped back. I'm not bothered by having to abandon Legend - rather I see it as a learning experience, that will fuel my last attempt at a game of this nature. It's a fact - developing a text-based game does not easily contribute in a positive manner to one's portfolio. It may have when I was in high school, but these days employers just give you funny looks. But that said, I genuinely enjoyed playing AO, and I'd like to be able to do it again. This is no longer a matter of building something to impress people, but rather to build something that will make me happy.

Age of Avarice, as it will likely be named, will for the most part be Legend simplified. Rather than building a new world with fresh lore, we will go back to explore the events following a major war in Anathema Online. The city of Avaricia will be fresh out of a war that left it in a state of disarray. With faith in the King shaken, the military has risen up against the monarchy, and besieged the palace. In order to focus their efforts on capturing the throne, the lower town has been abandoned to all but anarchy, with gangs rising to overshadow the paltry local watch. The whole city is up for grabs, and any player is free to make an attempt at claiming it.

On top of the game, we are looking to include a bit of metagame that allows players to contribute to the depth and breadth of the world itself. Just as they could in AO, they will be able to create clothing, although this time around it will be clothing designs that will be sold in-world through official guilds or some other such entity. This way characters will be able to purchase designs, and given that they have the appropriate skill level and ingredients (set by staff when approving the design), they will be able to create the item and stock it in a shop. A similar system will be used for anything between cooking recipes, stories and songs for bards, and even spell concepts. By contributing to the world itself, players will earn points/gold/what-have-you at the account level (out of character), which they will then be able to spend in a metagame shop. Here they will be able to purchase particularly special items, such as one-off potions to temporarily increase certain stats, treasure maps and magical artifacts.

Thanks to a potential large-scale project contract I may or may not be working on, I was taking a look at CodeIgniter (light-weight PHP framework) yesterday. I've never worked with PHP frameworks before, and looking over the documentation shows how different the workflow would be (it relies on a strict MVC architecture). Still, CodeIgniter looks very promising, and I'm interested in using it with Age of Avarice. But first, I need to settle on a website design!

Come At Me, Son

For the time being, this is what I'm working on - a depiction of a scene from the first era of Anathema Online... Sort of. The fight between King Hyacinth and the disinherited rebel, Prince Ezra during the final attack on Avaricia during the Pyrean War. Originally, it was another character (named Scythes) who actually fought against Hyacinth, but as Ian has been rewriting the history, there's been a lot of shuffling of characters and facts. Many characters were cut or merged, resulting in a much tidier (and more logical) progression of events.

For now, I'm mostly satisfied with the composition below. I've undoubtedly taken a lot of liberties with Ezra's character - I can't even remember what he looked like originally, and I don't particularly care. He started off as a self-important princeling, so I wanted to reflect a serious change by giving him a relatively beefy musculature, as well as a noble warrior's tail. Of course, to mark the event itself, I definitely want to include a view of Avaricia in flames through the tall (and broken) windows.

Another Building

Carnival Videos

Uploaded some Carnival gameplay videos on Youtube.

Exploring Avaricia Again

It's funny how we roleplayed in Avaricia, and used it as the setting for plenty of 'creative writing' (if you can use such lofty terms to refer to Anathema Online), but I've never had a clear sense of what Avaricia really looked like. In my mind, it was not unlike Troy (from the 2004 film), but carried some medieval elements. When you think about it though, standard English medieval architecture does not blend well with anything remotely Hellenic. At best, you can strive for Romanesque or Renaissance, but that's nothing close to what I wanted.

I've since compromised heavily, and am still in the process of refining my thoughts. I've always found drawing architecture to be extremely difficult, so I've also taken this as an opportunity to sharpen my skills in that area. Here's what I've got so far as an "Avarician" architectural style. Focus on the building on the right.

I'm trying to include a clean, light coloured stone as a major element in all construction, along with including things like columns here and there. I'm also interested in expanding on the use of arches - not as arcades, but as inlaid forms over doors and windows. These are examples of buildings you might find in less wealthy areas of the city - I'm going to aim for much taller structures closer to the palace. Also, I may work further on this particular sketch - right now, it's devoid of life. Were this truly a living city, the street would be full of carts and stalls.