0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

「面」で見渡す発着案内 - 「探し方」を変える Athenai Transit のデザイン

0
Last updated at Posted at 2026-08-17

Athenai Transit とは

Athenai Transit (あてのない乗換案内) は、目的地を入力しない乗換案内の Web アプリです。経路検索を持たず、「A から B への行き方」ではなく「今、ここからどこへ行けるか」を提示します。扱うのは GTFS などの静的な公共交通オープンデータです。

次に乗るバスや電車を探すとき、欲しい情報は3つあります。のりば (バス停や駅) の場所、行き先、そして時刻です。

Athenai Transit は、周辺にあるこれらをまとめて表示することで「選ぶだけ」という体験を提供しています。そしてこの表現を 「面」で見渡す発着案内 と呼んでいます。

参考: 地図の表現力を、交通情報に

「面」で見渡す発着案内 とは何か

モバイル デスクトップ
上に地図、下に発着情報が並ぶ 左に発着情報、右に地図が並ぶ

周辺ののりばと発着便を、一度に見渡すことのできる表現です。地図を開いた時点で、選べるものが揃っています。

画面は大きく2つの領域で構成されています。地図発着情報です。

地図が示すのは、のりばの場所です。 どののりばが、どちらの方向に、どれくらい離れた位置にあるのかを示します。この領域の主役はのりばです。

発着情報が示すのは、行き先と時刻です。 そののりばから、どこ行きの便が、いつ発着するのかを示します。この領域の主役は便です。

2つの領域は常に連動しており、その基準となるのが地図の中心です。 地図を動かせば、発着情報もその位置のものに入れ替わります。現地を歩きながら確かめることも、自宅にいながら遠く離れた街を見渡すことも可能です。

この2つが同時に見えている状態こそが、「面」で見渡すということです。どこから、何が、いつ、どこへ向かうのか。判断に必要な情報が、探し始める前から手元に揃っています。

地図が示すもの: 空間情報と運行情報

熊野前周辺の地図。周辺ののりば、距離帯ごとに色分けされた同心円と、運行頻度で太さの変わる路線図

表示領域内にあるのりばや路線は、まとめて地図上に描かれます。この表現のベースにあるのは、街の広域バスマップや紙の路線図が持っている優れた一覧性です。

のりばは名称を添えたマーカーで示され、その密集具合から周辺の「空間的な配置」が一目で読み取れます。一方、路線図は運行頻度が高いほど太く描かれ、そこにどれだけの便が走っているかという「時間的な厚み」を伝えます。

こうした紙の路線図が持つ「空間」と「時間」の表現力の上に、Web アプリならではの動的な機能を重ねていますが、そこには紙にはないジレンマが生じます。

紙の路線図であれば1枚にすべてを収められますが、Web アプリの画面には物理的な限界があります。全体を俯瞰しようと縮小すれば細部は潰れ、逆にのりばを詳細に見ようと拡大すれば、表示範囲が狭まって周囲の選択肢が画面の外へ消えてしまいます。画面上で自由に拡大できることは、この「視野の喪失」と引き換えに得られたものです。

エッジマーカーは、まさにこの「拡大によって表示範囲が狭まったとき」に機能する仕組みです。視界の外へ押し出されてしまった周辺ののりばを、画面の縁につなぎ留めます。 地図を動かせばマーカーも滑らかに追従するため、細部を拡大したままでも「外側に何があるのか」が常に視界に入ります。これは、どちらの方角へ地図を動かせば次ののりばに近づけるかという、直感的な道標となります。

地図での探索を支える工夫は他にもあります。以下は一例です。

  • 対象の絞り込み: バス・鉄道・地下鉄といった種別マーカーのフィルタリング、およびバスとそれ以外の路線図の表示・非表示
  • 路線のハイライト: 選択されたのりばと、路線図など関連情報のスマートな強調表示
  • ベースマップの切り替え: 複数の地図から、目的に合わせたタイルの選択
  • 現在地の追従: 現在地への自動フォーカス、および移動に合わせた地図のスクロール

