-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathresearch.html
218 lines (181 loc) · 8.41 KB
/
research.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
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>YukiMaeda — Mypage</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Free HTML5 Website Template by freehtml5.co" />
<meta name="keywords" content="free website templates, free html5, free template, free bootstrap, free website template, html5, css3, mobile first, responsive" />
<meta name="author" content="freehtml5.co" />
<!--
//////////////////////////////////////////////////////
FREE HTML5 TEMPLATE
DESIGNED & DEVELOPED by FreeHTML5.co
Website: http://freehtml5.co/
Email: [email protected]
Twitter: http://twitter.com/fh5co
Facebook: https://www.facebook.com/fh5co
//////////////////////////////////////////////////////
-->
<!-- Facebook and Twitter integration -->
<meta property="og:title" content=""/>
<meta property="og:image" content=""/>
<meta property="og:url" content=""/>
<meta property="og:site_name" content=""/>
<meta property="og:description" content=""/>
<meta name="twitter:title" content="" />
<meta name="twitter:image" content="" />
<meta name="twitter:url" content="" />
<meta name="twitter:card" content="" />
<link href="https://fonts.googleapis.com/css?family=Libre+Franklin:300,400" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Old+Standard+TT:400,400i" rel="stylesheet">
<!-- Animate.css -->
<link rel="stylesheet" href="css/animate.css">
<!-- Icomoon Icon Fonts-->
<link rel="stylesheet" href="css/icomoon.css">
<!-- Bootstrap -->
<link rel="stylesheet" href="css/bootstrap.css">
<!-- Flexslider -->
<link rel="stylesheet" href="css/flexslider.css">
<!-- Theme style -->
<link rel="stylesheet" href="css/style.css">
<!-- Modernizr JS -->
<script src="js/modernizr-2.6.2.min.js"></script>
<link rel="stylesheet" href="css/iframe.css">
<!-- FOR IE9 below -->
<!--[if lt IE 9]>
<script src="js/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="fh5co-loader"></div>
<div id="page">
<nav class="fh5co-nav" role="navigation">
<div class="container">
<div class="top-menu">
<div class="row">
<div class="col-sm-2">
<div id="fh5co-logo"><a href="index.html">Yuki Maeda</a></div>
</div>
<div class="col-sm-10 text-right menu-1">
<ul>
<li><a href="index.html">Profile</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li class="active"><a href="research.html">Research</a></li>
<li><a href="blog.html">Tech Blog</a></li>
</ul>
</div>
</div>
</div>
</div>
</nav>
<div class="container">
<div id="fh5co-intro">
<div class="row animate-box">
<div class="col-md-8 col-md-offset-2 col-md-pull-2">
<h2>過去の研究</h2>
</div>
</div>
</div>
<div id="fh5co-portfolio">
<div class="row">
<h2>Meta Quest2ハンドトラッキングとMIDIデータを用いたピアノ演奏用モーションキャプチャ(2022年4月~2023年3月)</h2>
<div class="video-container">
<iframe src="https://www.youtube.com/embed/gPW5ZeQv0Yo?autoplay=1&mute=1" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
<br><br>
<h3>概要：</h3> <p><font size="4"> </font></p>
<p><font size="4">
岐阜大学在籍時に、<a href="http://www.kzm.info.gifu-u.ac.jp/" target="_blank">木島研究室</a>にて、ピアニストの演奏を仮想空間でリアルタイムに高精度で再現するためのモーションキャプチャシステムを開発した。
このシステムでは、ハンドモーションキャプチャカメラ(Meta Quest2)を使用してリアルタイムでハンドモデルを生成する。
次に、ピアノの演奏データを仮想世界に反映するためにMIDIを使用し、それと同時に打鍵した指の特定を行う。
その特定した指先が鍵盤に触れるように先ほどのハンドモデルを調整することで、ピアニストの演奏表現をより伝わるようにした。
</font></p>
<br><br>
<h3>背景・モチベーション：</h3>
<p><font size="4">
メタバースの普及に伴い、Vtuberが楽器を演奏するコンテンツや仮想空間内での生演奏ライブが増加している。このようなライブ、コンサートを鑑賞する際には音・体の動きが注視される一方で、メタバースコンテンツの多くは楽器を演奏している手元まで正しく再現できていないものが多い。
これを踏まえて、仮想空間内で簡易かつ精度高くピアノ演奏を再現することによって、ピアニストやVtuberが仮想空間内で楽器を演奏する際の参入障壁を低減することが目的だ
</font></p>
<br><br>
<h3>アピールポイント：</h3>
<p><font size="4">
1,仮想空間と現実空間の座標のズレを誰でも簡単に修正できるようにした。
</font></p>
<p><font size="4">
Meta Quest2に付属するコントローラーをピアノの四隅に押し当て計測することで誰でもズレを治せるようにした。計測点から現実世界のピアノの正規直交基底を導き出し、それを基に仮想世界のピアノを適切な位置に移動させる。このプロセスにより、2ミリメートル以内の精密な位置合わせを実現した。
</font></p>
<p><font size="4">
2,演奏時の手の動きの隠蔽問題を改善した。（下図参照）
</font></p>
<p><font size="4">
演奏時、手の動きがカメラから見えなくなると、手の再現精度が著しく低下する。この問題を改善するため、押された鍵盤と指の対応表を作成し2ミリ秒ごとに更新した。この対応表を基に、対応する指が鍵盤に触れるようにハンドモデルの修正を行うことで、精度の向上を図った。
</font></p>
<img src="images/modify.png" alt="画像の説明" width="800" height="300">
<br><br>
<h3>システム構成：</h3>
<p><font size="4">
実験環境
</font></p>
<img src="images/png1.png" alt="画像の説明" width="700" height="300">
<p><font size="4">
ハードウェア構成
</font></p>
<img src="images/hardware.png" alt="画像の説明" width="800" height="350">
<p><font size="4">
ソフトウェア構成
</font></p>
<img src="images/software.png" alt="画像の説明" width="800" height="350">
<h3>開発言語・技術：</h3> <p><font size="4">
</font>Unity, C#, 最小二乗法, Meta Quest 2</p>
<br><br>
<h3>キーワード：</h3>
<ul>
<li>ピアノを弾く人の動きをVRで再現する</li>
<li>メタバースで音楽を楽しむ人や表現する人のためのシステム</li>
<li>Vtuberが楽器を弾くときにも使えるシステム</li>
</ul>
</div>
</div>
</div><!-- END container-wrap -->
<div class="container">
<footer id="fh5co-footer" role="contentinfo">
<div class="row">
<div class="col-md-3">
<h4>Contact Information</h4>
<ul class="fh5co-footer-links">
<li><a href="mailto:[email protected]">[email protected]</a></li>
</ul>
</div>
</div>
<div class="row copyright">
<div class="col-md-12 text-center">
<p>
<small class="block">© 2016 Free HTML5. All Rights Reserved.</small>
<small class="block">Designed by <a href="http://freehtml5.co/" target="_blank">FreeHTML5.co</a> Demo Images: <a href="http://unsplash.co/" target="_blank">Unsplash</a></small>
</p>
</div>
</div>
</footer>
</div><!-- END container -->
</div>
<div class="gototop js-top">
<a href="#" class="js-gotop"><i class="icon-arrow-up2"></i></a>
</div>
<!-- jQuery -->
<script src="js/jquery.min.js"></script>
<!-- jQuery Easing -->
<script src="js/jquery.easing.1.3.js"></script>
<!-- Bootstrap -->
<script src="js/bootstrap.min.js"></script>
<!-- Waypoints -->
<script src="js/jquery.waypoints.min.js"></script>
<!-- Flexslider -->
<script src="js/jquery.flexslider-min.js"></script>
<!-- Sticky Kit -->
<script src="js/sticky-kit.min.js"></script>
<!-- Main -->
<script src="js/main.js"></script>
</body>
</html>