アムステルダム市営交通GVBアプリを使った切符の買い方とUXデザイン

  • このエントリーをはてなブックマークに追加

アムステルダム市の地下鉄やバス、トラムを運行するGVBはアムステルダム観光で必ずと言っていいほど利用する乗り物です。GVBを利用する際には、アプリを使って切符を購入すると便利です。この記事ではGVBアプリを使った切符の買い方を解説するとともに、デザイナーの視点でアプリの使い勝手(UX/UIデザイン)を検証したいと思います。

GVBとは

GVB(Gemeentelijk Vervoerbedrijf)は、アムステルダム市内で公共交通機関を運営するアムステルダム市営交通のことを指します。GVBは、アムステルダム市内でバス、トラム、地下鉄、フェリーなどの公共交通機関を運営している公共事業者です。市内や周辺地域をカバーし、地元の住民や観光客に利用されています。

GVBの切符の買い方

切符の買い方には主に4種類あります。アプリまたはクレジットカード直接払い以外で切符を購入する場合は、運賃に加えて紙切符の発行代として1ユーロが追加徴収されます。また、GVBのチケットでは、

  • NS(オランダ国鉄)
  • CONNEXXION
  • EBS

に乗車できない点ご注意ください。筆者もこのことを知らず、バスで乗車拒否されてしまいました。

24時間チケットで乗車拒否されたバスです。CONNEXXIONかEBSだったようです。

アプリ

本記事で詳しく説明するのがアプリです。アプリを使えば24時間どこでも切符を購入することができます。

紙の切符では1ユーロが切符代として追加徴収されますが、アプリであればデジタルチケットのため切符代はかかりません。つまり、コストを抑えて効率的に観光したい方にはとても便利です。

自動券売機

地下鉄の駅には自動券売機が設置されており、切符を購入することができます。自動券売機で切符を購入すると、紙切符代として1ユーロが合わせて徴収されます。

サービスセンター(窓口)

アムステルダム中央駅や市内にあるPrimeraやBurunaで切符の購入が可能です。

クレジットカードで直接払い

2023年1月からタッチ決済機能の付いたクレジットカードやデビットカードで直接社内の検札機にタッチすると乗車できるそうです。

筆者は試していませんので、ご自身で確認の上で乗車してみてください。

車内で購入

トラムおよびバスを利用する場合は、車内で切符を購入することができます。バスは運転手から購入しますが、トラムの場合は運転手ではなく、サービスカウンターから購入する点だけ注意してください。サービスカウンターはトラムの真ん中の車両にあります。

GVBアプリで切符を買う方法と使い勝手(UXデザイン)

それでは、GVBアプリで切符を買う方法について解説します。アプリは英語の言語変更ができますので、皆さんはアプリをインストールしたら英語に切り替えてください。残念ながらこの記事の公開時点で日本語はありません。

手順1

アプリをインストールしたら、この画面が開きます。
この画面では「あなたに関する質問に答えますか?」と問われていますので、「はい(Let’s go!)」または「いいえ(Skip)」をタッチしてください。この記事では、「はい」とタッチします。

GVBは青で統一され、はいが白塗に青字であることから、ユーザを「はい」に誘導しようとしていることが容易に推測できます。

手順2

ここでは名前を求められます。この名前を入れるとアプリのダッシュボードに名前が表示されるようになります。他の鉄道アプリと異なり、この名前がチケットに刻印されることはありませんので、個人名でなく、ニックネームでも問題ありません。記入を終えたら「次へ(Next)」を押します。
記入が嫌な方はスキップ(Skip)をタッチしてください。

手順3

ここではアプリの利用目的に関するアンケートになります。

  • Different travel destinations 観光
  • Commuting 通勤・通学
  • Holiday or a day out 休暇

観光の場合は一番上をタッチしてください。

前の画面に戻りたい場合は「戻る(Back)」をタッチしてください。
記入が嫌な方はスキップ(Skip)をタッチしてください。

手順4

アンケートに答えると、ホーム画面が出てきます。先ほど答えた名前はホーム画面上部に表示されます。

この画面ではさまざまな情報が掲載されています。目的地が決まっている場合は中央の空白欄に入力します。

今回は切符を購入したいので、下の5つのアイコンから「ショップ(Shop)」をタッチします。

手順5

ショップを選ぶと購入できるチケット一覧が表示されます。
今回は24時間券をタッチします。

数字が強調されているので、わかりやすいデザインだと思います。

手順6

24時間券をタッチすると、数量の変更ができます。複数枚必要であれば数量を変更してください。
異なる種類のチケットを同時に購入する場合は「チケットの追加(Add other tickets)」をタッチします。

合計金額を確認したら「支払い(Pay)」をタッチしてください

手順7

購入手続きが完了すると、画面上部の「自分の切符(My tickets)」に切符が表示されます。
いまは、支払いが完了しているものの、切符は有効化されていませんので、「有効化されていない切符(Inactive tickets)」となります。使用するためには画面中央の「有効化する(Activate)」をタッチしてください。

手順8

有効化するための最終確認画面が表示されますので、「切符を有効化する(Activate ticket)」をタッチしてください。

手順9

有効化が完了すると、QRコードが表示されます。また有効期限が表示されますので、必ず確認してください。この画面では「1 11 2022 09:40」が有効期限で、「2022年11月1日9時40分まで」ということになります。

QRコードをタッチすると拡大することができます。

手順10

QRコードをタッチすると画面が拡大されます。改札や検札機に見せる際はこちらの画面を近づけると認識されやすいので、ぜひご活用ください

GVBアプリのデザインがなぜ優れているのか?

GVBのモバイルアプリを開発している企業がどこか探しましたが、情報は見つかりませんでした。しかし、調べるとキーカラーなどの指定はされており、カラーやフォントの統一することで、ユーザをミスリードさせない画面の設計になっているのかもしれません。おそらくブランドガイドラインは整備されているのだと思います。また、ユーザが押してほしいボタンは白地に青文字と、画面全体の青色とコントラストをはっきりさせることで、手前に浮いているように見えて視認性を向上させている意図がくみ取れます。

配色

プライマリーカラー

#0060A8

#172B4D

#F0F9FF

セカンダリーラルカラー

#EF6534

ニュートラルカラー

#lalala

フォント

  • Helvetica Neue Bold
  • Helvetica Neue Regular

終わりに

オランダアムステルダムGVBのアプリを使ったチケットの購入は簡単で、ぜひ使ってほしいと思います。ぜひアムステルダムに行ったらアプリをインストールしてみてください。別の記事でフィンエアーのアプリのUXデザインについても解説しています。また、creativeog[クリオグ]では、UXデザインに関する記事を多数執筆していますので、ぜひ他の記事もご覧ください。

  • このエントリーをはてなブックマークに追加

SNSでもお読みいただけます