Devlog #5 - Character Design Pt.1 - From Concepts to Sprite

Hello!ヾ(○･ω･)ﾉ☆ This week we stay artsy with a devlog about Character Design. This will be the first part of a series of logs about the character designs of our //TODO: today cast. In this part I'm going to tell you how I went about creating character art with a closer look at our protagonist Teal.

Prior to March when we prepared for the NaNoRenO 2017, we knew we wouldn't have much time to produce the game. So the two of us tried to make design and production choices based on what we'd love to do but always keeping in mind that our resources are limited. You'll see how strongly this affected the way I designed Teal.

✧ﾟI will not go into drawing facial sprites here, we've got that covered in Devlog#3 if you're interested.ﾟ✧

Sooo...Before any sketch for Teal was done, we had to figure out what key characteristics would define Teal. And we got, kind of, this:

TEAL

• Protagonist
• About the age of us, which makes ~23
• (Aspiring) Artist
• Procrastinates
• Unsatisfied with their art skill
• Suffers from mild anxiety and depression

And here's how I noted the list in my mind during the design process:

TEAL

• Relatable to most and therefore not extremely unique, but unique enough to be memorable
• Young, looks about 15-25
• A child at heart
• Cares about visuals and is therefore aware of current fashion trends
• Gets sidetracked easily and half-asses things out of insecurity about stuff
• Seems lazy and irresolute to people
• Tender soul
• Probably a hikikomori
• Might just fall in love with an AI

As far as this was done I began sketching characters in my sketchbook in a style that is comfortable to me. Personal advice: No matter how motivated, don't try conceptualizing when you have a really bad hangover. It's difficult.

Designing and thinking work in general works best with a clear mind. Now thinking about how Teal is and how I could represent most of their characteristics in her /his designs I showed Felix this sheet:

I commented on my sketches in red to make feedback discussions easier. We went with outfit D, hairstyle 3 (friendly classmate) and opted for the glasses.

Because I feared that I would get lost in the diversity of female fashion styles I made the male looking Teal first and based the female version on it.

Too bad her adorable lacy socks can't be seen on her in-game sprite. But if you've seen the concept, know that Teal has a thing for cute socks.

I haven't colour designed the characters yet to focus on the shape and feel of things. Nonetheless Teal looks rather unspectacular at this point compared to the other characters from //TODO: today but here is why:

• Teal wears her/his hair like nothing special. The fringe is tactical. No bouncy curls because that would look too vivid.
• Glasses to hide their relatively pretty face. And I figured: Most likely “introverted” means “had few friends” so “rather stays at home” therefore “doesn't get enough sunlight” thus “bad eyes”
• Teal lives in a baggy old crew-neck sweater. These are comfortable and hide an attractive body shape or, like in Teal's case, belly fat. A strategic choice. Also it's kind of cool now to wear them oversized.
• Slightly ripped denim pants and skirt. Jeans are durable and comfortable. The average human wears them. The slightly ripped look reminds of a rebellious streak showing that Teal could be more than she/he let's on. But Teal wouldn't dare to go full-punk.
• And sneakers are the go to shoes for young people. Female Teal wears them with plateaus to compensate for her shortness. Cute socks because Teal likes cute things.

To summarize this, I generally like to think a character, like any real person, chooses their clothing or was made by circumstances to look a certain way. That's why I think it's important to understand a character before visualizing them. Teal is your average young adult with a few quirks trying not to stand out too much because it's the more comfortable and safer way to be.

Creating Sprites

The next step was to translate this design into an actual game sprite for the visual novel. I didn't make it consecutively. I haven't decided on Teal's colours yet, right? Yup - because I didn't want to spend time on designing each character and then individually adjust their colours and match them to each other for a consistent style. I decided to conceptualize all of them first to the state of the Teal concept I had. Then in a fresh .psd file, I placed them in a line-up, zoomed out and roughly coloured all of them simultaneously with a limited colour palette.

Like this, I had a good overview and could do the colour designing really quick and dirty. And that was enough before proceeding with the sprites. I have this particular image in the character sprite .psds as a reference and use it to “color pick” from.

The style of the sprites look a bit different from the concept sketches. Mostly because I chose to have as few line weight variations as possible because I tend to get lost in the little details when I do line-work. For the overall style and how the lines would be coloured I was thinking about pixel game sprites. I prepared a pinterest board with inspiring art and architecture for the project as well and used it as a mood- and reference board.

Credits to the respective artists!

What was most important about the style is that it's reproducible for me. A huge help is taking notes along the way. For some pictures and projects like these I like to note the brushes and brush sizes I use. What I also did was having some fixed values. For example for the lines that intersect with the skin colour of every character, the line colour, using the HSV sliders, would be:

SkintoneHue - 9 = LineHue

SkintoneSaturation + 30 = LineSaturation

SkintoneValue – 10 = LineValue

I just found one correlative colour that looks pretty before setting up this calculation. And these would be the most important things I could think of on this topic!
Thanks for reading!（｡◑ヮ◑｡）