教科書一覧へ

タッチ操作とウィンドウ・アイコン

低頻約 21 分インタフェース設計

概要

本ユニットでは、スマートフォンなどで使うフリック・ピンチ・ロングプレスといったタッチ操作と、GUI画面を構成する基本要素であるウィンドウ・アイコン、そして選択操作の代表部品であるラジオボタン・チェックボックスを学びます。ヒューマンインタフェースの基礎用語であり、特に選択部品の使い分けは出題されやすい分野です。

用語7

フリック

画面を指で軽くはらうように動かして操作するタッチ動作。

フリックは、タッチパネル上で指を素早く払う(はじく)ように動かす操作です。画面を勢いよくスクロールしたり、写真を次々と送ったり、ページをめくったりするときに使います。 ゆっくり指を滑らせる「スワイプ」と似ていますが、フリックは「素早く払う」短い動作という点が異なります。また、スマートフォンの日本語入力で、キーを上下左右に払って文字を選ぶ方式を「フリック入力」と呼ぶこともあります。試験では、各タッチ操作の名称と動作を結び付けて選べることが問われます。

たとえテーブルの上のコインを指でピンとはじいて滑らせるような動き。軽く素早く払うイメージがフリックです。

記憶フックフリックといえば指で素早く払うタッチ動作

ピンチ

二本の指の間隔を変えて拡大・縮小するタッチ動作。

ピンチは、画面に触れた二本の指の間隔を広げたり狭めたりして、表示を拡大・縮小する操作です。指を広げて拡大する動作をピンチアウト(ピンチオープン)、つまむように狭めて縮小する動作をピンチイン(ピンチクローズ)と呼びます。 地図や写真を見るときに、見たい部分を大きくしたり全体を小さく表示したりするのに使います。一本指の操作であるフリックやスワイプと違い、二本指を使う点が特徴です。試験では、拡大がピンチアウト・縮小がピンチインという対応を押さえておきましょう。

たとえ両手の指でゴム風船をつまんで、広げると大きく・つまむと小さく見えるように調整するイメージです。

記憶フックピンチといえば二本指で拡大・縮小するタッチ動作

ロングプレス

画面上の対象を長押しして補助メニュー等を呼び出す操作。

ロングプレスは、画面の一点を指で少し長く押し続ける操作で、「長押し」とも呼ばれます。アイコンや文字を長押しすると、コピー・削除・共有といった補助的なメニューが表示されることが多いです。 軽く一度触れる「タップ」が主な選択・実行操作なのに対し、ロングプレスは隠れた追加機能を呼び出す役割を持ちます。パソコンの右クリックに近い使われ方をする点も特徴です。試験では、短く触れるタップとの違いや、長押しでメニューが出るという典型的な使われ方が問われます。

たとえボタンをポンと押すのがタップなら、ボタンを数秒押し続けて別の機能が起動するのがロングプレス。長押しで隠し機能を出すイメージです。

記憶フックロングプレスといえば長押しでメニューを呼び出す操作

ウィンドウ

GUI画面上でアプリの内容を表示する枠で囲まれた領域。

ウィンドウは、GUI(グラフィカルユーザインタフェース)の画面で、アプリケーションやファイルの内容を表示するための、枠で囲まれた長方形の領域です。複数のウィンドウを画面に並べて、同時に複数の作業を進めることができます。 各ウィンドウは、移動・サイズ変更・最小化・最大化・閉じるといった操作ができ、これらが画面を使いやすくする工夫になっています。試験では、ウィンドウがGUIを構成する基本要素であること、アイコンやメニューなどと並ぶ画面部品の一つであることを押さえておきましょう。

たとえ一つの机の上に、作業ごとの書類を別々のトレイに分けて広げておくイメージ。それぞれのトレイがウィンドウにあたります。

記憶フックウィンドウといえばアプリ内容を表示する枠の領域

アイコン

