新型コロナウイルスに関係する内容の可能性がある記事です。
新型コロナウイルス感染症については、必ず1次情報として 厚生労働省 首相官邸 のウェブサイトなど公的機関で発表されている発生状況やQ&A、相談窓口の情報もご確認ください。※非常時のため、すべての関連記事に本注意書きを一時的に出しています。
見出し画像

『見てわかる 感染シミュレーション』の制作メモ

はじめに

画像14

『見てわかる 感染シミュレーション』というサイトを作成しました。

感染症がどのように広がるかをリアルタイムにシミュレーションで見ることができます。スペースや行動制限などのパラメータを変化させることで、感染の広がりを変化させることができます。

このサイトはSIRモデルという古典的な感染症の数理モデルをベースにシミュレーションを行っています。数理モデルを理解するには方程式や変数など様々な数学的な知識が必要になります。

このサイトでは数学の知識を必要としません。3つのルールを頭の片隅に入れておけば、大丈夫なものにしています。

制作メモをnoteにまとめました。


きっかけ

新型コロナウィルス感染の拡大を防ぐため、「人と人の接触機会を8割削減する」ことが必要であるという呼びかけが厚生労働省からありました。厚生労働省のクラスター対策班に所属する北海道大学の西浦博教授らが感染症の数理モデルによるシミュレーションに基づいて、8割削減を算出しました。

感染症の数理モデルという言葉を初めて聞きました。

数理モデルという言葉は経済や金融で未来を予測するために使っているのを聞いたことがあり、以前『その問題、数理モデルが解決します』という本を読んだこともありました。

感染症の広がりを数理モデルを用いてどう予測したり、どう分析するんだろうかと興味を持ちました。

ワシントンポストでコロナウィルスの感染についてのリアルタイムシミュレーションがあり、わかりやすくて面白いなと思いました。

画像1

https://www.washingtonpost.com/graphics/2020/world/corona-simulator/

感染症の数理モデル理解すれば自分も同じようなもの作れるだろうなと思いました。


インプット

『感染症 数理モデル 書籍』と『感染症 数理モデル 論文』という単語でググることからはじめました。

稲葉教授や西浦教授の論文や記事が出てくるので、それらを中心に読みました。

読んだ資料や論文は以下のものです。

感染症の数理

感染症流行の予測:感染症数理モデルにおける定量的課題

微分方程式と感染症数理疫学

感染症の数理モデルで教科書とされている本が中古でしか存在せず、異常な高値になってたことでした。10万円ちかくもするので、諦めました。アカデミックな教科書はいつでもどこでも読めるように電子版を希望します。

英語で初級者向けにいい感じにまとまってそうな本があったので、そちらを購入しました。

論文や教科書を読むことで、感染症をどう捉えるのか、そのためにどういう数理モデルがあるのかということを学びました。

最初のステップとして感染症の数理モデルで最も古典なモデルとされるSIRモデルをリアルタイムにシミュレーションできないかと検討を開始しました。


構成

SIRモデルは全人口を以下の3つの状態に分けて考えます。

感受性保持者(Susceptible)
感染者(Infected)
免疫保持者(Recovered、あるいは隔離者 Removed)

wikiのページであるように状態の関係は微分方程式で表されます。

ここで定義されてることを数式を使わずシンプルなグラフィックでルールという形ができないかと考えました。

SIRモデルでの理解は3つでした。

1. 感受性保持者、感染者、免疫保持者の3種類の状態しか持ちえない。

2. 感染者からの接触で感受性保持者は感染する。

3. 感染者は一定の時間すぎると免疫保持者になる。

そこで3つの状態しか持たない人間のようなものが3つのルールのもとで動くシミュレーションを作ろうと考えいました。3つのステップで徐々に複雑にできれば、嬉しいなという感じで構成を考えました。


人間のモデリング

リアルタイムにシミュレーションをする上でどういう人間モデルを作るのかからスタートしました。

シミュレーションの人となる人間を落書きしました。我ながら絵は下手ですね。

