UTokyo Digital Archive Portal Apps

UTokyo Digital Archive Portal Apps

東京大学デジタルアーカイブポータルが提供するAPIを活用した可視化・IIIF・3D・AR・WebGLのデモ集です。

解説動画

全16デモの使い方をナレーションで案内します。章ごとの解説や掛け合い版は チュートリアルページ をご覧ください。

お知らせ

可視化

アーカイブズ資料を切り口にした静的可視化のデモ。

🧩 IIIF Puzzle

パズル (IIIF)

IIIF Image API を使って、東大所蔵資料3点をジグソーパズルとして遊べるデモ。

IIIF Game
📜 Timeline

東京大学の名称 (年表)

開成学校から現在の東京大学まで、5期にわたる名称の変遷を年表で表示します。

Timeline Static
☁️ Word Cloud

Word Cloud

D3.js でワードクラウドを描画するサンプル。

D3.js
🎨 Image Transitions

Image Transitions

D3 + Primitive を用い、デジタルアーカイブ画像をプリミティブ図形へ徐々に変換するアニメーション。

D3.js IIIF

IIIF コレクション

アーカイブズの資料を IIIF として再構成したコレクション/マニフェストとその閲覧例。

IIIF

IIIF Collection

部局ごとの IIIF Collection を集約した IIIF Collection JSON。

IIIF Collection
IIIF Attribution

Attributions from IIIF Collection

IIIF Collection に含まれる各部局の Attribution を一覧表示。

IIIF Metadata
Javala

Javala (IIIF Viewer)

IIIF Collection を Javala で閲覧するサンプル。

IIIF Viewer
🌾 Agriculture

農学部 鳥瞰図 (Annotation)

「東京帝國大學本部構内及農學部建物鳥瞰圖」に IIIF Presentation 3 + Web Annotation で 58 件のマーカーを付与。

IIIF v3 Annotation
🧱 Mosaic

IIIF Mosaic

複数の画像をモザイク状に並べて1つの IIIF Manifest に統合した例。

IIIF Manifest
🪨 石本コレクション

石本コレクション分析例

石本コレクションのメタデータを SPARQL(Dydra) で集計・可視化したサンプル。

SPARQL Dydra

3D / VR / AR / WebGL

three.js、A-Frame、Unity WebGL などを用いたインタラクティブなデモ。

🖼️ three.js IIIF

three.js × IIIF (VR Gallery)

three.js Pointerlock controls で IIIF 画像をギャラリー空間に配置。

three.js VR IIIF
🏛️ Gallery

3D Gallery

three.js を使った 3D 美術館ギャラリーのサンプル。

three.js 3D
📱 AR

AR (A-Frame + AR.js)

Hiroマーカーを使った AR デモ。カメラ付きの端末でアクセスしてください。

A-Frame AR.js
🧱 Breakout

Breakout (Unity WebGL)

アーカイブ画像をブロックに敷き詰めたブロック崩し風ゲーム。

Unity WebGL
🏃 Obstacle Run

Obstacle Run (Unity WebGL)

アーカイブ画像を背景に走り抜けるアクションゲーム。

Unity WebGL
⚽ Roll a Ball

Roll a Ball (Unity WebGL)

アーカイブ画像のフィールドを転がるボールゲーム。

Unity WebGL

関連リンク