発着情報が示すもの: 選択肢とその束ね方

地図と違い、この領域には複数の表現方法が用意されています。便を探す「手がかり」は、場所や目的によって変わるからです。見え方を1つに固定してしまうと、状況に合わない場面でかえって使いづらくなってしまいます。

そこで、情報を束ねるアプローチを大きく2つに分けました。「のりば単位」の表現と、「のりば横断」の表現です。

のりば単位は、バス停の時刻表や次発案内のように、そののりばに関する情報だけをまとめる表現です。のりば横断は、空港やフェリーターミナルの出発案内ボードのように、周辺の複数ののりばをひとつに統合する表現です。

Athenai Transit では、複数の表現方法をいつでも切り替えられるようにすることで、利用者が自身の状況や目的に合わせて見方を選択できるようにしています。

ここでは、そのうち4つを取り上げます。以下は同じ場所の情報をそれぞれの表現で示したものです。

のりば単位: のりば一覧 (発着順)

地図の中心から一定距離にあるのりばをカードとして並べ、その中に便を時刻順に表示します。便が最小の単位となるため、1便あたりを最も詳しく示すことができます。発着時刻や行き先に加えて、行程のどこにいるのか、終点までどれだけ残っているのかまで確かめられます。

のりば一覧 (発着順)。のりばのカードに、便が時刻順に並ぶ

のりば単位: のりば一覧 (路線/行先/発着順)

地図の中心から一定距離にあるのりばをカードとして並べ、その中を行き先ごとにまとめます。便に固有の情報は表示されませんが、同じ行き先の便が、次、その次と並びます。行きたい方面が決まっている場合には、余計な情報が少なく、最も見やすい形式です。

のりば一覧 (路線/行先/発着順)。のりばのカードの中が、路線と行き先ごとにまとまる

のりば横断: 発着案内

指定した範囲にある便を、時刻順に1枚のボードへ統合します。空港の発着便ボードに最も近い表現です。乗り物の種別ごとに分かれるため、バスと鉄道が同じボードに混ざることはありません。

バスターミナルなどで「どれに乗ろうか」と漠然と選ぶ際などには、使いやすい表現であると思います。その場所からどこへ行けるのかを眺めるだけでも面白いものです。

発着案内。複数ののりばの便が、1枚のボードに時刻順で並ぶ

のりば横断: 路線別発着一覧

指定した範囲にある便を、路線ごとに分けて表示します。1つのボードにはその路線の便だけが並びます。

特定の路線の情報を把握したい場合に適した表現です。面白い用途としては、バスターミナルまで車でお迎えに行く場合など、到着便の情報を把握する場合に便利です。

路線別発着一覧。1つのボードに、その路線の便だけが並ぶ

まとめ: 探し方そのものが変わる

変わったのは、画面の見た目ではなく、「移動の選択肢」の探し方です。

のりばを1つずつ開いて確かめるのではなく、あらかじめ手元に揃った情報から便を選ぶことで、「探す」という行為は「選ぶだけ」の体験になります。

それを実現しているのが、地図と発着情報という2つの領域の連動です。のりばの空間的な分布や路線の厚みを示す「地図」と、そこから出発する便を示す「発着情報」。この2つが1枚の画面に収まり、地図の中心を基準に常に連動します。さらに発着情報は、その束ね方まで切り替えられます。

Athenai Transit がこうした構造をとっているのは、あらかじめ決められた目的地への「経路」ではなく、今ここからどこへ行けるかという「選択肢」を並べるためです。この「面」で見渡す発着案内が、あてのない散歩や日常のちょっとした移動を、少しでも自由にできればと思います。

Athenai Transit を試す

Web ブラウザで開くだけで使えます。右下の 🎲 を押すと、色々な場所へ移動します。降り立った先で「どれに乗ろうか」と眺めてみてください。

関連記事

0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?