画像6

男女の区別なく、抽象的なものがいいという路線で決定しました。

早速Blenderで3Dモデリングしていきました。

画像3

画像4

パフォーマンスやロード時間を考え、状態の変化をテクスチャーじゃなく、シェーダーでやることにしました。そのため、ローポリゴンで色は1色で人間とわかるようにしないといけませんでした。

宙に浮く、シンプルな球体ベースで作られた人間モデルにしました。手がないバージョンとあるバージョンを試作で試しました。

手があるバージョンだと情報量が多く、ワチャワチャすることがわかり、手がないバージョンを使用することにしました。

色は感受性者を青、感染者を赤、免疫保持者をオレンジに、わかりやすく認識できるようにしました。

画像6


プロトタイプ開発

リアルタイムのシミュレーションということでthree.jsというライブラリを使用しています。

画像5

​400個の人間モデルを配置し、1つだけ感染者を配置してどのように広がるかを見ることができます。

人間モデルはランダムに動いたり、静止したりします。接触すると通過するのではなく、反射して離れる衝突のアルゴリズムを作成しました。

プロトタイプを作っていき、徐々に複雑にするため、以下の3つのステップを導入しました。

ステップ1では全員動き、部屋の大きさだけ変化させることができます。

ステップ2では感染後、隔離する割合を変化させることができます。

ステップ3では動かない人間モデルの割合を変化させることができます。

ステップが増えるごとにスライダーを追加していきます。


全体の流れ

全体の流れを整理するためにfigmaでデザインをしました。

figmaはオンライン上で作成・共有ができます。無料枠も十分にあるので便利です。

ページ構成は概要ページ、ルールページ、シミュレーションページの3つに分割しました。

概要ページはページの説明と、背景に関係のあるビジュアルをつけることにしました。全体の流れを整理しているときはまだ白紙でした。

画像9


ルールページでは構成で述べた3つのルールを簡単なグラフィックを使って説明しています。

画像7


シミュレーションページではどういうところにどういうパーツを配置するのか整理しました。

画像8


1人で自由研究として全部やるので、デザインは頭の整理程度で終了して、開発に移りました。


開発

開発で使用したソースコードはGitHubに公開しています。

https://github.com/kenjiSpecial/infection-simulation

プロトタイプを拡張し、開発を行いました。

プロタイプからの変更は人間モデルの色を変えたのと、スペースを立体にしました。

人間モデルがベタ塗りだと頭が重なり見えにくくなるので、ライティング設定して立体感がでるようにしました。

トップページのレイアウトは1人だけ感染者がいるビジュアルを配置しました。

画像13

スライダーを動かすと、リアルタイムにシミュレーションが変化します。

画像10


再生・停止ボタンやリセットボタンでシミュレーションをコントロールできます。

画像11


シミュレーション終了後のグラフ上でマウスを動かすと過去のデータや人間モデルの配置を見ることができます。

画像12


まとめ

感染症の数理モデルって何だというところから始めて、学んだことを形にしていきました。

GW前からインプット、構想、デザインをし、GWで開発しました。

1人で全部やるのは自分主導で作りながら考えれ、全部できるので本当に楽しい時間でした。と言いつつ、開発の終盤では「面倒だー楽な方法ないかなー」と1日100回ぐらい思いながらやってました。


今後に向けて

新型コロナウィルスに関する論文やデータ分析に関する記事など多く出ています。価値ある記事でまだあまり知られてないものを専門的な用語を使わずビジュアルやグラフィクで説明できないかと思っています。

この記事が気に入ったら、サポートをしてみませんか?
気軽にクリエイターの支援と、記事のオススメができます!
嬉しいです!
6
WebGL を書いたり、フロントエンド開発などの仕事をしています。 趣味で3Dモデルを作ったり、機械学習や量子コンピュータを勉強してます。 専門的なことをインタラクティブなビジュアルで説明することに関心があります。 https://www.kenji-special.info/
コメントを投稿するには、 ログイン または 会員登録 をする必要があります。