Dynamic Avatar Drawing Tool (Character Viewer)

[Penumbra]

One stop character visualization tool, with dynamic clothing and body parts (body parts are interchangeable as you can see below with replacing a hand).


This is in no way built for the sole purpose of being included into Fenoxo's games. 


Development site: http://johnsonzhong.me/DAD/


Changelog


1.14 art evolution and new content


For more detail: http://johnsonzhong.me/DAD/release/2016/10/18/1.14.art_upgrade.html

(eyelashes exist now; shading for arms and breasts improved)


And 60FPS transformation animation:

1.4 content dump (lots of art evolution, hairstyles, and clothing)


See full post: http://johnsonzhong.me/DAD/release/2016/09/04/1.4.content_update.html

 

[TFMaster]

It's a little crude but that's ok I understand that coding stuff can be hard to do. Does it do animal ears, tails, or wings, or is it just normal human beings?

 

[Chesheire]

Fuckin' A man, nice going! It looks like the sliders themselves are very simplistic, and that seems to work in your favor. Props to you for doing something not many other people would or could do!

 

[Penumbra]

@TFMaster The avatar is based on human anatomy in terms of bone and muscle locations, but adding in animal ears, tails, and wings should be trivial. Something more complex would be drawing other races with a totally different anatomy such as having multiple limbs and so on. In terms of it being crude, could you specify what do you mean by crude? Are you talking about the shapes being too simple (not enough curves in the face, etc...), or something else?


@Chesheire Thanks for the encouragement!

 

[TFMaster]

Are you talking about the shapes being too simple (not enough curves in the face, etc...)

Well that and the characters have no fingers or toes. Like I said before I give you props for even doing such a thing in the first place.

 

[Penumbra]

@TFMaster Ah I didn't mean it in a defensive way. I just like having feedback and hearing how people think what I work on can be improved

 

[Xeivous]

The faces and heads are honestly a bit creepy. Otherwise I'm rather impressed.

 

[Lashcharge]

I feel like the lines are a bit too thick, specially on the dudes. That might just be me through.

 

[Penumbra]

@Xeivous  Is it mostly because of the eyes being too wide so that they look surprised all the time?

 

[Xeivous]

Basically all the facial features just feel off. I'm not even sure how to describe just what is wrong.

 

[Timeagain]

A lack of eyebrows is probably a large part of it

 

[Ethereal Dragon]

fugly but I suppose it'll do... faces are still creepy as fuck though lol

 

[Penumbra]

I'll work to improve it, but realize that it's still in Alpha and I'm only 1 person working on it for fun xP.


I'd really appreciate if anyone would like to help though.


In other news, version 0.9 is up with changes to the code structure where everything is now inside of the da module for ease of inclusion into other games. (not sure if this applies here)

 

[Penumbra]

Ok due to the widespread claim that the faces are creepy, I added in eyebrows (with all the mod stats associated with it), better eyes, and alternative lips for thin and long lips:


Here's a look at some of the range of faces (not a full range)

 

[Mustang Flex]

Okay, the faces don't look like soulless automatons, begging for the release of death.

 

[Xeivous]

I'd argue that they look far less like soulless automatons, begging for the release of death, but I wouldn't go much further. Especially for the dude on the far left.

 

[Mustang Flex]

They look a lot better with eyebrows. I think they've upgraded from mannequins with human skin stretched over them to human corpses made into mannequins.

 

[Penumbra]

Haha, is that a judgement on the face only or the whole body?


What should I tackle next for better looking avatars?

 

[Couch]

Haha, is that a judgement on the face only or the whole body?


What should I tackle next for better looking avatars?

Eyes.  You need to adjust these anyway if you want this to work for TiTS, since at present there are additionally zil eyes (black sclera) and naleen eyes (catlike).

 

[Karretch]

Eyes.  You need to adjust these anyway if you want this to work for TiTS, since at present there are additionally zil eyes (black sclera) and naleen eyes (catlike).

