The 24th International Conference on Information Integration and Web Intelligence で発表した "Interactive visualization of comic character correlation diagrams for understanding character relationships and personalities" の発表資料です.
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
iiWAS2022_Miyagawa
1. Interactive visualization of
comic character correlation diagrams for understanding
character relationships and personalities
Kanna MIYAGAWA, Yutaka MORINO and Mitsunori MATSUSHITA
Kansai University, Japan
2. Comic Sales in Japan
• Number of publications has
been increasing
• Comics in Japan have become
digital from papers
https://www.nippon.com/en/japan-data/h01292/
1/31
3. • The research targeting comics have been gathered in the name of
“Comic Computing”
• Not only from a single but some varied field of research,
techniques and knowledge should be introduced to compute comics
• The synergy among varied types of research is expected
beyond the fields of research
• The society for computing (or engineering) of comics
• In 2019, the society was officially organized as SIG in Japan
• Researchers in different fields (CV, NLP, AI, HCI, DB …) are gathered and
discussed with each other.
3
Special Interest Group on Comic Computing 2/31
4. Introduction
In Japan, new comics publication in a year has become over 10,000 titles.
• Too many choices may increase the psychological burden on the user
User needs a method to help choosing a comic
Let’s think about how people understand the comic’s contents
If you understand the comic’s contents before you read,
It helps you to choose your favorites when you buy.
3/31
5. What is the comic’s contents
Comic characters personalities that express internal characteristics
provide important clues to understand story lines
Story lines are part of the comic contents
What is the comic character relationship?
Ex. friend, lover, family
If the user understand characters' personalities and relationships,
it will contribute to understanding the contents of the comics.
Correlation diagram is a way to understand character relationships easily
Also, comic character relationships are important factor
4/31
6. Comic Character Correlation Diagrams
It shows the relationships between characters in a single picture
However, there are some problems in the recent diagrams
You can organize several relationships
through the correlation diagrams
5/31
7. Problems of correlation diagrams
- tends to become complex
- difficult to compare several comics relationships
- only shows relationships
If correlation diagrams present user character’s personalities and relationships,
the correlation diagram become more complex
Presenting character’s personalities and relationships at same time
are beneficial to understand comic contents
Many correlation diagrams have some problems
6/31
8. The ideal correlation diagram
To design the visualization system
that interactively present users comic character’s personalities and relationships
- Allowing user to pick up the relationships which you want to focus on
• User are be able to compare relationships appear in several comics
By comparing several works, you are be able to find favorite
• Comic character’s personalities also present with relationships
• Reducing correlation diagram complexity
Our purpose
7/31
9. System design
Our system should be satisfied with
・Confirm relationships or personalities when user select those
・Highlights the relationships to discover similar relationships
・Display several correlation diagrams to compare relationships
We built the relation network with reference to an information visualization reference model
8/31
10. The process to visualize
Extract the information of character’s personalities and relationships
Set characters to node, relationships to edge
Emphasizing the designated node and edge
Data transformation
Visual Mappings
View Transformations
Card, S. K., Mackinlay, J. D. and Shneiderman, B. (eds.): Readings in Information Visualization — Using Vision To Think —, Morgan Kaufmann Publishers (1999).
An information visualization reference model
proposed by Card
9/31
12. Data Extraction
Collect comic characters personalities and relationships
Relationship data
- Collected using Foaf
Personality data
- Collected using the ``MOE elements dictionary’’
Collected from Wikipedia
Wikipedia entries describe characters(ex. activities, explanation, appearance)
Assembled a dataset from 25 works at mangazenkan.com (popular comic store)
11/31
13. How to Extract Relationship in Comics
Various relationship types appear in a comic
Used RELATIONSHIP to perform relationship categorization
RELATIONSHIP
Expand Foaf(friend of a friend)
Foaf(friend of a friend)
A metadata type that explains a human relationship by connecting people through acquaintance relationships
Human Relationship have two kinds of type
Emotion : Feelings, such as “hate”, “like”
Role : Social position, such as “teacher”, ”student”
12/31
14. Two types of labels
Created relationship dictionary made from words with similar meanings to those labels
Would Like To Know Enemy Of
Friend Of Close Friend Of
Apprentice
To
Mentor Of
Colleague Of
Family
Antagonist Of
Created nine relationship labels by reference to RELATIONSHIP
Emotion
Role
How to Extract Relationship in Comics 13/31
15. Using relationship dictionary, extracted character relationships from Wikipeda
1.A sentence is divided into words using morphological analyzer
2.Analyzed Dependency analysis
Extracted clauses that have dependence and non-dependence
3.Extracted clauses that have proper noun and words in the relationship dictionary
would_like_to [‘for Futaba’, ‘send one’s love’]
colleague_of [‘Futaba’, ‘classmate’]
tsunami is coming
津波がきます → 津波 が き ます
proper noun words in the relationship dictionary
How to Extract Relationship in Comics 14/31
16. Extracted character personalities from Wikipedia
that matched the words in the ``MOE elements dictionary’’
The MOE elements
words in Anime culture that describe character appearance or personality
appearance personality
handsome kind
muscular playful
Extracted noun and adjective that matched the ``MOE elements dictionary’’
Character name
Takeshi Gouda
Personality
honest, clumsy, pure heart
How to Extract Personality of Characters 15/31
17. Visual mapping
Display characters as nodes and their relationship as edges
Prevent showing much information simultaneously to the user
Seeing information about the character's personality
Seeing information about the relationship between the characters
Hovering the mouse over a node or edge
character's personality character’s relationship
16/31
18. View transformation
Color Determination
Colored in blue and red for men and women
to let users know the characters' genders
Colored particular colors for each relationship type
ex. Displaying “Close Friend Of” orange
17/31
19. View transformation
Emphasize
Displaying main characters more extensively than other characters
-main characters, such as the hero or heroine
Using the checkbox
Emphasizing the relationship selected by the user
▲checkbox
18/31
20. View transformation
User are be able to
- compare the relationships
- understand the similarities and dissimilarities of relationships
Compare the correlation diagrams
Display maximum 4 networks in the same screen
Compare different comics relationships at once
19/31
21. User Study
Purpose of the experiment
Whether participants ware able to visually understand relationships,
including character personalities,
when using our proposed system?
Confirmation
- Asked questions to choose the specified relationships from several works
- Recorded whether users used this system, how users used this system
- Asked Open-ended questionnaire about our system
20/31
22. The comics used in the experiment
We used those comics
Touch
(By Mitsuru Adachi, SHOGAKUKAN)
Nisekoi
(By Naoshi Furumi, SHUEISHA)
What Did You Eat Yesterday?
(By Fumi Yoshinaga, Kodansha)
Card Capture Sakura
(By CLAMP, Kodansha)
Targeted romance comics that often feature romantic relationships
21/31
23. Points of attention about the system screen
・As they may have prior knowledge of these works that could affect their answers.
Presented the diagrams without naming the work to remove this factor
・Automatic character placement sometimes resulted in main characters being
placed at the edge of the screen.
As main characters are important story elements, we decided to manually
position these nodes at the center of screen.
Present the diagrams without naming the work Present main character at the center of screen
22/31
24. The system used in the experiment
The presented correlation diagrams for 4 works
23/31
25. Procedure of the experiment
Eleven participants were involved in the experiment
Checked whether the following operations were performed
-whether the operations they performed to select an item matched the asked relationship
before answering the question
-whether they confirmed the node and edge contents before answering the question
Flow of the experiment
1. Taught the participants how to operate the system
2. Presented them with correlation diagrams for four works
3. Answered five questions
24/31
26. Questions and measuring method
Five questions
1. Love triangle
2. Same gender love
3. One woman is favored by many men
4. Irritable character and positive character are rivals
5. Have hostility to the main character
How to measure the answer
Each question may have multiple answers
A perfect match:The participant selected all relationships correctly
A partial match :They selected some relationships correctly
Incorrect answers:The remaining option
25/31
27. Result of the questions
Result of questions
Perfect Match:74.5% Partial Match :18.2% Incorrect : 7.3%
1. Love triangle
2. Same gender love
3. One woman is favored by many men
4. Irritable character and positive character are rivals
5. Have hostility to the main character
Question1(Love triangle) was the least of the Perfect Match
26/31
28. The reason why "Love triangle" was the least at perfect match
Discussion of reasons for “Love triangle” was the least of the Perfect Match
- It was difficult to understand "love triangle" only present the diagram
It was necessary to present the index that shows user ”That is a love triangle”
27/31
29. Discussion
Open-ended questionnaire
-It is easy to check the relationship because each of the selected edges is emphasized.
-It is easy to organize the relationship because the relationship selected was emphasized.
Operation tendency
The experiment participants whose answer was the Perfect Match
- emphasized the edge to search for the requested relationship
- checked the contents of both the node and edge
Using the correlation diagram to check comic character relationships and personalities
helped the participants to find specific relationships
28/31
30. DiscussionーA problem with the system
”It is hard to check the edge because the edge crowd some of the node”
When one character has many relationships
it becomes difficult for user to see contents of edge.
Possible Solution
Displaying edges dynamically by volumes
reducing the number of edges and making it easier to understand the content
29/31
31. DiscussionーA problem with the system
“It was hard to compare the comic character personality”
As the character personality information does not have the emphasizing function,
such as the checkbox that emphasis similar relationships.
It is difficult for them to compare or find similar personalities.
Possible Solution
Giving visual clue to the nodes,
such as the color of presenting the principal personality trait for each character.
Who has the similar personality?
30/31
32. Conclusion
Result
Confirmed the utility of displaying the contents of character’s personalities and relationships
Results confirmed the utility of displaying the contents of character personalities and relationships with
emphasizing visualizations
Purpose
To design the visualization system
that interactively present user comic character’s personalities and relationships
Method
Built an interactive visualization system
that user are be able to discover the personalities and relationships
31/31
33. Extract relationships from Wikipedia
1. A sentence is divided into words using morphological analyzer
tsunami is coming
津波がきます → 津波_が_き_ます
2.Analyzed Dependency analysis
Analyzing the modification of clauses
dependence non-dependence
3.Extracted clauses that have proper noun and words in the relationship dictionary
Tarou
this
Jiro
“Tarou handed this book to Jiro”
→
→
→
handed to
book
handed to
would_like_to [‘for Futaba’, ‘send one’s love’]
colleague_of [‘Futaba’, ‘classmate’]
proper noun words in the relationship dictionary
Notes de l'éditeur
(司会の先生が紹介してくれたら始めます)
Thank you, Chair.
My name is Kanna Miyagawa.
Today, I will talk about an "Interactive visualization of comic character correlation diagrams for understanding character relationships and personalities".
First, I will briefly(ブリーフリィ)
explain "comic computing, " which is an emerging(エマージング) research topic in Japan.
さいしょに,日本で盛り上がりつつある研究トピックであるコミック工学について少し話すね.
Japanese comic so called Manga / is one of the most popular content / in Japan.
日本で漫画って,とっても人気なんだぜ
More than 10 thousand new comic titles / have been published / in a year.
年間1万冊以上の新刊が出るんだぜ.
It should be noted that / the medium for reading comic / has changed from paper to digital devices / in recent years.
Many titles have been digitized (でじたいずど)/ and distributed (でぃすとりびゅーてど)via the internet.
媒体が紙からデジタルになってきたんだぜ.
So, / we can easily access various contents, / from past masterpieces (マスターピーシーズ) to the latest releases. (レイテスト リリース)
だから,過去の名作から最新作までかんたんに読めるぜ.
They often offer free trials, / so we can read many titles.
This is happy for us, / but the excessive (えくせっしぶ) contents make it difficult / to find and overview content / that satisfies (サティスファイズ)our tastes.
それってハッピーだけど,莫大なコミックは検索とか概観を難しくするよね.
Despite digitizing content, the technology to handle (ハンドル) them / has yet to be fully (ふりー) developed.
デジタル化したけど,それらを扱う技術はまだ不十分んあんだ
---- 以下はメモだよ ーーーーー
コミック:
pictureとtextで構成される本: Comic is multimodal that configure pictures and text.
広い世代で楽しまれている: People of all ages enjoy reading comics
多彩なジャンルがある
コミックの概要と
先生
今日本で一年間にどれほど発刊されてるか
ポップカルチャーである
電子化されてる
無料化されて,過去の作品も読める
たくさんのコミックの活用が必要でl,そのためにコミック工学ができた
自然言処理
今日はコミック工学の一環の一つ.
Since comics are multimodal content / that consists of text and images,
not only from a single / but some varied fields of research, techniques and knowledge / should be introduced to compute comics.
コミックはテキストと画像で構成されたマルチモーダルなコンテンツだから,それを処理するにはいろんなちからがいるぜ
We call such research related to comics in computer sciences "comic computing."
僕らはこうした研究をコミック工学って呼んでる
To promote (ぷろもーと)such comic computing research, / we organized a Special Interest (いんたれすと) Group / on comic computing in 2019.
Researchers from various fields, / such as CV, NLP, AI, HCI, and DB(データベース), participate (ぱーてぃしぺいと) in the SIG.
They share datasets and tools, / exchange ideas, / and discuss the future of comics / from a technical perspective(パースペクティブ).
そんな研究を加速させるために色んな所から仲間が集ったぜ.
The content presented here is one of the results of such comic computing.
今回紹介するのはコミック工学の成果のひとつだよ.
1p イントロ〜現状の問題と問題解決に必要なこと
Since too many comics are published each year,
近頃,多くの作品が発刊されたので,
It takes more time to / find your favorite one.
ユーザの好みに適した作品を探すのに時間がかかる
So, developing a method to choose a comic / that matches your favorite / is necessary.
ユーザの好みに適したコミックを探す方法を提案する必要がある.
コミックコンテンツを知ることは,好みと一致する作品を探すことに有用である.
Knowing the comic content before you read, / it helps you to choose your favorite when you buy.
In this paper, we considered (こんしだーど) / how to make it easier for users / to understand the content of the comic.
ユーザがコミックコンテンツを理解できるか考える
2p コミックコンテンツとは
ストーリーラインとはコミックコンテンツの一部です.
Story lines are part of the comic contents.
ストーリーラインを知るためにはコミックキャラクタの性格やその関係性を知ることが重要です.
In order to understand story lines, / it is necessary to understand comic characters personalities and relationships.
そのキャラクタの関係性を効率的に知るのに相関図があります.
There are correlation diagram / to understand comic character’s relationships easily.
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
2p
Comic characters provide important clues to understand story lines
ストーリーラインはコミッくコンテンツの重要な一部です.
ストーリーラインを知るためにはキャラクタやその関係性を知ることが重要
です.
そのキャラクタの関係性を効率的に(簡単に)知るのに相関図があります.
3p相関図
キャラクタの人間関係を整理し,一枚の絵で見せます.
Correlation diagrams organize several relationships in a single picture.
だから,あなたは直感的にキャラクタの関係性がわかります.
You can understand the comic character’s relationships.
ただし,相関図を作るにあたり,注意しなければいけないことがある.
However, / there are important points when making correlation diagrams.
多くの相関図はその注意点をあまり考慮されていない.
Some correlation diagrams do not think about those points.
4p相関図の問題(コマンド/ say –v alex 単語 で発話を聞ける)
まず,多くのキャラクタが登場すると図が複雑になりやすいです.
First, / if there are many characters, / the correlation diagram tends to(テンどトゥ) become complex.
続いて,複数の異なるコミック作品の相関図を比べることができない.
Second, / it is not easy to compare multiple / diagram between other works.
そして,相関図からはキャラクタの情報がわからない.
Third, /the correlation diagram have less characteristic information / such as personalities.
キャラクタの個性と関係性を提示することがコミックコンテンツの理解に役立つであろうが,余計に図が複雑になりかねない.
As I said before, presenting character's personalities and relationships at same time are helpful to understand comic contents. /
But, if correlation diagrams get more information, it becomes more complex with we don’t want to you.
So, / we need to figure out how to present the both information with less complexity.
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
そして,相関図からはキャラクタの情報がわからない.
Third, /correlation diagrams do not show the comic character's information / such as personalities.
キャラクタの個性と関係性を提示することがコミックコンテンツの理解に役立つであろうが,余計に図が複雑になりかねない.
But, if correlation diagrams present the personalities and relationships,/ the correlation diagram become more complex.
5p 理想の相関図 (こんな方針で設計する)
我々が理想とする相関図にはこれから述べることができることが必要である.
We think / those things are necessary for the ideal correlation diagram.
コミックキャラクタの性格も関係性とともに知ることができる
One, Comic character's personalities also present with relationships
ユーザは複数のコミックの登場キャラクタの関係性を比べることができる.
One, User can compare character's relationships / with other several comics / which leads to your favorite comic by comparing several works.
図の複雑性を減らす
One, Reducing correlation diagram complexity.
ユーザが確認したい関係性を絞り込むことができる
Allowing user to pick up the relationships which you want to focus on.
我々は,これらのことを考慮して,漫画のキャラクタと関係性をインタラクティブに表現する可視化システムを設計する.
Considering(こんしでぇリング) those things, we design the visualization system /that interactively present the personalities and relationships
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
(いろんな作品を比べることで,ユーザのお気に入りの作品を探すことにつながるから.(理由いろんな作品を比べることでおきいにりを探すことにつながる))
(to find favorite one by comparing several works.)
6pシステムデザイン(だから,理想に従ってこういうことをします)
システムデザインとして,これらの設計を満たすべきだと考えられる.
For the system design /, those things should be satisfied.
ユーザが選択したキャラクタの個性や関係性の内容を確認できるようにする
User can confirm character's relationships or personalities when you select those.
類似する関係性をわかりやすくするため,強調表示機能を付与
Adding the function that highlights the relationships to discover similar relationships
他の作品の関係性を比較できるように,一つの画面に複数の相関図を表示
Display several correlation diagrams on the same(せぇむ) screen / to compare relationships that appear in different comics.
そこで我々は,cardの可視化手法を参考にネットワーク図を設計した
So, we built the network / with reference to an information ・ visualization ・ reference-model.
7p 可視化の過程. 全部さらっと説明する(のちにしっかり説明するので)
Cardの可視化手法には3つの段階があります
There are three processes in this model / proposed by Card.
データ集合の中から必要なデータを取り出して加工するData transformationでは,我々はキャラクタの性格と関係性の情報を抽出しました.
First, at Data transformation that extracting the necessary data from dataset /, we extracted the information of characters personalities and relationships.
Visual Mappingsでは,我々はキャラクタをネットワーク図のnodeに設定し,関係性をネットワーク図にedgeに設定しました.
Second, at Visual Mappings that deciding how draw the data table, we set comic characters to node and, relationships to edge of network.
View Transformationsでは,我々は,nodeやedgeに強調機能を付与しました.
Third, at View Transformations that emphasizng(enhancing) the visual effects by changing the parameter of visual mappings, we created the emphasizing function to node and edge.
8p システム画面(ユーザ they→you)
こちらが作成したシステム画面です
This is the system screen that we built.
キャラクタ名が表示するnodeにマウスカーソルを合わせると,そのキャラクタの性格要素を確認できます.
When you mouse over the node that display characters name, you can confirm the characters personality.
edgeにマウスカーソルを合わせると,キャラクタ間の関係性を確認できます.
When you mouse over the edge, you can confirm the relationship.
右に設置されているcheckboxを使うことで,edgeを強調表示することができます.
When you use the checkbox that set on the right of screen, you can emphasize the selected(せ れ テクっど) relationship.
---------------------------------------
(ピンクのedgeは好意をわらし,checkboxで選ぶと他のedgeよりも大きく表示されます.)
(Edge of those color is pink means “Would like to know”, you check the “Would like to know”, the pink edge bigger than others..)
9p データ抽出について
Wikipediaはコミックキャラクタの作品における活躍や特徴が記載されているため,Wikipediaからコミックキャラクタの性格や関係性を抽出する.
Japanese Wikipedia entries / describe comic character activities / and 半分くぎる feature(フィーチャー) /, so / we extracted / comic character personalities / and relationships / from these entries.
我々は,マンガ全巻ドットコムから25作品を対象にコミックキャラクタの性格と関係性のデータセットを作成した.
We assembled a dataset of the personalities and relationships / from 25 works at mangazenkan.com
関係性のデータはRELATIONSHIPを使って抽出し,コミックキャラクタの性格は萌え要素辞書を使って抽出した.
We extracted the relationships by using Foaf, personalities by using MOE elements dictionary .
10p 関係性データの収集方法
コミックには様々なライバル,親友など関係性が登場するので,foafを拡張したのがrelationshipを使って関係性を分類した.
There are various relationship types such as rival, close friend appears in a comic.
So, we performed relationship categorization(カテごらいゼーション) by using RELATIONSHIP that expand Foaf.
Foafとは,知人関係で結ばれた人間関係を説明するメタデータタイプである
Foaf is a metadata type that explains a human relationship by connecting people through acquaintance(アクぇィいんたんす)
relationships.
また,関係性は嫉妬などの感情に関する関係性と,教師などの社会的役割に関する関係性の2種類に分けることができるので,この2種類に分けた.
Relationship has two kind of type, emotion relationship such as hate, and role relationship such as teacher, so we divided by type.
11p 関係性ラベルと辞書の作成
我々は,relationshipを参考に感情に関するもの2つと役割に関するもの7つの関係性ラベルを作った.
We created by reference to RELATIONSHIP two labels about emotion and seven labels(レーベルス) about role.
感情ラベルは,相手に好意を示す「Would Like To Know」と相手に憎しみを示す「Enemy Of」です.
Emotion labels are "Would Like To Know" and "Enemy Of".
役割ラベルは,友人,親友,家族などです.
Role labels are "Friend of", "Close Friend Of", "Family", and so on.
そして,これらのラベルと類似する単語からなる関係性辞書を作った.
And then we created the relationship dictionary that composed the similar words to those labels.
12p関係性の抽出方法
関係性辞書を使ってWikipediaからキャラクタの関係性を抽出する
We extracted comic characters relationships by using the relationship dictionary.
初めに,Wikipediaの文章を分かち書きにした.
First, we divided Wikipedia sentences into words using morphological(もろフォロジカル) analyzer.
続いて,係り受け解析を行い,修飾する文と非修飾する文を抽出した.
Second, we analyzed dependency analysis(あならしす).
そして,人物名を示す固有名詞と,辞書と一致する単語を含む文を関係性として抽出した.
Third, we extracted clauses(クローズ) that have proper noun such as character's name and words in the dictionary.
----------------------------------------------
MecabやCabochaを知らない.
日本語は単語ごとに分かれていない.(分かち書きがわからない.)
1パートオブスピーチにします.
2南瓜で構文を明らかにする
3Foafのタイプを判断して割り当てる.
13p 性格要素の抽出
キャラクタの性格要素は「萌え要素辞書」を使ってWikipediaから抽出する.
We extracted comic character's personalities from Wikipedia by using "MOE elements dictionary".
萌え要素辞書とは,キャラクタの外見や性格を説明するアニメカルチャーにおける言葉です.
The MOE elements are words in Anime culture that describe character appearance or personality.
萌え要素辞書のキャラクタの性格を表す単語のみを使用しました.
We only used words of character personalities.
キャラクタ個性の抽出方法としては,まずWikipediaを分かち書きをした.
For extracting personalities, we leave space between words of Wikipedia’s text and extracted noun and adjective(アジェクティブ).
次に,萌え要素辞書と一致する名詞と形容詞を抽出した.
Then, we extracted words that matched "MOE elements dictionary" from extracted noun and adjective.
14p 抽出したデータをどう可視化したか
抽出したデータを,それぞれネットワーク図のnodeにキャラクタを,edgeにキャラクタの関係性を表示する.
We display characters as nodes and their relationships as edge on the network / by using extracted data.
ノードやエッジにカーソルを合わせることで,性格や関係性を確認できます.
When user hover the mouse over node or edge, you can see the personalities or relationships.
ユーザが選択した情報のみを提示することで,ユーザーに多くの情報を同時に表示しない
We prevent showing much information simultaneously(サイマルテーにあすりぃ) to user / by displaying(ディスぷれぃイング) the selected information.
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
ノードにマウスカーソルを合わせることで,ユーザはキャラクタの個性を確認できる.
When user hover the mouse over node, you can see information about the personality.
エッジにマウスカーソルを合わせることで,ユーザはキャラクタ間の関係性を確認できる.
When user hover the mouse over edge, you can see information about the relationship between the characters.
15p 色の策定
視覚効果として,色の策定を行った.
We determinate color formulation(フォーみネーション) of node and edge for visual effects.
ノードは,キャラクタの性別がわかるように,男性を青,女性を赤色で表示しました.
In node, we colored in blue and red for men and women(ウィメン) to let users know the characters genders.
エッジは,関係性ラベルごとに特定の色を決めました.例えば,親友ラベルはオレンジで表示します.
In edge, we colored particular colors for each relationship type.
例えば,親友ラベルはオレンジで表示します.
For example, the label of "Close Friend Of" display orange.
16p 重要キャラクタやedgeの強調表示
強調表示機能について,nodeでは主人公やヒロインなどのメインキャラクタを他のキャラクタよりも大きく表示します.
As for emphasizing, in the node, displays main characters, such as the hero or heroine / more extensively than other characters.
edgeでは,ユーザがcheckboxの関係性ラベルを選択すると,選択したラベルと同じ関係性のedgeが大きく表示されます.
In edge, when user select the relationship label in the checkbox the edge that is match selected label is displayed(ディスプレイッド) bigger than others.
17p 関係性の見比べ
また,我々は複数の異なる作品のキャラクタ関係性を見比べできるようにした.
We also make it possible to compare the correlation diagrams that appear in different comics.
一つの画面に4つのネットワーク図を表示し,これによりユーザは一度に複数のキャラクタの関係性を比較できます.
Displaying four networks in the same screen, user can compare several relationships at once.
また,キャラクタの関係性の類似性や非類似性を見比べることができる
Also, they can understand the similarities and dissimilarities of characters relationships. (ゆっくりで)
18p 実験
我々は,ユーザが提案システムを使用したとき,キャラクタの性格を含めて関係性を視覚的に理解できるか検証するため,ユーザ実験を行った.
We conducted a user experiment / to verify(ベリィファイ)/ whether participants ability to visually understand relationships, including character personalities, when using our proposed system.
複数の作品の中から特定の関係性が登場する作品を選択する質問を尋ねた.
First, we asked questions to choose the specific relationships from several works.
質問回答前にシステムを触ったか,どのようにシステムを使ったか記録し,
Second, recorded whether participants used system before answering questions, and how they used system.
最後にシステムの自由回答を求めた.
And finally, asked Open-ended questionnaire about our system.
19p 使用した作品(実験材料)
作品
“Nisekoi”(By Naoshi Furumi, SHUEISHA), “Touch”(By Mitsuru Adachi, SHOGAKUKAN), “What Did You Eat Yesterday?”(By Fumi Yoshinaga, Kodansha), and “Card Capture Sakura”(By CLAMP, Kodansha) for correlation diagram generation.
実験ではこれらの作品を使った.
In the experiment, We used those comics
我々は,人間関係が顕著に登場する恋愛漫画に焦点を当てた.
We targeted romance comics that often feature(フィーチャー) romantic relationships.
20p システム画面の留意点
実験時に提示したシステム画面の留意点について説明する.
We describe the points of attention about the experimental system screen.
ユーザがこれらの作品の事前知識を持っていると,回答に影響を与える可能性がある.
As participants may have prior knowledge of these works, it could affect their answers.
その要因を省くために作品名とキャラクタ名を伏せて提示した.
So, we presented the diagrams without naming the work to remove this factor.
自動でキャラクタを配置すると,主要キャラクタが画面の端っこに提示される時があります
When comic characters were automatic placement, it sometimes resulted in main characters being placed at the edge of the screen.
主要キャラクタは物語において重要なキャラクタですので,手動で主要キャラクタを画面中央に配置しました.
As main characters are important story elements, we decided to manually position these nodes at the center of screen.
21p 実験時のシステム画面
こちらが,実験時に提示した画面です.
This is the screen that presented during the experiment
22p 実験の流れ
合計11人が実験に参加しました.
There were a total 11 people were involved in the experiment.
はじめに,実験参加者にシステムの操作方法を教えました.
First, we taught the participants how to operate the system.
次に,4作品の相関図を提示しました.
Second, we presented them with correlation diagrams for four works.
そして,5つの質問を尋ねました.
And then, we asked them five questions.
参加者がどうこのシステムを利用したか記録し,以下の操作が行われたかどうか確認した.
We recorded how the participants used this system and checked whether the following operations were performed.
参加者は,質問に答える前に,質問内容の関係と一致するラベルをcheckboxから選択できたか,また,ノードやエッジの表示内容を確認したか.
We checked whether participants selected a relationship label that matched the asked relationship /and confirmed the node and edge contents / before they answered questions.
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
参加者は,質問に答える前に,質問内容の関係と一致するラベルをcheckboxから選択できたか.
We checked whether participants selected a relationship label that matched the asked relationship before they answered questions.
参加者は,質問に答える前に,ノードやエッジの表示内容を確認したか.
We checked whether they confirmed the node and edge contents / before answering the question.
23p 被験者に投げた質問
提示した5つの質問は,一つ目は三角関係を含む作品を選択すること
The presented five questions, one to choose the work that had "Love triangle".
二つ目は,同性恋愛が登場する作品を選択すること
tow, to choose the work that had "Same(せぇむ) gender love".
三つ目は.一人の女性が複数の男性から恋愛感情を向けられている関係性を含む作品を選択すること
Three, to choose the work that had "One woman is favored by many men".
四つ目は,短気な性格のキャラクタとポジティブな性格のキャラクタがライバル関係である作品を選択すること
Four, to choose the work that had "Irritable character and positive character are rivals".
五つ目は,主人公に対して敵対している関係性を含む作品を選択すること
Five, to choose the work that had "Have hostility to the main character".
回答の測定方法に関しては,各質問には複数の正解がある場合があるので,答えを3つに分けました
Regarding how to measure the answer, each question may have multiple answers, we sorted(そーテッド) three.
完全正統は,全ての関係性を正しく選択できた回答です.
A perfect match is the answer that selected all relationships correctly.
部分一致は,一部の関係性を正しく選択できた回答です.
A partial match is the answer that selected some relationships correctly.
誤りは,不正解です.
Incorrect answers is the remaining ⦅リメイニング⦆option⦅オプション⦆.
24p 質問の回答の結果
それぞれの質問の回答結果は,完全正当が74.5%,部分一致が18.2%,誤りが7.3でした.
Each percentage of answers, perfect match was 74.5%, partial match was 18.2%, incorrect was 7.3%.
質問1の”三角関係”が最も完全正当が低かったです.
The first question about "love triangle" was the least at perfect match.
25p パーフェクトマッチが低かった理由として考えられること
三角関係の完全正当率が低かった理由について考えた.
We discussed reasons for "Love triangle" was the least at perfect match.
考えられる理由として,図だけでは三角関係と認識することが難しい.
As a possible reason, it was difficult to understand "love triangle" only present the diagram.
「これは三角関係」という指標が必要だった.
It was necessary to present the index that shows user ”That is a love triangle” .
26p 回答と考察〜良かったこと (もう少し軽くする.)
自由記述から,「選択された各エッジが強調されるため、関係性を確認しやすくなっています。」と,「選択した関係が強調されているため、関係が整理しやすい。」という意見が得られました.
Form Open-ended questionnaire, we got opinions that “It is easy to check the relationship because each of the selected edges is emphasized.”,.
操作傾向からは,完全正当した参加者は,エッジ を強調してから尋ねられた関係性を選択することや,エッジやノードの内容を確認することがわかった.
From the operation tendency(テンデンシー), we confirmed they emphasized the edge to search for the requested relationship and checked the contents of both the node and edge.
以上のことから,キャラクタの関係性や性格を確認できる相関図は,特定の関係性を探すことに役立つことがわかった.
According to these results, we can see that using the correlation diagram to check comic character relationships and personalities / helped the participants to find specific relationships.
27p 問題点とその解決
また,システムにはいくつかの問題があることもわかった.
Also, we found the problems about our system.
自由意見から,「エッジがノードの一部を覆うため、エッジの確認が難しい」ことがわかった.
From Open-ended questionnaire, we found ”It is hard to check the edge because the edge crowd some of the node”.
一つのキャラクタがたくさん関係性を持つ場合,ノードにエッジが密集してわかりにくい.
When one character has many relationships it becomes difficult for user to see the contents of edge.
解決案として,関係性のエッジを時系列やコミックの巻数ごとに動的に表示します.
The possible solution is displaying edge dynamically(ダイナミカリー) by volumes.
これにより,表示するエッジの数を減らし,内容を確認しやすくする.
It makes displaying edge reduce, and easy to confirm the contents.
28p 問題点とその解決
もう一つは,「コミックキャラクタの性格を比較するのが難しかった.」
One more, it was hard to compare the comic character personalities.
ノードにはチェックボックスのような,強調して内容を比較する機能がなかった.
There are not function such as checkbox / that emphasis to compare contents similarity.
キャラクタの性格を比較したり,似た性格を探すことが難しくなった.
So, it was hard to compare the personalities and find out a similar personality.
解決案として,ノードにも,キャラクタの主な性格を示す色を表示するなどの.視覚的な手がかりを与えることが考えられる.
The possible solution is giving function the visual clue / such like the color of presenting the principal personality trait for each character.
29p まとめ
何を目的として,何を作って,どんな結果が出た.(future workはいらない)
Objective (Purpose)
漫画の内容理解に重要なキャラクタの関係性と個性を相関図から確認できるようになること
To easily confirm the comic character’s relationship and personality those are important to understanding the comic contents
そのため,複雑なキャラクターの関係性と性格を表示するキャラクター相関図のための対話型可視化システムを作った(マンガの登場人物の性格や関係性をユーザが発見するための対話型可視化システムを構築した。)
ユーザ実験により,キャラクター間の関係性を判断するために、関係性とキャラクターの性格の両方を確認できるシステムの有用性を検証した
結果からは,キャラクターの性格や関係性の内容を強調したビジュアルで表示することの有用性が確認された。
The experimental results confirmed the utility of displaying the contents of character personalities and relationships with emphasizing visualizations.
Wikipediaからの関係性の抽出に関して補足
What is the analyzed Dependency?
文節間(clause)の修飾(modification)を分析すること.
Analyzing the modification of clause
初めに,Wikipediaの文章を分かち書きにした.
First, we divided Wikipedia sentences into words using morphological analyzer(もろフォじかるアナライザー).
続いて,係り受け解析を行い,修飾する文と非修飾する文を抽出した.
Second, we analyzed dependency analysis.
そして,人物名を示す固有名詞と,辞書と一致する単語を含む文を関係性として抽出した.
Third, we extracted clauses(クローズ) that have proper noun such as character's name and words in the dictionary.