TOPコラム海外最新IT事情プログラマーがソースコード内に書いた「アスキーアート」図2000点以上を収集　使われ方を分析しデータベース化【研究紹介】

プログラマーがソースコード内に書いた「アスキーアート」図2000点以上を収集　使われ方を分析しデータベース化【研究紹介】

2024年4月30日

先端テクノロジーの研究を論文ベースで記事にするWebメディア「Seamless/シームレス」を運営。最新の研究情報をX（@shiropen2）にて更新中。

米カリフォルニア大学サンディエゴ校に所属する研究者らが発表した論文「Taking ASCII Drawings Seriously: How Programmers Diagram Code」は、ソースコード内で使用するアスキーアート（ASCII art）を収集し分析した研究報告である。

keyboard_arrow_down 研究背景
keyboard_arrow_down 研究内容

研究背景

オープンソースのソフトウェア開発では、プログラマーがコードの中にアスキーアートを使って図を描き、アイデアを視覚的に表現することがよくある。アスキーアートはコードや自然言語では表現しにくい概念を視覚的に明快に説明でき、またコードよりも詳細度は低いものの、コードを理解するうえで「サムネイル」のような役割を果たす。

こうしたアスキーアートは、実際のソフトウェア開発の現場で使われているにもかかわらず、これまであまり研究されてこなかった。研究者らは、LinuxカーネルやChromiumブラウザ、LLVMコンパイラ、TensorFlowといった大規模プロジェクトから、合計2,156点のアスキーアートを収集した。また、アスキーアートの作者9人に、詳細なインタビューを行った。

研究内容

インタビューの結果、ソフトウェア開発のライフサイクルにおいてアスキーアートの持つ役割が5つ挙げられた。（1）ホワイトボードでのスケッチなど、外部の知識をコードに反映するため。（2）テストするシナリオを図で説明するため。（3）コードレビューにおいて変更内容を同僚に伝えるため。（4）他者がコードを理解しやすくするための文書化として。（5）数ヶ月後の自分自身がコードを思い出すための備忘録として。

インタビューを通して、アスキーアートがソフトウェア開発の様々な場面で活用されていることが分かった。バグの発見、知識の共有、コードの理解など、プログラミングという知的活動において、視覚表現が重要な役割を果たしている。

アスキーアートの内容自体も多様だった。研究チームは504点の図を精査し、図が何を、どのように表現しているかを分類した。その結果、コードとどのように関連しているのかを分類する、7つの次元からなる設計空間を導き出した。

1.Concepts（概念）：アスキーアートが表現している技術的なアイデア（データ構造、アルゴリズム、ハードウェア、情報の流れなど25種類）
2.Visual Encodings（視覚的エンコーディング）：図解が使っている基本的な視覚パターン（有向グラフ、線形シーケンスなど12種類）
3.Annotations（アノテーション）：本体の図解に矢印などで明示的に接続されたラベル（4種類）
4.Abstractions（抽象化）：省略記号などを使った情報の省略（4種類）
5.Subdiagrams（サブダイアグラム）：複数の図解を使った表現（3種類）
6.Scope（スコープ）：図解がファイルのどの範囲に対応しているかを示した表現（6種類）
7.References（参照）：図解がコード中の識別子、定数、式を参照しているかを示した表現（3種類）

これら収集したアスキーアートを7つの次元に分けたデータセットは、こちらのウェブページにまとめられている。

▲TensorFlowにおいてGPU上での効率化のために、計算グラフ上の操作をまとめる際の変化を表現した図

▲Chromiumのテストケースでグラフのトラバースができるかどうかをチェックするための図

▲Linuxカーネルのメモリ管理サブシステムにおけるディスク読み取りエラー処理を示す図

▲3つのネームスペースを、オーバーレイネットワークとアンダーレイネットワークを使って接続するネットワーク構成を、アスキーアートで視覚的にわかりやすく表現した図

Source and Image Credits: Devamardeep Hayatpur, Brian Hempel, Kathy Chen, William Duan, Philip J. Guo, Haijun Xia. Taking ASCII Drawings Seriously: How Programmers Diagram Code.

OSS