訓練日誌22 ユーザーインターフェイス基礎③

2025年8月26日

本日は、アクセスマップ制作に向けての準備をしました。

本日のアジェンダ

1限目
学科 ユーザーインターフェイス基礎③
作品の制作について

2限目
学科 ユーザーインターフェイス基礎③
作品の立案

3限目
学科 ユーザーインターフェイス基礎③
作品の立案

4限目
学科 ユーザーインターフェイス基礎③
作品の立案

5限目
学科 ユーザーインターフェイス基礎③
作品の立案

アクセスマップとは

アクセスマップは「目的地への行き方」を分かりやすく示すための地図です。
大事なのは、必要な情報だけを残して、いらない情報を削ぎ落とすこと。

たとえば、曲がり角や目印(ランドマーク)は大きく目立たせる一方で、不要な建物や細かすぎる道は省く、といった工夫がポイントになります。

アクセスマップ作成のポイント

アクセスマップは道案内を具現化したもの

アクセスマップを作る時は、作るときは 3種類の主語 を意識すると分かりやすい!

  • (自分が道を理解しているか)
  • あなた(特定の相手に伝わるか)
  • 誰か(不特定多数にもわかりやすいか)

最初は、知っている場所を題材にして練習すると良さそうです。
そして「どこから」「どこを通って」「どのくらいの距離を」「どんな手段で」という流れを文字で整理し、ピクトグラムやロゴのように視覚的にまとめていきます。
単なる地図ではなく、見る人の立場に立った“道案内ツール”に仕上げることを意識すること!

レイアウトの5つの法則

アクセスマップのレイアウトをきれいに見せるには、コツがあります。それが 「余白・近接・整列・反復・コントラスト」 の5つです。

余白(Margin) … 余白をとる
→ 情報を詰め込みすぎず、余白をとって見やすさを意識する。

近接(Proximity) … グループ化する
→ 関連する要素を近くにまとめて、関係性をわかりやすくする。

整列(Alignment) … 揃える
→ 見えない線を意識して配置し、視線の流れをつくる。

反復(Repetition) … 繰り返す
→ 同じルールや要素を繰り返して、全体に一貫性を持たせる。

コントラスト(Contrast) … 強弱をつける
→ 大きさ・色・太さなどの違いで、メリハリを出し、重要度を示す。

作成後の運用も考えて作る

今回は実習なのでそこまで考える必要はありませんが、実際のお仕事でアクセスマップを作る場合は、情報を更新していくことが大切です。
例えば、目印にしていたお店がなくなってしまうと、その地図を見た人は目的地に辿り着けなくなってしまいます。
そのため、ランドマークにはできるだけ公共施設など、長期間変わらないものを選ぶのが安心です。(どうしても他に目印がない場合は仕方ありませんが…)

アクセスマップの草案を考えてみた!

ということで、アクセスマップ作成へ向けて、草案を考えてみました。

テーマ:溝の口駅→ハローワーク川崎北(溝の口のハロワーク)までのアクセスマップ

道順を口頭で説明すると?↓

溝の口駅(田園都市線)東口、武蔵溝ノ口駅(南武線)北口から徒歩約10分。改札を出ると、2階連絡通路に出るので、ノクティ、マルイ方面の階段から地上に降りる。南部沿線道路を直進して、文教堂、踏切を過ぎると交差点があるので、コインパーキングの方面に曲がり、そのまま直進します。右手にローソン、左手に公園が見えるのでそのまま直進すればハローワークのあるビルに到着します。正面口から入り、エレベーターで4Fまで行くと目的地になります。

わたしの所感

地図を読むのも苦手で、方向音痴なためアクセスマップなんか作れるのでしょうか…と正直不安でした。ひとまず草案を作ってみましたが、何回も行ったことのある場所なのに「どう行くんだっけ?」となってしまい自分の地図で迷子になりそうでした。
でも今日教えてもらったレイアウトのポイントを思い出しながらなら、なんとか形にできそうな気がします。とりあえず、伝わるマップを目指して、できればデザインもこだわって作ってみたいです!

コメント

タイトルとURLをコピーしました