Getting a bit ahead, this groundwork isn't just TiTS related. We should focus on just basics. However, zil eyes aren't just black sclera, they are full on bug eyes from what I can tell (correct me if I'm wrong please), same with myr which I don't quite get why they are separate.

 

[Penumbra]

The eye pattern is actually quite trivial to do. The system's really well designed to handle any kind of fill or stroke pattern you'd like. Some rough work:





But yeah, I think eyes aren't the biggest issue here.

 

[Couch]

In particular the eyes could do with a much thinner stroke width, see if that reduces the eye shadow effect.

 

[Nik_van_Rijn]

Eyes.  You need to adjust these anyway if you want this to work for TiTS, since at present there are additionally zil eyes (black sclera) and naleen eyes (catlike).

Also Myr eyes, demonic eyes, vanae eyes, kerokora eyes and leithan eyes.

However, zil eyes aren't just black sclera, they are full on bug eyes from what I can tell (correct me if I'm wrong please), same with myr which I don't quite get why they are separate.

'Black sclera and iris result in eyes that appear solid black', so I assume the structure of their eyes is human-like. Myr eyes are black and compound. Additionally, Zil tend to have good eyesight, while most of Myr have poor one.

 

[Karretch]

Also Myr eyes, demonic eyes, vanae eyes, kerokora eyes and leithan eyes.


'Black sclera and iris result in eyes that appear solid black', so I assume the structure of their eyes is human-like. Myr eyes are black and compound. Additionally, Zil tend to have good eyesight, while most of Myr have poor one.

From the gold version "Their structure allows you to have a larger angle of vision as well as detecting the fastest of movements." While it still mentions the sclera and iris, there's something different as evident.

 

[Nik_van_Rijn]

From the gold version "Their structure allows you to have a larger angle of vision as well as detecting the fastest of movements." While it still mentions the sclera and iris, there's something different as evident.

True, but the difference may be unnoticeable by the naked eye, and in any case, they aren't 'bug eyes' either.

 

[Penumbra]

The point of the eye pattern demo wasn't to best represent those species' eyes, but to show that it could be done relatively easily (took about 30 minutes, most of which was modifying the framework to allow functions to be passed as colors, so new eye patterns should take less than 5 minutes each)...

 

[Nebula Fox]

From what I've seen, while the sliders take some getting used too, they still seem pretty confusing to try to manage, and I'm someone who takes maybe 10 minutes making a character face in Dark Souls/Bloodborne. Another glaring problem I see for this is that it's impossible to make a feminine character with a dick in this.

 

[Penumbra]

@Nebula Fox That's been fixed in 0.11. With a high penis mod, you can overcome any femininity barriers. With 0.11 drawpoints can also now be toggled on and off on the canvas. You can click near them to reveal their names. (eventually probably will add dynamic clothes maker).


Some new clothing templates were also added. The process of creating clothing templates have been extremely simplified, so the turtleneck code is basically:


da.ctp.top.drawTurtleNeck = function(stroke, fill) {
function drawHalf(ctx, ex, mods) {

if (ex.deltoids) {
da.drawPoints(ctx, ex.neck.nape, ex.neck.top, ex.trapezius.top,
ex.collarbone, ex.collarbone.top, ex.deltoids, ex.shoulder,
ex.elbow.out, ex.wrist.out);
da.averageQuadratic(ctx, ex.wrist.out, ex.wrist.in);
da.drawPoints(ctx, null, ex.ulna, ex.elbow.in, ex.armpit,
ex.trapezius.bot, ex.waist, ex.hip, ex.pelvis);
// da.drawPoints(ctx, ex.armpit, );
}
else {
ctx.moveTo(ex.neck.nape.x, ex.neck.cusp.y-10);
ctx.bezierCurveTo(ex.neck.nape.x-5, ex.neck.cusp.y-10,
ex.neck.cusp.x-10, ex.neck.top.y+5, ex.neck.cusp.x, ex.neck.cusp.y);
da.drawPoints(ctx, null, ex.collarbone, ex.shoulder,
ex.elbow.out, ex.wrist.out);
da.averageQuadratic(ctx, ex.wrist.out, ex.wrist.in);
da.drawPoints(ctx, null, ex.ulna, ex.elbow.in, ex.armpit, ex.waist, ex.hip, ex.pelvis);
}
}
return da.getFullDrawer(stroke, fill, 2, drawHalf);
}

 

[Kesil]

this last version doesn't work well for me. When I load it, the default character is headless, and randomising it gives me a literal stick of a character and a NaN.


Edit: after clicking on "Toggle Drawpoints", I get a regular character (even after closing the browser window), but I can't modify it.

 

[Penumbra]

@Kesil Hmm haven't encountered that problem testing with a downloaded version... What browser are you using, and can you bring up the developer console (F12 on Chrome and go to the console tab)  and refresh the page? It should give you some red lines indicating error.