スプリングボードとは？

この記事を読むための時間：3分

スプリングボードというWebサイトの表示方法を知っていますか？このスプリングボードは、iPhoneの画面表示方法として知れ渡った言葉であり、最近ではコンテンツサービスなどを提供するサイトなどにも多く使われているインターフェースです。

そのスプリングボードとは、具体的にどのような表示方法か、そして活用することでのメリットなどご紹介します。

スプリングボードとは？

スプリングボードは、アイコンを使ったメニュー表示のことを指す言葉です。iPhoneをはじめとしたスマホの画面は、アプリなどのアイコンを使用して、画面内のメニューを表示しています。

アイコンを使ったメニュー表示は、一目でどんなアプリであるかわかるため、ユーザビリティな表示方法として知られています。

iPhoneから生まれたスプリングボードは、Webサイトなどにも活用されるようになり、ショッピングサイトのカテゴリーやサービス内容などもアイコンを使って表示するなど、UXデザインの一つとして用いられています。

スプリングボードのメリットって？

スプリングボードのメリットは、ユーザーが頭で考えずに直感でメニュー内容がわかるというUI（ユーザーインターフェース）であるということです。

ユーザー目線で考えられた画面表示であり、視認性が高いのもポイントです。またスプリングボードは、デバイスのサイズに合わせて作る必要がないため、どんなデバイスにも対応した画面をデザインできるのもメリットの一つです。

また複雑なタイトルや長くなりやすいタイトルなどもアイコンのイラストで表示できるため、とても非常に見やすい画面が作れます。

スプリングボードのデメリットって？

スプリングボードは、一目でメニュー内容がわかるインターフェースではありますが、メニューの数が多すぎてしまうと、画面がアイコンだらけになってしまい、かえって見づらくなってしまうことがあります。

そのためメニュー数が多い場合には、あまり適していない画面表示の方法となります。　メニュー数が少なく場合など、画面表示の見え方を考慮して活用しなくてはならないというデメリットもあります。

スプリングボードと組み合わせたいレイアウトとは？

スプリングボードは、アイコンを使った表示方法になるため、他のメニュー表示と組み合わせて使うこともできます。組み合わせにぴったりなレイアウトをご紹介します。

スプリングボード×ハンバーガーメニュー

スプリングボードは、ハンバーガーメニューと組み合わせて使うこともおすすめです。トップ画面上で使用しているアイコンを、ハンバーガーメニューの中にタイトルに加えることで、それぞれのアイコンの説明をすることが可能です。

スプリングボードとハンバーガーメニューを連動させた表示方法にすることで、初めて訪問したユーザーにも内容を届けることができます。

スプリングボード×プルダウンメニュー

スプリングボードは、プルダウンメニューに活用するのもおすすめです。プルダウンメニューの表示にアイコンを使うことで、大まかな内容を伝えることができます。カテゴリーをアイコン表示をすることで、ユーザビリティな要素が加わったサイトに仕上がります。

スプリングボードの活用におすすめなサイトの種類とは？

スプリングボードは、どのような種類のWebサイトに適したインターフェースなのでしょうか。スプリングボードを活用するのにおすすめのサイトの種類をご紹介します。

ショッピングサイト

スプリングボードは、ショッピングサイトに活用されていることが多いインターフェースです。

ファッションサイトなどでは、アイテムをアイコン化して表示し、どのカテゴリーにどんなアイテムが紹介されているのかがみてわかるようになっています。

また、カートのアイコンやお気に入りマークのアイコンなど、より使いやすいように工夫されています。

ポータルサイト

スプリングボードは、ポータルサイトと言われるさまざまなコンテンツの「入り口」の役割のあるサービスの集合サイトなどにも使用されることの多いインターフェースです。

ビューティーサイトであれば、ヘアカットやネイル、エステなどこちらも一目で見てわかるようなデザインアイコンが活用されています。

またレストランの集合サイトなども食べ物のジャンルごとにアイコンで分けるなど、サービス提供しているサイトにもおすすめの表示方法です。

まとめ

スプリングボードは、老若男女問わずさまざまな方に伝わるよう工夫されたインターフェースです。サイト運営などにも活用できる表示方法ですので、UI/UXデザインに取り入れてみてはいかがでしょうか。