Skip to content

Fundamentals of Interface Design and Input Operations

低頻~35 min7 terms4 past questions

Goals of this unit

  • Tell usability apart from human-centered design by asking whether it is a quality itself or a way of working.
  • Explain how the scope of a gesture interface differs from that of a multi-touch interface.
  • Distinguish a tap from a swipe by the finger movement, and describe what sets a voice-driven VUI apart.
Terms at a glance (7)
TermIn one lineCategoryWhat it uses / clue
ユーザビリティHow well users reach their goals effectively, efficiently and with satisfactionA quality viewpointThe user's hands-on experience
人間中心設計A way of working that feeds evaluations from the user's standpoint back into design and repeats improvementsA design processEvaluation from the user's standpoint
ジェスチャーインタフェースAn umbrella term for input methods that read body movements and use them for operationInput methodFinger and hand movements
マルチタッチインタフェースAn input method operated by touching several points on the screen at onceInput methodSeveral fingers touching at once
タップTouching one point on the screen lightly and lifting right awayTouch gestureTouch and lift
スワイプSliding a finger in one direction without lifting it after touchingTouch gestureTouch and slide
VUIA way of operating by speaking and receiving spoken repliesInput methodVoice

Terms

ユーザビリティUsability

Open in glossary ユーザビリティ

Usability ユーザビリティ is the degree to which users can reach their goals with a system effectively, efficiently and with satisfaction, in other words how easy it is to use.

AspectMeaningExample
EffectivenessThe goal is achieved correctly and completelyConfirming a booking for the desired date and time without mistakes
EfficiencyLittle effort or time is needed to get thereFinishing an order with only a few screen changes
SatisfactionIt feels pleasant to use, without frustrationWanting to use it again after finishing

It is judged from the user's experience, such as whether people can reach the operation they want without getting lost and whether mistakes are unlikely. Reducing the effort of data entry is also a way to raise usability.

AnalogyIt is like changing trains at a station you have never visited, relying only on the signs. If the signs are clear and the walk is short, that station is easy to use.

How to rememberIt is usable plus the noun-forming suffix -ity, so read it as "the degree to which something is usable."

Exam points

  • ExamWhen the same value tends to be entered again and again, presetting the previously entered value as the default saves reselecting it and speeds up input.
  • ExamAutocomplete オートコンプリート suggests candidates that match the partly typed text based on strings entered before, a feature that cuts typing effort and improves usability ユーザビリティ.
  • Mix-upUsability is how easy something is for its intended users, while accessibility アクセシビリティ is whether everyone, including older people and people with disabilities, can use it.

3 past questions on this term ユーザビリティ

人間中心設計Human-Centered Design

Open in glossary 人間中心設計

Human-centered design 人間中心設計 is a way of designing that starts from real users and their context of use, evaluates design proposals from the user's standpoint, and repeats improvement until the requirements are met.

  1. Understand the context of use
  2. Specify the requirements
  3. Produce design solutions
  4. Evaluate from the user's standpoint

Evaluate them, for example by having users try them, and go back to an earlier activity to improve if the requirements are not met.

4 / 4

The specification is not fixed on the developers' assumptions alone; evaluation results feed into the next round of design. For example, the team cycles through understanding the context of use, specifying requirements, producing designs and evaluating them, and returns to an earlier activity when an evaluation falls short.

AnalogyIt resembles a tailor who measures the customer, has them try on a basted fitting, alters it, and keeps adjusting until it fits perfectly.

How to rememberIt is abbreviated HCD. The person standing at the center of the design loop is the user, not the maker.

Exam points

  • Mix-upUsability ユーザビリティ is the quality of being easy to use itself, while human-centered design 人間中心設計 is the way of working that raises that quality by repeating evaluation from the user's standpoint and improvement.

1 past questions on this term 人間中心設計

Usability vs. Human-Centered Design

AspectUsabilityHuman-Centered Design
Key differenceWhat it refers toThe degree of ease of use as a qualityA design process that raises ease of use
How it is checkedMeasured by effectiveness, efficiency and satisfactionFeed evaluations from the user's standpoint back into design and repeat

ジェスチャーインタフェースGesture Interface

Open in glossary ジェスチャーインタフェース

Gesture interface ジェスチャーインタフェース is an umbrella term for input methods that read body movements, such as those of the fingers or hands, and use them to operate a device.

  • Gesture interface
    • Movements that touch the screen
      • Touching with one finger
      • Touching with several fingers at once
    • Movements without touching the screen
      • Hand motions read by a camera or sensor

Besides tracing a finger across a screen, movements that never touch the screen, such as hand motions read by a camera or sensor, can also serve as input. Its strength is that people can operate devices much as they move in everyday life, without learning how to handle a keyboard or mouse.

AnalogyIt takes the body language you use without words, beckoning to say "come here" or holding up a palm to say "stop," and turns it into commands for a device.

