皆さん、お疲れ様です。インターンの吉原です。

今回は、インターン生が所属している青山学院大学 地球社会共生学部 古橋研究室の学生が昨年のゼミ論でMapbox Studioを用いて「鬼滅の刃風マップ」をデザインしたので、そちらを紹介したいと思います。

青山学院大学 地球社会共生学部 古橋研究室の紹介

古橋研究室は、「一億総伊能化社会」の実現のために必要とされる様々な諸問題を解決し、世界中のすべての人々が地図を自由に利活用できる時代を作るべく学生と様々な方々と共に教育/研究を行っているゼミです。
本拠地は神奈川県 相模原キャンパスです。

鬼滅の刃風マップとは

紹介する鬼滅の刃風マップは、古橋研究室に所属する斎藤祐花さんがデザインしたものです。彼女は「ブランドイメージを崩さないウェブ地図スタイリングの手法」を研究テーマに掲げ、漫画・アニメ「鬼滅の刃」のキャラクターを例にしたMapboxでのデザイン地図制作の実践を行っています。

作品一覧

竈門禰豆子イメージデザイン

煉獄杏寿郎イメージデザイン

胡蝶しのぶイメージデザイン

ブランドイメージを崩さないための工夫

制作者の祐花さんは、ブランドイメージを崩さないでweb地図スタイリングを行うにあたって、３つの重要なポイントを教えてくれました。

１. カラー選び

キャラやブランドの特徴的な色をピックアップし、カラーパターンを用意する必要があります。メインカラーとサブカラーを設定し、なるべくそれら２色をbaseとroadの色に反映させることで、簡単にキャラクターのイメージに近づかせることができます。その際に、地図上にカラーを反映させた時の色のぶつかり合いや相性には注意するべきです。

２. モチーフや特徴的要素の再現

キャラやブランドの特徴的なモチーフや柄などの要素を挙げ、地図上の道の張り巡らせ方や地形に着目しすり合わせます。例えば禰豆子では、竹筒・麻の葉模様、薄桃色の髪飾りが禰豆子を構成するイメージ要素です。その中でも麻の葉模様は地図上の放射線状に広がる道をそれに見立てることができるため、放射線状に道が広がる場所を探して組み合わせました。

３. イメージを崩さないフォント選び

キャラの性格やブランドイメージを細かに研究し適切なフォントを選択します。例えば、しのぶの事例では、胡蝶しのぶの外見から読み取れる華奢さや艶やかさ、羽織と隊服がおりなす曲線感が連想され、作中の言動やキャラクターデザインからは穏やかな表情とは裏腹に歯に衣着せぬ発言のミスマッチさがうみだすミステリアスさが読み取ることができます。そのため使用するフォントは曲線的な要素を多く含むものでありゴツゴツしたものよりも細身の幅のものを選択しました。

デザインするにあたって苦労したこと

キャラクターの配色によっては、着物やアイテムではバランスが取れていたものの、地図上だとなかなかうまくマッチングしなかったり、色のバランスの崩壊が生じる場合があり、バランスの良いマップをデザインするのに苦労しました。
また、今回事例とした「鬼滅の刃」の時代設定は大正であり、忠実にその時代背景に沿った世界観をつくりあげるために、テクスチャや文字列の縦化などさらなる改善が必要となりました。

さらに磨きをかけたマップにします

ブランドイメージやキャラクターイメージをより反映させるには、テクスチャーや地図上に反映させる情報の取捨選択などの細部にも気を使うことが求められます。4年次の卒業論文では今回上がった課題点をブラッシュアップし、ブランドイメージを崩さないウェブ地図スタイリングの手法を確立したいと思います。(祐花さん)

＊「煉」は「火東」、「禰」は「ネ爾」が正しい表記となります。

吉原

【関連記事】

お問い合わせは下記までご連絡ください
https://www.mapbox.jp/contact