ライトボックスギャラリーをブログ投稿に追加できるCMSベースのWebサイトを持っています。ギャラリーには1つ以上の画像を含めることができ、投稿の本文には最初の画像のサムネイルが表示されます。サムネイルをクリックすると、矢印と閉じるボタンが付いたライトボックススタイルのように、拡大表示されます。
以下を示すのに適したUXプラクティスはありますか?
最小のユーザーの驚きの原則による設計。それ自体の単一の画像は、背後のギャレーに複数の画像があることをユーザーにアフォーダンス(ヒント)を提供しません。
写真のギャラリーが存在することを示唆するさまざまな方法があります。 「最良の」方法は、ギャラリーを起動するUIを考慮して、実用的な方法によって異なります。
最も便利な便利な方法は、ミニギャラリー、カルーセル、または「カバーフロー」UIを表示することです。これは、ユーザーが目的の画像をすばやく参照してクリックできることを意味します。
ただし、起動UIが制限されている場合、他のアフォーダンスは「12画像」、バッジ「12」、またはマルチイメージスタックのラベルになる可能性があります。バッジとマルチイメージスタックを一緒にスケッチしました。
download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム
すべての場合
ライトボックスで1枚の写真を拡大するだけの場合は、拡大鏡アイコンのプレビューとしてサムネイルを使用します。ギャラリーの場合、これは異なります。アクセシビリティの観点からは、ギャラリーを視覚的にだけでなく、「ギャラリーを表示(x画像)」のように言葉で示します。次に、ギャラリービューは常にセット内の最初の画像から開始し、ユーザーが一方向でギャラリーを閲覧できるようにする必要があります。ギャラリーの場合は、一般的なギャラリーアイコンとテキストリンクを使用します。