---
title: Possibility of Averaged Drawing Method in Comics
tags: 
author: [Nakamura Laboratory (Meiji University)](https://www.docswell.com/user/nkmr-lab)
site: [Docswell](https://www.docswell.com/)
thumbnail: https://bcdn.docswell.com/page/5GE5P32QE4.jpg?width=480
description: Possibility of Averaged Drawing Method in Comics コミック作成における平均描画手法の可能性 at JSAI2016
published: June 12, 16
canonical: https://www.docswell.com/s/nkmr-lab/ZJWGJK-possibility-of-averaged-drawing-method-in-comics
---
# Page. 1

![Page Image](https://bcdn.docswell.com/page/5GE5P32QE4.jpg)

コミック作成における  
平均描画⼿手法の可能性
新納  真次郎郎（明治⼤大学B4）  
中村  聡史（明治⼤大学）  
鈴鈴⽊木  正明（明治⼤大学）  
⼩小松  孝徳（明治⼤大学）	
  


# Page. 2

![Page Image](https://bcdn.docswell.com/page/V9726Z4WJR.jpg)

背景
•
絵を描く際、⼀一筆では納得がいかずに何度度も
描いては消してを繰り返してしまうケースがある


# Page. 3

![Page Image](https://bcdn.docswell.com/page/5DJY9RM9EM.jpg)

背景
•
絵を描く際、⼀一筆では納得がいかずに何度度も
描いては消してを繰り返してしまうケースがある
毎回ブレがあるため、描いたり消したり
してしまうのではないだろうか？


# Page. 4

![Page Image](https://bcdn.docswell.com/page/2V7NLDWDJ8.jpg)

背景
•
コミック作成において、“アタリ”  や  “ラフスケッチ”
を⾏行行い整った絵を描いている
アタリ
ラフスケッチ
(http://digital-‐‑‒illust.com/kakikata-‐‑‒kouza/)


# Page. 5

![Page Image](https://bcdn.docswell.com/page/GYJ94GX8E3.jpg)

背景
•
コミック作成において、“アタリ”  や  “ラフスケッチ”
を⾏行行い整った絵を描いている
このような⼿手順を踏まずほかの  
アプローチでブレを補正できないだろうか？
アタリ
ラフスケッチ
(http://digital-‐‑‒illust.com/kakikata-‐‑‒kouza/)


# Page. 6

![Page Image](https://bcdn.docswell.com/page/5GJ8QV2ZED.jpg)

  関連研究
•
ShadowDraw  [Lee  2011]  
-‐‑‒
ストロークからリアルタイムに⽬目的の絵を推測し
バックグラウンドに影を描画


# Page. 7

![Page Image](https://bcdn.docswell.com/page/MLJLX521JR.jpg)

  関連研究
•
ShadowDraw  [Lee  2011]  
-‐‑‒
ストロークからリアルタイムに⽬目的の絵を推測し
バックグラウンドに影を描画
ストローク⾃自体を補正するものではない


# Page. 8

![Page Image](https://bcdn.docswell.com/page/547ML385EW.jpg)

  関連研究
•
Pegasus  [Igarashi  1998]  
-‐‑‒
対話的整形と予測描画により
幾何学的図形の描画を⾼高速かつ正確にする


# Page. 9

![Page Image](https://bcdn.docswell.com/page/ZP7RKQ5ZE9.jpg)

  関連研究
•
Pegasus  [Igarashi  1998]  
-‐‑‒
対話的整形と予測描画により
幾何学的図形の描画を⾼高速かつ正確にする
⼿手描きにおける個性は残らない


# Page. 10

![Page Image](https://bcdn.docswell.com/page/NPJXL5K1JX.jpg)

  関連研究
•
平均⽂文字は美しい[中村  2014]  
-‐‑‒
⼿手書き⽂文字を数式化することで、複数の⽂文字を平均化  
-‐‑‒
平均した⽂文字は美しいことを明らかに  
中村，鈴木，小松!
平均文字は美しい，EC2014!
みんなが書いた⽂文字
平均⽂文字


# Page. 11

![Page Image](https://bcdn.docswell.com/page/63JKL65MED.jpg)

  平均図形も…？
•
図形も平均することで綺麗麗になるのではないだろうか？
平均化すると
？


# Page. 12

![Page Image](https://bcdn.docswell.com/page/4LE336K2E5.jpg)

  平均図形も…？
•
図形も平均することで綺麗麗になるのではないだろうか？
？
平均図形を⽤用いることで
平均化すると
⼿手描きの補正に使えるのでは？


# Page. 13

![Page Image](https://bcdn.docswell.com/page/V8ED4V36JG.jpg)

  平均図形zおける仮説
1. 実際に描いた図形よりも、平均図形が綺麗麗になる
2. それぞれの平均図形よりも、複数⼈人でとった
平均図形が綺麗麗になる
3. ⾮非利利き⼿手の平均図形は、利利き⼿手の平均図形に
類似する


# Page. 14

![Page Image](https://bcdn.docswell.com/page/4V7PMVPZ78.jpg)

  ⽬目的
•
平均図形の可能性を明らかにする  
① 平均図形  &gt;  実際に描いた図形  
② 複数⼈人の平均図形  &gt;  それぞれの平均図形  
③ 利利き⼿手の平均図形  ≒  ⾮非利利き⼿手の平均図形
•
コミック作成における“アタリ”や”ラフスケッチ”と
いった作業を要さないドローイングツールのプロトタ
イプシステムを実装する


# Page. 15

![Page Image](https://bcdn.docswell.com/page/L2JV9Z2MEQ.jpg)

  平均図形⽣生成⼿手法
1.
2.
3.
4.
+
2
筆跡を点列列と  
して取得
スプライン補間
フーリエ級数展開  
により数式化
得られた数式を
平均


# Page. 16

![Page Image](https://bcdn.docswell.com/page/Z5EGZ4RX7L.jpg)

  平均図形⽣生成⼿手法
1.
2.
3.
4.
+
2
筆跡を点列列と  
して取得
スプライン補間
フーリエ級数展開  
により数式化
得られた数式を
平均


# Page. 17

![Page Image](https://bcdn.docswell.com/page/V4JQLGV5EP.jpg)

  平均図形⽣生成⼿手法
1.
2.
3.
4.
+
2
筆跡を点列列と  
して取得
スプライン補間
フーリエ級数展開  
により数式化
得られた数式を
平均


# Page. 18

![Page Image](https://bcdn.docswell.com/page/DK74D5MVJ1.jpg)

  平均図形⽣生成⼿手法
実際にストロークをフーリエ級数展開した例例
! = #$ % =
1.
362.574
61.053
2. -48.878
-36.107
-6.699
-6.737
0.166
5.034
14.774
-11.984
×
×
×
×
×
×
×
×
×
×
cos(0t)
cos(1t)
cos(2t)
cos(3t)
cos(4t)
cos(5t)
cos(6t)
cos(7t)
cos(8t)
cos(9t)
+
+
3.+
+
+
+
+
+
+
+
0
-0.008
0.013
0.015
0.004
0.005
0.000
-0.005
-0.016
0.015
×
×
×
×
×
×
×
×
×
×
sin(0t)
sin(1t)
4.
sin(2t)
sin(3t)
sin(4t)
sin(5t)
sin(6t)
sin(7t)
sin(8t)
sin(9t)
61.053
-48.878
-36.107
-6.699
-6.737
0.166
5.034
14.774
-11.984
×
×
×
×
×
×
×
×
×
cos(1t)
cos(2t)
cos(3t)
cos(4t)
cos(5t)
cos(6t)
cos(7t)
cos(8t)
cos(9t)
+
+
+
+
+
+
+
+
+
-0.008
0.013
0.015
0.004
0.005
0.000
-0.005
-0.016
0.015
×
×
×
×
×
×
×
×
×
sin(1t)
sin(2t)
sin(3t)
sin(4t)
sin(5t)
sin(6t)
sin(7t)
sin(8t)
sin(9t)
+
2
フーリエ級数展開   得られた数式を
筆跡を点列列と  
スプライン補間
&amp; = &#039;$ % = 362.574
×
cos(0t)
+
0.000
×
sin(0t)
により数式化
して取得
平均


# Page. 19

![Page Image](https://bcdn.docswell.com/page/PLJ1ZW847G.jpg)

  平均図形⽣生成⼿手法
1.
2.
3.
4.
+
2
筆跡を点列列と  
して取得
スプライン補間
フーリエ級数展開  
により数式化
得られた数式を
平均


# Page. 20

![Page Image](https://bcdn.docswell.com/page/8GJW96ZZJ2.jpg)

  平均図形は綺麗麗になる？
平均化すると
平均図形


# Page. 21

![Page Image](https://bcdn.docswell.com/page/W4EZ9Y1LE3.jpg)

  評価実験
•
⽬目的：客観的かつ主観的に平均図形が
 　 　 　綺麗麗になることを明らかに  
① 平均図形  &gt;  実際に描いた図形  
② 複数⼈人の平均図形  &gt;  それぞれの平均図形  
③ 利利き⼿手の平均図形  ≒  ⾮非利利き⼿手の平均図形
•
⼿手続き：
図形データセット構築
→
図形の平均化
→
評価


# Page. 22

![Page Image](https://bcdn.docswell.com/page/KY76KDLM7V.jpg)

  図形データセット構築  
•
データセット構築者  8⼈人  
•
図形  8パターン  
•
-‐‑‒
客観的評価 　4パターン  
-‐‑‒
主観的評価 　4パターン  
利利き⼿手  /  ⾮非利利き⼿手  5回
ユーザ平均図形 　 　
全体平均図形 　
・・・
平均化
Aさん
Bさん
Hさん
8⼈人分の平均
※図形データセットは(http://nino.nkmr.io/Research/AvgData2.php)で閲覧できます7


# Page. 23

![Page Image](https://bcdn.docswell.com/page/5G75P31Q74.jpg)

  客観的な評価実験
評価の仕⽅方
1.  平⾏行行な線
 　最⼩小⼆二乗法により近似直線を求め，  
 　2直線のなす⾓角を算出し，平⾏行行・垂直  
 　度度合いを計測（理理想値は0)
cosθ%
%
θ
２.  垂直な線
=&quot;&quot;
3.  円
4.  星
 　真円度度（内接円と外接円の半径の⽐比）を  
 　求め，円度度合いを計測（理理想値は1）
 　10画の辺の⻑⾧長さの分散を求め星度度合いを計測  
 　（理理想値は0)
R&quot;
r&quot;
r&quot;
R&quot;


# Page. 24

![Page Image](https://bcdn.docswell.com/page/V9J26Z1WER.jpg)

  実験結果
仮説①
仮説①
仮説②
仮説②
※（  ）内は標準偏差  
太⽂文字の数値はその図形において最も⾼高評価だったもの


# Page. 25

![Page Image](https://bcdn.docswell.com/page/5DEY9RZ97M.jpg)

  実験結果
仮説①
仮説①
仮説②
仮説②
客観的に平均図形は美しい！
※（  ）内は標準偏差  
太⽂文字の数値はその図形において最も⾼高評価だったもの


# Page. 26

![Page Image](https://bcdn.docswell.com/page/2VJNLD3DE8.jpg)

  主観的な評価実験  ①  ②
•
•
評価者  16名  
-‐‑‒
データセット構築者 　8⼈人  
-‐‑‒
データセット⾮非構築者 　8⼈人  
Web  評価システムでの評価  
-‐‑‒
1,２,３位で綺麗麗だと思うものを評価（3点,2点,1点で加算)  


# Page. 27

![Page Image](https://bcdn.docswell.com/page/GYE94G9873.jpg)

  仮説①：平均図形  &gt;  実際に描いた図形？
利き手
非利き手
平均


# Page. 28

![Page Image](https://bcdn.docswell.com/page/5GE8QV9Z7D.jpg)

  仮説①：平均図形  &gt;  実際に描いた図形？
利き手
非利き手
個⼈人の平均図形は  
実際に描いた図形よりきれい
平均


# Page. 29

![Page Image](https://bcdn.docswell.com/page/MLELX5W1ER.jpg)

  仮説②：全体の平均図形  &gt;  それぞれの平均図形？
8人それぞれの平均図形
全体


# Page. 30

![Page Image](https://bcdn.docswell.com/page/54JML3957W.jpg)

  仮説②：全体の平均図形  &gt;  それぞれの平均図形？
8人それぞれの平均図形
全体
複数⼈人でとった平均図形のほうが  
それぞれの平均図形よりもきれい


# Page. 31

![Page Image](https://bcdn.docswell.com/page/ZPJRKQGZ79.jpg)

  主観的な評価実験  ③
•
⾮非利利き⼿手平均  ≒  利利き⼿手平均？  


# Page. 32

![Page Image](https://bcdn.docswell.com/page/NPEXL5X1EX.jpg)

  仮説③：  利利き⼿手平均  ≒  ⾮非利利き⼿手平均？


# Page. 33

![Page Image](https://bcdn.docswell.com/page/63EKL6WM7D.jpg)

  仮説③：  利利き⼿手平均  ≒  ⾮非利利き⼿手平均？
⾮非利利き⼿手の平均は利利き⼿手平均に類似する


# Page. 34

![Page Image](https://bcdn.docswell.com/page/4L73361275.jpg)

  明らかにした仮説と可能性
1. 実際に描いた図形よりも、平均図形が綺麗麗になる
→  ⾃自分が描いた絵を平均することで綺麗麗にすることができる
2. それぞれの平均図形よりも、複数⼈人でとった
平均図形が綺麗麗になる
→  他⼈人（例例えば⿃鳥⼭山明さん）のストロークデータを
 　使うことで、⾃自分の⼿手描き個性と他⼈人の個性を混ぜる
 　ことができる？
3. ⾮非利利き⼿手の平均図形は、利利き⼿手の平均図形に
類似する
→  利利き⼿手が使えない状態でも⾮非利利き⼿手で再現できる？


# Page. 35

![Page Image](https://bcdn.docswell.com/page/V87D4VX6EG.jpg)

  明らかにした仮説と可能性
1. 実際に描いた図形よりも、平均図形が綺麗麗になる
→  ⾃自分が描いた絵を平均することで綺麗麗にすることができる
2. それぞれの平均図形よりも、複数⼈人でとった
平均図形が綺麗麗になる
コミック作成に応⽤用し、
→  他⼈人（例例えば⿃鳥⼭山明さん）のストロークデータを
 　使うことで、⾃自分の⼿手描き個性と他⼈人の個性を混ぜる
⼿手描きのブレの補正に使えないだろうか？
 　ことができる？
3. ⾮非利利き⼿手の平均図形は、利利き⼿手の平均図形に
類似する
→  利利き⼿手が使えない状態でも⾮非利利き⼿手で再現できる？


# Page. 36

![Page Image](https://bcdn.docswell.com/page/4VJPMVKZJ8.jpg)

  Average  Painter
•
繰り返しの試⾏行行の平均をとることでブレを補正する
ドローイングツールのプロトタイプシステムを実装  
①
線を描く
②
同じ線を  
重ねて描く
③
④
2つの線の平均を   その線をクリック  
とった線が⾚赤く  
することで  
表⽰示される
描画が確定


# Page. 37

![Page Image](https://bcdn.docswell.com/page/L2EV9ZVM7Q.jpg)

デモ
※インタラクティブセッションでデモ展⽰示しているのでぜひご利利⽤用ください
16


# Page. 38

![Page Image](https://bcdn.docswell.com/page/Z57GZ4LXJL.jpg)

  システムの問題点  
•
計算処理理の都合上、⼀一画前のストロークのみの
平均をとれない
→  コンピュータがどの線を書いているかを判断し、
 　同⼀一のストロークだと判断したものを平均化  
•
髪など複数線を描く部位に対しては不不向きである
→  コンピュータが髪を描いていると判断したら、
 　平均線を描画させないといったことを検討


# Page. 39

![Page Image](https://bcdn.docswell.com/page/V4EQLGY57P.jpg)

  まとめ
•
平均図形における仮説を明らかにした  
-‐‑‒
-‐‑‒
-‐‑‒
•
平均図形  &gt;  実際に描いた図形  
全体の平均図形  &gt;  それぞれの平均図形  
利利き⼿手の平均図形  ≒  ⾮非利利き⼿手の平均図形  
平均図形の特徴を利利⽤用したドローイングツールの
プロトタイプシステムを実装した  
[今後の課題]  
•
より多くの図形や被験者での評価実験  
•
ドローイングツールのユーザスタディとシステムの改良良


