![見出し画像](https://assets.st-note.com/production/uploads/images/71712362/rectangle_large_type_2_158cd09abe14c9fddd20e4894ba06df0.jpeg?width=1200)
【後編】 Notion アニメの詳細ページ を デザインする。
1つ前に投稿した記事の続きになります。
データーベースの作成・運用方法については
1つ前の記事にて解説していますので ご参考ください。
アニメ作品ページ
アニメ作品ページに取り入れたこととしては、
・ gif画像 や 画像 を 使用して 作品の世界観 を表現する。
・ 同作品の漫画・映画・実写版などを【Synced Block】で 全て紐付ける。
・ 登場人物 と 配役 の【Simple Table】を 作成する。
・ エピソード ごとのページを【Table database - inline】で作成する。
・ 主題歌 や サウンドトラック を Spotifyで埋め込む。
・ 公式サイト や SNSなど の リンク先 を ブックマークする。
『アニメ 呪術廻戦』をベースに 1つずつ解説していきます。
ファーストビュー : gif画像 や 画像 を 使用して 作品の世界観 を表現する。
ファーストビュー は ページにアクセス後に 初めて視界に入ってくる画面の視界領域の範囲を示します。
![](https://assets.st-note.com/img/1643615197932-yIlt6JUimo.png?width=1200)
Notion では【Add Cover】【Add icon】が 作品の世界観が強く表現し、印象を左右する場所になります。そのため作品が違えばもちろんのこと、同じ作品でもシーンが違えば大きくページの雰囲気が変化します。
青色が印象的なブルーピリオド
ページを開いた時点でテンションが上がりますし記憶が蘇ります。
(作品を見返したくなってしまうのがデメリット…)
![](https://assets.st-note.com/img/1643615662915-WM9s2ugDb9.png?width=1200)
アニメではありませんが…
このシーンのgif画像を追加すると
『Pink Soldiers』というBGM が 脳内再生されます。
![](https://assets.st-note.com/img/1643615731583-t3jJ4v0ZLr.png?width=1200)
前回の記事 に載せた ベイマックスのページのスクリーンショットでは
データーベースのみを表示したページでしたが、
画像とアイコンを追加すると一気に世界観が創られることを
お分かりいただけるかと思います。
![](https://assets.st-note.com/img/1643615788109-PYOMAMIK4H.png?width=1200)
目次 と あらすじ : 同作品の 漫画・映画・実写版など を 【Synced Block】 で 全て紐付ける。
呪術廻戦の場合、アニメ・漫画・小説・映画 とあるのですが
前回の記事で紹介したディズニーアニメ版と実写版を紐づけた方法と同じように【Synced Block】(赤枠)で簡単に他のページに移れるようにしています。
![](https://assets.st-note.com/img/1643616763468-IndDhuww4q.png?width=1200)
漫画からのスタートの作品ではありますが、私自身の中で1番確立しているNotionページ が Movieページ なので アニメページを軸にして作成しています。画像は締めの役割として、カバー画像と同じgif画像を配置しています。
キャラクター と 配役 : 登場人物 と 配役 の 【Simple Table】を 作成する。
空欄ですが actor の右隣には、
キャラクター の ステータス(高校生、先生、〜級術師 etc…)を
メモできることを想定してスペースを作成しています。
![](https://assets.st-note.com/img/1643617245198-rFhGLIvQqi.png?width=1200)
また、プレーンテーブル から データーベースに変更して、
登場人物の画像を添付するのも面白い使い方になるのではないかなと思いました。
俳優さん・声優さんのタグを作成して
「〜の時のビジュアル」「〜と〜は同じ人の声なんだもんなー!」
と振り返り楽しむことが簡単にできるようになるので面白いと思います。
私自身「あれ、これ〜の声と同じ…?」と何度も何度も同じことを検索するので将来的には俳優さん・声優さんのページも作りたいなと思っています。
エピソード : エピソード ごとのページを 【Table database - inline】 で作成する。
エピソードについては「〜のシーンが見たい…!」となった時に役立ちます。データーベースで作成する理由は 登場人物のタグ を 作りたかったためです。
1つ前の アニメ 呪術廻戦ver. の
スクリーンショットにも少し登場してはいますが、
ブルーピリオド も途中ではありますが、もう少し作り込んだのがコチラ。
![](https://assets.st-note.com/img/1643617882051-WWEwP4R92k.png?width=1200)
アニメ 名探偵コナン にハマっていた時期に
「〜が〜に気づいたのはいつなのか?!」というタイミングを考察したく
純正メモ に残していたのを Notionに持ってきたのがコチラ。
![](https://assets.st-note.com/img/1643618182171-Ux6DxTyT8S.png?width=1200)
実際は、ブルーピリオドと同様に箇条書きのテキスト欄が右にあります。
(が、かなりの量とネタバレなので隠してあります。)
名探偵コナンのように「登場人物が多い作品」「アニメオリジナル作品・原作回がある作品」は Notionで 自分の好きなエピソードだけでも取り上げられるのでめちゃくちゃ便利です。(もっと早くからやりたかった…)
ミュージック : 主題歌 や サウンドトラック を Spotifyで埋め込む。
以前に Spotify と Notionについて書いた記事 でも取り上げたのですが
「〜の〜の曲が聴きたい!」となった時のことを考えて
Spotify や YouTube を Notion に埋め込んでおくと後々に便利です。
![](https://assets.st-note.com/img/1643618649976-6TvqQYs4hs.png?width=1200)
ページ制作中も 新しい発見 や 気づき があったりして、
めちゃくちゃ楽しい時間になるので ぜひ試してみてください。
外部コンテンツ : 公式サイト や SNSなど の リンク先 を ブックマークする。
![](https://assets.st-note.com/img/1643619190257-4EKm9uGSpz.png?width=1200)
ブックマークの一例としては、
・ Notionページを作成する上で、何度も検索・訪問することになる「公式サイト」「Filmarks」「Wikipedia」などのサイト
・ 作品ごとに盛り上がってるSNS や オリジナルコンテンツ
Notion上でブックマークしておくことで
各SNSごとでフォロー必須という縛りが無くなり、
新しいことにも目を向けやすくなるのでオススメです。
全体の補足
トグルの大見出しは「Toggle heading 3」
中身の小分け は 通常の「Toggle list」+「Bold」で 統一しています。