機能やファイルを小さな絵で表したGUIの基本部品。

アイコンは、アプリケーション・ファイル・機能などを、小さな絵や記号で視覚的に表したものです。文字を読まなくても絵を見るだけで内容を直感的に理解でき、クリックやタップで起動・実行できます。 ゴミ箱・フォルダ・カメラなど、誰が見ても意味が伝わる絵柄が使われ、言語に依存せず操作できる利点があります。GUIがCUI(文字入力中心の操作)より直感的とされる理由の一つです。試験では、アイコンが視覚的でわかりやすいGUIの基本要素であることや、絵による直感的操作という利点が問われます。

たとえ道路標識のように、文字がなくても絵を見ただけで「ここは何か」が伝わる案内マーク。それを画面上に置いたものがアイコンです。

記憶フックアイコンといえば機能を絵で表す基本部品

ラジオボタン

複数の選択肢から一つだけを選ぶGUIの選択部品。

ラジオボタンは、いくつかの選択肢の中から「一つだけ」を選ばせるためのGUI部品です。丸い印で表示され、一つを選ぶと、それまで選ばれていた別の選択肢は自動的に外れます(排他選択)。 性別の選択や「はい/いいえ」のように、択一で答えてほしい項目に使います。複数を同時に選べるチェックボックスとは対照的で、この使い分けは試験の頻出ポイントです(本トピックでも出題頻度が高い)。「一つだけ選ぶならラジオボタン」と覚え、チェックボックスとセットで区別できるようにしておきましょう。

たとえ昔のラジオの選局ボタンのように、一つ押すと前に押されていたボタンが戻る仕組み。常にどれか一つだけが押された状態になります。

記憶フックラジオボタンといえば一つだけ選ぶ択一の選択部品

選択部品

ラジオボタン

チェックボックス

一つだけ選ぶ(択一)

複数選べる(複数選択)

チェックボックス

複数の選択肢から好きな数だけ選べるGUIの選択部品。

チェックボックスは、複数の選択肢の中から「あてはまるものをいくつでも」選べるGUI部品です。四角い枠で表示され、選ぶとチェック印(レ点)が付きます。各項目は独立しているため、一つも選ばない・すべて選ぶことも可能です。 「興味のある分野をすべて選ぶ」アンケートや、「利用規約に同意する」の確認などに使われます。一つだけしか選べないラジオボタンと対になる概念で、両者の使い分けは試験で頻出です。「複数選ぶならチェックボックス、一つだけならラジオボタン」とセットで覚えておきましょう。

たとえ買い物リストで、ほしい商品にいくつでも自由にレ点を付けていくイメージ。各項目を独立してオン・オフできます。

記憶フックチェックボックスといえば複数選べる選択部品

まとめ

要点

  • タッチ操作は、素早く払うフリック、二本指で拡大縮小するピンチ、長押しのロングプレスを区別して覚える。
  • ピンチは指を広げる拡大がピンチアウト、つまむ縮小がピンチイン。
  • ウィンドウ・アイコンは、画面を構成するGUIの最も基本的な要素である。
  • ラジオボタンは一つだけ選ぶ択一、チェックボックスは複数選べる、という使い分けが頻出ポイント。
  • GUIはアイコンなど視覚的部品により、文字中心のCUIより直感的に操作できる。

記憶フック一覧

  • フリック: フリックといえば指で素早く払うタッチ動作
  • ピンチ: ピンチといえば二本指で拡大・縮小するタッチ動作
  • ロングプレス: ロングプレスといえば長押しでメニューを呼び出す操作
  • ウィンドウ: ウィンドウといえばアプリ内容を表示する枠の領域
  • アイコン: アイコンといえば機能を絵で表す基本部品
  • ラジオボタン: ラジオボタンといえば一つだけ選ぶ択一の選択部品
  • チェックボックス: チェックボックスといえば複数選べる選択部品

関連の過去問演習は今後のアップデートで追加予定です。