How to rememberGesture means a movement of the body or hands. Placed before interface, it names a point of contact where you deal with a device through movement.

マルチタッチインタフェースMulti-touch Interface

Open in glossary マルチタッチインタフェース

Multi-touch interface マルチタッチインタフェース is an input method that detects contact at several points on the screen at the same time and lets you operate by combining them.

GestureFinger movementMain result
Pinch outSpread two fingers apartZooms in
Pinch inBring two fingers togetherZooms out
RotateMove two fingers as if drawing a circleChanges the orientation of an image or other item

A pinch out ピンチアウト, which spreads two fingers to zoom in, and a pinch in ピンチイン, which brings them together to zoom out, work only because several contact points can be handled at once. A method that detects just one contact point cannot perform such gestures.

AnalogyLike a pianist pressing keys with fingers of both hands at once to play a chord, it combines the movements of several fingers to convey one meaning.

How to rememberMulti means many or several. It is the same prefix as in multimedia, and here it means there are several touch points.

Exam points

  • ExamA method that operates a device by touching two or more points on the screen at once and combining those finger movements is multi-touch マルチタッチ.
  • Mix-upMulti-touch interface マルチタッチインタフェース uses simultaneous contact at several points on the screen, while gesture interface ジェスチャーインタフェース is the umbrella term for input by body movement, including hand motions that never touch the screen.

1 past questions on this term マルチタッチインタフェース

Gesture Interface vs. Multi-touch Interface

AspectGesture InterfaceMulti-touch Interface
Key differenceScopeAll input by body movement (umbrella term)Input by touching several points on the screen at once
Screen contactIncludes hand motions that do not touch the screenRequires touching the screen
Typical gesturesTracing movements, hand motions read by a cameraPinch in, pinch out

Tap タップ is the most basic touch gesture: lightly touching one point on a touch screen with a finger and lifting it right away.

It corresponds to a mouse click and is used to select or run icons and buttons. There are also variations that change how you touch, such as a double tap ダブルタップ, two quick light touches on the same spot.

AnalogyIt is close to pressing an elevator's floor button lightly with a fingertip. A touch and a release are enough to select and confirm.

How to rememberThe English word tap means to strike lightly. Picture tapping someone on the shoulder to get their attention.

Exam points

  • Mix-upTouching and lifting at once is a tap タップ, while keeping the finger in place for a while is a long press 長押し. What separates them is how long the finger stays.

Swipe スワイプ is the gesture of sliding a finger in one direction without lifting it after touching the screen.

It is used to move what is on screen, such as switching screens, scrolling through a list or advancing to the next photo. The direction of the slide decides the result, such as going back or moving forward.

AnalogyIt is like sliding a sheet of paper across a desk with your fingertip pressed on it to move it aside.

How to rememberThe English word swipe means to rub or sweep quickly. Passing a card quickly through a reader is called by the same word.

Exam points

  • Mix-upTap タップ lifts the finger without moving it from where it touched, while swipe スワイプ keeps contact and slides the finger. The difference is whether the finger moves.

Tap vs. Swipe

AspectTapSwipe
Key differenceFinger movementLift without moving from where you touchedKeep touching and slide in one direction
Main useSelecting or running itemsSwitching screens and scrolling lists
Closest mouse actionClickScrolling with the wheel

VUIVUI (Voice User Interface)

Open in glossary VUI

VUI (Voice User Interface) is a way of operating through an exchange in which the user speaks with their voice and the device answers with sound.

  1. The user speaks
  2. Speech recognition reads the words
  3. The requested task is carried out
  4. Speech synthesis replies

It reads the result aloud with speech synthesis and answers the user by voice.

4 / 4

The device converts spoken words into text or commands with speech recognition 音声認識 and reads its replies aloud with speech synthesis 音声合成. Because it works without looking at or touching a screen, it helps when your hands are busy or the screen is hard to see.

AnalogyIt is like asking a family member out loud to "set the timer for 3 minutes" while your hands are busy cooking, and hearing "done" in reply.

How to rememberThe V stands for Voice. Swap the G (Graphical) in GUI, where you work with on-screen parts, for a V, and you get a point of contact that uses voice instead of a screen.

Exam points

  • Mix-upVUI uses the voice and a gesture interface ジェスチャーインタフェース uses body movements such as those of the fingers or hands as input. They differ in what serves as the means of input.

Key points

  • Usability is ease of use measured by effectiveness, efficiency and satisfaction, and designs that cut input effort raise it.
  • In human-centered design, when an evaluation does not meet the requirements, the team returns to an earlier activity and repeats improvement.
  • A multi-touch interface allows gestures that use several contact points at once, such as spreading or pinching two fingers.
  • VUI carries a spoken exchange through speech recognition and speech synthesis, so it can be operated without hands or eyes.

Check questions

4 past questions from this unit

Start the check questions

All past questions in this topic