この章の学習目標
読み終えたら、できること。
- 「操作の手掛かりを示す」の意味と理由を、具体例で説明できる
- 「結果を返す」の意味と理由を、具体例で説明できる
- 「失敗を防ぎ、戻せるようにする」の意味と理由を、具体例で説明できる
章内を一度に読まず、見出しごとに例を説明してから先へ進んでも大丈夫です。
この章の目次
WHY / なぜ学ぶ?
身近な「なぜ?」から。
送信ボタンを押しても何も変わらないと、何回も押してしまうことがあります。使いやすさは、ボタンの見た目だけでは決まりません。操作できる手掛かりと、操作した結果を利用者へ返すことが必要です。
BIG PICTURE
この章の全体像をつかもう。
入口を見つけ、操作し、結果を理解し、必要なら取り消すという流れ全体を考えます。UIは接する部分、UXはその利用を通した体験全般です。操作が速いだけでなく、誤りなく目的を達成できるかを見ます。
アプリ教材の単元原図
まず、図で全体像をつかもう。
図の見出しと、下の本文の見出しを対応させて読みましょう。原図には発展事項も含まれます。この章の確認範囲は本文と代表3問です。
アプリ教材の制作原図を加工せず掲載しています。図の文字コードの固定バイト数などは例で、方式により異なります。本文の条件と併せて確認しましょう。本文は2026年10月に整理したWeb用解説です。
THREE KEYS
まず押さえるのは、3つ。
章の細かい用語は、この3つの考え方に結び付けて読み進めましょう。
操作の手掛かりを示す
押せる場所が分からないと次へ進めません。形だけでなくラベルも使って行為を伝えます。
たとえば:「次へ」という文字や枠で、操作できる場所を知らせます。
結果を返す
処理中か、完了か、失敗かが分からないと利用者は判断できません。
たとえば:送信中→受付完了と状態を示し、失敗時には再操作の方法を示します。
失敗を防ぎ、戻せるようにする
注意書きだけより、配置や入力制約、取消手段も組み合わせます。
たとえば:保存と削除を離し、重要な削除は確認や復元手段を用意します。
THINK WITH A DIAGRAM
図を読みながら、考え方を追う。
| 課題 | 不足しているもの | 改善 |
|---|---|---|
| 押せるか分からない | 手掛かり | ラベルと形 |
| 結果が分からない | フィードバック | 処理中・完了・失敗 |
| 削除を間違える | 防止と回復 | 配置・確認・取消 |
表が収まらない場合は横にスクロールできます。
2-5-1
操作性
UIは人とシステムが接する部分、UXは利用前後も含む体験全体です。ボタンが押しやすいことは大切ですが、それだけで目的を達成できるとは限りません。目的の情報にたどり着くまでの操作回数、待ち時間、結果の理解までを確認します。「操作できる」と「気持ちよく目的を達成できる」を分けて考えましょう。
2-5-2
アフォーダンスとシグニファイア
アフォーダンスは物や環境と人との関係から生まれる行為の可能性、シグニファイアはどこでどう操作できるかを示す手掛かりです。ボタンの枠や「次へ」のラベル、リンクの下線などが手掛かりになります。飾りを押せそうに見せたり、押せる場所を見えなくしたりすると、利用者は迷います。
2-5-3
誤操作防止
誤操作は、確認・取消・入力制約・結果のフィードバックなどで減らします。削除と保存を隣に置かない、危険な操作は確認する、戻せるようにするなどの方法があります。移動中など利用状況に応じた注意も必要ですが、利用者の安全を考え、歩きながらの操作を前提に便利さだけを高めないようにします。
重要語句を整理しよう。
| 語句 | 意味 | 混同しやすい点 |
|---|---|---|
| UI | 人とシステムが接する部分。 | 画面だけでなく操作の仕組みも含む。 |
| UX | 利用を通して得られる体験全般。 | 見た目の好みだけではない。 |
| アフォーダンス | 物や環境と人との関係から生まれる行為の可能性。 | 操作を示す記号そのものとは区別。 |
| シグニファイア | どこでどう操作できるかを知らせる手掛かり。 | ラベル・形・下線など。 |
| フィードバック | 操作の結果や状態を伝えること。 | 送信成功・失敗を区別する。 |
| 誤操作防止 | 間違えにくい配置や制約などの工夫。 | 注意文だけに頼らない。 |
表が収まらない場合は横にスクロールできます。
WORKED EXAMPLE
一緒に解く:手順と理由を確かめよう。
「登録」を押すと画面が同じままです。登録済みか不安な人へ何を示しますか。
- 処理中か終了かを分けます。
- 成功時は完了したことと次の行動を表示します。
- 失敗時は理由と再操作の方法を示します。
- 重複登録が起きない仕組みも確認します。
| 状態 | 表示の例 | 利用者の判断 |
|---|---|---|
| 処理中 | 登録しています | 待つ |
| 成功 | 登録完了 | 次の行動へ |
| 失敗 | 通信できませんでした | 案内に沿って再試行 |
表が収まらない場合は横にスクロールできます。
状態が分かるフィードバックを加え、無反応のままにしません。
ここで間違えやすい。
TRY IT YOURSELF
次は、自分の言葉で。
登録成功と失敗を区別して知らせることを何という?
考え方と答えを確かめる
フィードバックです。結果が分かることで、次に待つのか再試行するのかを判断できます。
理由まで言えたら、下の代表3問へ進みましょう。
CHECK YOUR UNDERSTANDING
代表3問で、確かめよう。
アプリ収録の問題から3問を選定。章内のすべての項目を出題するものではありません。解答・解説はこのページで確認できます。
解答・解説だけ読む
問1:A
「操作性の向上」は、単に画面が見やすいというだけでなく、利用者がその機器やサービスを通じて得られる体験(ユーザエクスペリエンス:UX)の質を高めることを目的としています。適切なシグニファイアや構造化されたUIなどは、このUXを向上させるための重要な手段です。
問2:A
「適切なシグニファイアがデザインされたユーザインタフェースは、利用者が得られる体験(ユーザエクスペリエンス)の向上をもたらす」と明記されています。情報デザインの目的は効果的なコミュニケーションや問題解決であり、操作性を高めることもその重要な一部です。利用者がマニュアルを読み込むことなく、デザインから受ける誘導に従ってスムーズに目的を達成できることは、良質なUXを実現するための不可欠な要素となります。
問3:A
コンテクストとは、利用者の背景情報や状況のことです。歩きスマホなどの「ながら操作」は注意力が散漫になり、誤操作が発生しやすいコンテクストです。これをシステム側で検知して制限をかけることは、状況に応じた誤操作防止策と言えます。ボタンを大きくすることはアクセシビリティ、入力文字の一時表示は確認の容易性、リセットボタンの配置はやり直し機能であり、特定の「状況(文脈)」に特化した対策ではありません。
理解できたら、別の問題でも。
この章の考え方を、条件の違う問題でも確かめましょう。情報1アプリでは分野別の演習と間違えた問題の復習ができます。
無料でアプリを入手 iPhone・iPadはApp Store、AndroidはGoogle Playへ。PCではストアを選べます。運営者が開発するアプリです。各OSの機能と利用条件はストア掲載をご確認ください。説明できたら、この章は完了。
- 「操作の手掛かりを示す」の意味と理由を、具体例で説明できる
- 「結果を返す」の意味と理由を、具体例で説明できる
- 「失敗を防ぎ、戻せるようにする」の意味と理由を、具体例で説明できる
迷った項目は本文・図解・例題へ戻り、答えを見ずに説明し直してみましょう。
要点へ戻る ↑出典・教材について
本サイトの26章は、アプリの分類を用いた補助教材です。検定教科書や公式の章立てではありません。問題と図解は運営者のアプリ教材から選定し、問題ID・選択肢・正答を保持しています。共通テスト過去問の転載ではありません。