-
Notifications
You must be signed in to change notification settings - Fork 0
/
guide.html
340 lines (336 loc) · 19.4 KB
/
guide.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Valkrana Art Guide</title>
<meta name="description" content="Thank you for your purchase of the official So You Think You Can Draw Valkrana VHS!">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/style_guide.css">
<link rel="stylesheet" href="css/navbar.css">
<link rel="icon" href="img/favicon.png">
<meta property="og:type" content="website">
<meta property="og:title" content="Valkrana, an awkward skeletal necromancer." />
<meta property="og:description" content="An awkward undead necromancer with a passion for magic, an enthusiasm for skeletons, a tooth for cookies, a knack for intel brokerage, and above all else, an undying fervor for her darling." />
<meta property="og:url" content="https://valkrana.github.io/guide.html" />
<meta property="og:image" content="https://valkrana.github.io/img/meta_img.png" />
<script src="includes.js"></script>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-TE0ZF7QX2X"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-TE0ZF7QX2X');
</script>
</head>
<body>
<!-------------------- NAVIGATION ------------------->
<div id="navs" class="navbar"></div>
<script>navigation()</script>
<!-------------------- CONTENT -------------------->
<div id="Content">
<div style="padding: 5px 5px 5px; text-align: center; font-size: 20px; height: 0px">
<a href="guide.html"><p class="noindent">EN</a> |
<a href="guidejp.html">日本語</a>
</div>
<div id="container">
<div>
<p class="noindent" style="padding: 20px 0 10px 0; font-size: calc(15px + 0.1vw);">Thank you for your purchase of the official <span style="color: #9d1be9">So You Think You Can Draw Valkrana</span> VHS! This VHS will aid in your journey from zero to Valkrana by providing brief references and details regarding her most notable features.
</div>
<!-- ANATOMY BEGINS -->
<div>
<h1 style="color: #00ccff">Anatomy</h1>
<hr class="girlhowdy">
</div>
<!-- NSFW Anatomy References
<div>
<h2>NSFW References</h2><br>
<hr class="girlhowdy">
<p class="noindent">Click <a href="img/popopoka_2.png" target="_blank">here</a> for a partial NSFW anatomy reference.
</div>-->
<!-- SFW Anatomy References -->
<div class="grid">
<div>
<h2>Skeletal</h2><br>
<hr class="girlhowdy">
<p class="noindent">Partly skeletal. The following image should give a crude idea of which parts of her are skeletal (in <span style="color: red">red</span>). Where skeleton meets "meat" (see: Skin below) there is no gore, only skeleton protruding from a smooth surface.
<div align="center">
<a href="img/guide/skeleton.png" target="_blank"><img class="grid_img" src="img/guide/skeleton.png" style="padding-top:10px;"></a>
</div>
</div>
<div>
<h2>Extra Arm</h2><br>
<hr class="girlhowdy">
<p class="noindent">An extra (skeletal) arm has been grafted to her upper back at roughly the middle of her right scapula. This arm is sometimes taken from an adult, and as such, can be either the same size or a little larger and longer than her other arms.
<div align="center">
<a href="img/guide/extraarm.png" target="_blank"><img class="grid_img" src="img/guide/extraarm.png" style="padding-top:10px;"></a><br>
<a href="img/guide/extraarm2.png" target="_blank"><img class="grid_img" src="img/guide/extraarm2.png" style="padding-top:10px;"></a>
</div>
</div>
<div>
<h2>Wounds</h2><br>
<hr class="girlhowdy">
<p class="noindent">Three gnarly, open claw wounds rend her head, each secured with but a few staples.
<div align="center">
<a href="img/guide/wounds.png" target="_blank"><img class="grid_img" src="img/guide/wounds.png" style="padding-top:10px;"></a>
</div>
</div>
<div>
<h2>Drool</h2><br>
<hr class="girlhowdy">
<p class="noindent">Constantly drools a thin line of lightly-colored greenish-brown digestive fluid down her chin.
<div align="center">
<a href="img/guide/drool.png" target="_blank"><img class="grid_img" src="img/guide/drool.png" style="padding-top:10px;"></a><br>
<a href="img/guide/drool2.png" target="_blank"><img class="grid_img" src="img/guide/drool2.png" style="padding-top:10px;"></a>
</div>
</div>
<div>
<h2>Mouth</h2><br>
<hr class="girlhowdy">
<p class="noindent">Begone, suburban fences! Not simply VVVVV teeth, Valkrana's teeth are more like shark teeth with slight space between individual teeth. Also note that her mouth is wider than normal, and her lips are pale purple.
<div align="center">
<a href="img/guide/teeth.png" target="_blank"><img class="grid_img" src="img/guide/teeth.png" style="padding-top:10px;"></a>
</div>
</div>
<div>
<h2>Hair</h2><br>
<hr class="girlhowdy">
<p class="noindent">Oily black. Messy. Unkempt. Bedhead. Cowlicks. Stray hairs. She usually keeps it in a low braid, but can't keep it neat due to her wounds. When worn down, it reaches the middle of her back.
<div align="center">
<div>
<a href="img/guide/hair2x.png" target="_blank"><img class="grid_img" src="img/guide/hair2x.png" style="padding:10px 5px 0 0;"></a>
</div>
</div>
</div>
<div>
<h2>Eye</h2><br>
<hr class="girlhowdy">
<p class="noindent">Iris color is a pale lavender, <span style="color: #cb94f2">#CB94F2</span>. The sclera (white) of her eye is black. Eye shape: Her upper eyelid is usually a flat line.
<div align="center">
<a href="img/guide/eye.png" target="_blank"><img class="grid_img" src="img/guide/eye.png" style="padding-top:10px;"></a>
<a href="img/guide/eye2.png" target="_blank"><img class="grid_img" src="img/guide/eye2.png" style="padding-top:10px;"></a>
</div>
</div>
<div>
<h2>Ears</h2><br>
<hr class="girlhowdy">
<p class="noindent">Pointed and elongated, like those of an elf. Length is variable.
<div align="center">
<a href="img/guide/ear.png" target="_blank"><img class="grid_img" src="img/guide/ear.png" style="padding-top:10px;"></a>
<a href="img/guide/ear2.png" target="_blank"><img class="grid_img" src="img/guide/ear2.png" style="padding-top:10px;"></a>
</div>
</div>
<div>
<h2>Skin</h2><br>
<hr class="girlhowdy">
<p class="noindent">Pale white. Marrow- and cartilage-stuff mimic meat but have a cold, too-smooth texture. She has no blood, so no flushing or bruising.
<div align="center">
<a href="img/guide/skin.png" target="_blank"><img class="grid_img" src="img/guide/skin.png" style="padding-top:10px;"></a>
<a href="img/guide/skin2.png" target="_blank"><img class="grid_img" src="img/guide/skin2.png" style="padding-top:10px;"></a>
</div>
</div>
<div>
<h2>Frame</h2><br>
<hr class="girlhowdy">
<p class="noindent">Short, thin, and underdeveloped. Valkrana died, and was subsequently reanimated, at the age of 10, as a mortally ill, malnourished urchin. Image below compares the average female height (5'4") with Valkrana's height (4'2").
<div align="center">
<a href="img/guide/height.png" target="_blank"><img class="grid_img" src="img/guide/height.png" style="padding-top:10px;"></a>
</div>
</div>
<div>
<h2>Expressions</h2><br>
<hr class="girlhowdy">
<p class="noindent">Valkrana's default, most common expression is deadpan. She will show childish fascination with rare magic or skeletons. She has a temper, and doesn't hide it when it flares. When interacting with or discussing her darling, she tends to be either lovey-dovey or yandere.
<div align="center">
<a href="img/guide/deadpan.png" target="_blank"><img class="grid_img" src="img/guide/deadpan.png" style="padding-top:10px;"></a>
</div>
</div>
<div>
<h2>Poses</h2><br>
<hr class="girlhowdy">
<p class="noindent">Valkrana is an extremely awkward child, and it shows in her carriage and mannerisms. She isn't typically a high-energy person. Has a habit of tucking her arms to her chest when talking to her darling.
</div>
</div>
<!-- CLOTHING BEGINS -->
<div>
<h1 style="padding-top: 15px">Clothing & Accessories</h1>
<hr class="girlhowdyc">
</div>
<div>
<h3>Full-Body Clothing Reference</h3><br>
<hr class="girlhowdyc">
<p class="noindent">These are good clothing references. Nonetheless, I've added concise details and notes below the image. A change or two should be made, such as removing the third sleeve.
<div class="grid">
<div>
<a href="img/guide/clothingreference2.png" target="_blank"><img class="grid_img" src="img/guide/clothingreference2.png"></a>
</div>
<div>
<a href="img/valkrana_nuyums_neutral.webp" target="_blank"><img class="grid_img" src="img/valkrana_nuyums_neutral.webp"></a>
</div>
<div>
<a href="img/guide/clothingreference1.PNG" target="_blank"><img class="grid_img" src="img/guide/clothingreference1.PNG"></a>
</div>
</div>
</div>
<div>
<h3>Layer 1</h3>
<p class="noindent">INNER LAYER
<p><span style="color: #ff8ccf;">Dress Shirt:</span> collared bone-white (#ece6d8) button-up shirt.
<p class="dblindent">• Poison purple (#7f01fe) ribbon at the collar.
<p><span style="color: #ff8ccf;">Trousers:</span> bone-white (#ece6d8) and slim but not tight.
<p><span style="color: #ff8ccf;">Boots:</span> Dark brown as pictured above.<br>
<h3>Layer 2</h3>
<p class="noindent">OUTER LAYER
<p><span style="color: #ff8ccf;">Robe-Jacket:</span> Combines a traditional wizard robe with a <a href="https://pbs.twimg.com/media/EJGEFgbUUAAhmGX?format=jpg&name=large" target="_blank">militech jacket</a>. Dark brown primary color with bone-white (#ece6d8) secondary color.
<p class="dblindent">• Stops just above the knees. Loose enough at the bottom to run in, but not flared.<br>
<p class="dblindent">• Militech material, style, and pockets.<br>
<p class="dblindent">• Sleeves should have open, wide cuffs that end at her wrist.<br>
<p class="dblindent">• Usually worn with the top quarter unbuttoned or unzipped.<br>
<p class="dblindent">• Third Arm:<br>
<p class="trplindent">◦ Emerges from <a href="https://i.imgur.com/85pnjQs.png" target="_blank">a vent in the jacket's upper back</a>.<br>
<p class="trplindent">◦ No sleeve. Remove sleeve!<br>
<p class="dblindent">• Pockets: All slanted pockets should be facing her right side (for access by her extra arm). Some examples of contents below.<br>
<p class="trplindent">◦ Vials containing rolled up slips of paper.
<p class="trplindent">◦ A <a href="https://en.wikipedia.org/wiki/File:CipherDisk2000.jpg" target="_blank">caesar cipher.</a>
<p class="trplindent">◦ Bones. Some with a foil finish, like a foil trading card.
<p><span style="color: #ff8ccf;">Hat:</span> Wide brim, dark brown witch's hat. Accessorized with tiny rare bones that dangle from the rim, a cookie charm on the tip, and arcane notes tucked into a belt. <!--<b>The hat's inner lining (underside) should have the same non-uniform poison purple gradient as the cloak.</b>-->
<p><span style="color: #ff8ccf;">Eye Patch:</span> Brown leather eye patch over her left eye. Goofy skull design on the patch.
<p><span style="color: #ff8ccf;">Right Hip:</span>
<p class="dblindent">• A pair of scroll cases.<br>
<p class="dblindent">• A Bag of Holding with skeleton design, which hangs from a shoulder strap.<br>
<p class="trplindent">◦ <a href="img/guide/doll.png" target="_blank">Doll charm</a> attached to bag. The doll was fashioned to resemble <a href="img/guide/ilyana.png" target="_blank">Ilyana Miraquinal</a>.
<p><span style="color: #ff8ccf;">Fingers:</span> 5 magic rings. Designs and locations are variable.<br>
<h3>Layer 3</h3>
<p class="noindent">OVER LAYER
<p><span style="color: #ff8ccf;">Cloak:</span> Collared cloak with charcoal grey outer color and poison purple (#7f01fe) inner lining. Inner lining is a non-uniform gradient.
<p class="dblindent">• Clasps over her left shoulder, low enough on her that you can see her ribbon, shirt, and collar.
<p class="dblindent">• Clasp is bronze with an embossed image of a broom.
</div>
<div>
<h3>Alternative Outfit (Shut-In)</h3><br>
<hr class="girlhowdyc">
<p class="noindent">Valkrana wears this orange t-shirt when lounging around her home. Hair is often left to hang free rather than in a braid. Also includes slippers.
<div class="grid">
<div>
<a href="img/valkrana_nuyums_ohayou.webp" target="_blank"><img class="grid_img" src="img/valkrana_nuyums_ohayou.webp" style="padding-top:10px;"></a>
</div>
<div>
<a href="img/valkrana_nuyums_gourmand.webp" target="_blank"><img class="grid_img" src="img/valkrana_nuyums_gourmand.webp" style="padding-top:10px;"></a>
</div>
</div>
</div>
<!-- Finished Works -->
<div>
<h2 style="color: #9d1be9">Finished Works</h2>
<hr class="girlhowdyp">
<p class="noindent">Please bear in mind that this gallery features pieces that, while useful references in their own right, often deviate here and there from the correct Valkrana design as detailed above. However, Nuyums' illustrations in particular are especially accurate to her design and personality. <a href="gallery.html" target="_blank" style="color: #9d1be9">Proceed to gallery.</a>
</div>
<!--
<div class="row">
<div class="col-lg-6 col-md-6">
<h3>Poncho</h3><br>
<hr class="girlhowdyc">
<p class="noindent">Heavy, woolen, & bright <span style="color: #dd8629">orange #dd8629</span>. Thin fur lining the edges. Reaches just below pelvis in front, waist on sides; covers torso. (Inside has many pockets.) Bordered with arcane glyphs + bones/skeleton pattern (vertebrae/ribs—not skulls).
<div align="center">
<a href="img/guide/poncho.png" target="_blank"><img class="grid_img" src="img/guide/poncho.png" style="padding-top:10px;"></a>
</div>
</div>
<div class="col-lg-6 col-md-6">
<h3>Robe</h3><br>
<hr class="girlhowdyc">
<p class="noindent">Worn beneath poncho. Same <span style="color: #492a1e">dark brown #492a1e</span> as her hat, and trim/secondary color is the same <span style="color: #ece6d8">off-white #ece6d8</span> as her hat's inner lining. Robe reaches just below her knees, under which she wears leggings. Yellow arrow indicates flap that should be removed, and robe more closely drawn in the center. To allow for free movement of the hands, sleeve cuffs are open and wide, and sleeves are semi-fitted.
<div align="center">
<a href="img/guide/robe.png" target="_blank"><img class="grid_img" src="img/guide/robe.png" style="padding-top:10px;"></a>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4 col-md-4">
<h3>Eye Patch</h3><br>
<hr class="girlhowdyc">
<p class="noindent">Brown leather stitched with a goofy skull design over the eye. Worn over left eye socket, even when nude.
<div align="center">
<a href="img/guide/eyepatch.png" target="_blank"><img class="grid_img" src="img/guide/eyepatch.png" style="padding-top:10px;"></a>
</div>
</div>
<div class="col-lg-4 col-md-4">
<h3>Hat</h3><br>
<hr class="girlhowdyc">
<p class="noindent">As below, hat is <span style="color: #492a1e">dark brown #492a1e</span> with an <span style="color: #ece6d8">off-white #ece6d8</span> inner lining. Accessorized with rare bones, cookie charm, and notes on arcana/necromancy/recipes. Fabric ghosts or Teru-Teru Bōzu hanging from hat are incorrect.
<div align="center">
<a href="img/guide/hat.png" target="_blank"><img class="grid_img" src="img/guide/hat.png" style="padding-top:10px;"></a>
</div>
</div>
<div class="col-lg-4 col-md-4">
<h3>Staff</h3><br>
<hr class="girlhowdyc">
<p class="noindent">Valkrana wields a rod-like staff of contiguous polished bone. The only notable feature of the staff is a sleeve of runes around its upper quarter, which glow faintly in the same color as her <span style="color: #fc49b2">magic #fc49b2</span>.
<div align="center">
<a href="img/guide/staff.png" target="_blank"><img class="grid_img" src="img/guide/staff.png" style="padding-top:10px;"></a>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-8 col-md-8">
<h3>Belt</h3><br>
<hr class="girlhowdyc">
<p class="noindent">Belt holds two small pouches, a potion vial, dagger, a couple scroll cases, and a <a href="img/guide/doll.png" target="_blank">Darling Doll</a>.
<div class="row">
<div class="col-lg-6 col-md-6">
<div align="center">
<a href="img/guide/belt.png" target="_blank"><img class="grid_img" src="img/guide/belt.png" style="padding-top:10px;"></a>
</div>
</div>
<div class="col-lg-6 col-md-6">
<div align="center">
<a href="img/guide/scroll.png" target="_blank"><img class="grid_img" src="img/guide/scroll.png" style="padding-top:10px;"></a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-4">
<h3>Boots</h3><br>
<hr class="girlhowdyc">
<p class="noindent">As below. <span style="color:#492a1e">dark brown #492a1e</span>.
<div align="center">
<a href="img/guide/boots.png" target="_blank"><img class="grid_img" src="img/guide/boots.png" style="padding-top:10px;"></a>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4 col-md-4">
<h3>Handkerchief</h3><br>
<hr class="girlhowdyc">
<p class="noindent"><span style="color: #492a1e">dark brown #492a1e</span> with goofy gilt skeleton design. Hangs around neck.
<div align="center">
<a href="img/guide/bandana.png" target="_blank"><img class="grid_img" src="img/guide/bandana.png" style="padding-top:10px;"></a>
</div>
</div>
</div>
-->
<!--
<div class="row">
<div class="col-lg-4 col-md-4">
<h3>Optional Accessories</h3><br>
<hr class="girlhowdyc">
<p class="noindent">1. Stuffed Darling doll, as below. Based on <a href="img/guide/ilyana.jpg" target="_blank">this character</a>.<br>2. Cookie-shaped keychain charm.<br>3. Small black bone trinket.
<div align="center">
<a href="img/guide/doll.png" target="_blank"><img class="grid_img" src="img/guide/doll.png" style="padding-top:10px;"></a>
</div>
</div>
</div>
-->
<div class="buffer" style="padding-top: 20px">
</div>
<div class="footer">
<p class="footer">This guide features art by:
<a href="https://www.pixiv.net/en/users/7499" target="_blank">Nyama</a>,
<a href="https://twitter.com/cacoethicart" target="_blank">Cacoethic</a>,
<a href="https://twitter.com/hikaru_tajima" target="_blank">Hikaru Tajima</a>,
<a href="https://twitter.com/toixxy" target="_blank">toi</a>,
<a href="https://www.pixiv.net/en/users/22266" target="_blank">Anpuraya</a>
</div>
</div>
</div>
</body>
</html>