メインコンテンツへスキップ
教材一覧に戻る
ITパスポート

情報じょうほうデザインとメディア

最終確認日:

この章しょうで学まなぶこと

テクノロジ系けい 45 問もんのうち、この章しょうは 4〜5 問もんほどの出題しゅつだいがあります。「Web サイトや案内あんない板ばんで、どう並ならべたら伝つたわりやすい?」「スマホのアプリは目めが不自由ふじゆうな人ひとでも使つかえる?」「写真しゃしんと図ずで保存ほぞん形式けいしきが違ちがうのはなぜ?」「VR と AR って何なにが違ちがうの?」といった、人じんが情報じょうほうをどう受うけ取とるかの設計せっけいと、画像がぞう・音声おんせい・動画どうがのデジタル表現ひょうげんを扱あつかう章しょうです。

出題しゅつだいは用語ようご → 用途ようとのマッチング型がたが中心ちゅうしん。「ポケモン GO は AR か VR か」「ロゴは JPEG か PNG か」のように、似にた概念がいねんの使つかい分わけが判別はんべつできるかを問とわれます。技術ぎじゅつの深ふかい話はなしではなく、「どれをどう使つかうか」を押おさえるのがコツ。

学習がくしゅうゴール

この章しょうを読よみ終おえた時点じてんで、以下いかができるようになっていることを目指めざします。

  • 情報じょうほうデザインの原則げんそく(LATCH・UI・UX・アクセシビリティあくせしびりてぃ・ユニバーサルデザインゆにばーさるでざいん)を判別はんべつできる
  • ヒューマンインタフェース(GUI・CUI・VUI・NUI)の違ちがいを使つかいこなせる
  • 画像がぞう形式けいしき(JPEG・PNG・GIF・SVG)の特徴とくちょうと用途ようとを判別はんべつして、用途ようとから最適さいてき形式けいしきを選えらべる
  • 音声おんせい・動画どうが形式けいしき(MP3・MP4・WAV・MPEG 等ひとし)と圧縮あっしゅく方式ほうしき(可逆かぎゃく・非ひ可逆かぎゃく)を使つかいこなせる
  • RGB/CMYK の使つかい分わけ、dpi/ppi の違ちがいを説明せつめいできる
  • VR・AR・MR・XR・CGの違ちがいを判別はんべつして、具体ぐたい例れいを挙あげられる

試験しけんでは: 「〜を作つくりたい場合ばあい、どの形式けいしき/技術ぎじゅつを選えらぶか」の形かたちで問とわれる。たとえば「ロゴを拡大かくだい縮小しゅくしょうしても劣化れっかさせたくない → SVG」「印刷いんさつ入にゅう稿こう → CMYK」のように、ゴール → 道具どうぐの逆ぎゃく引ひきができると得点とくてんしやすい。

1. 情報じょうほうデザインの原則げんそく

「情報じょうほうデザイン」とは、情報じょうほうを受うけ手てに正ただしく・速はやく・気持きもちよく伝つたえるための設計せっけい。Web ページ、アプリ、駅えきの案内あんない板ばん、図書館としょかんの本ほんの並ならび——すべて情報じょうほうデザインの対象たいしょうです。たとえば駅えきのホームで「行ゆき先さき → 種別しゅべつ → 時刻じこく」の順じゅんで書かくか「時刻じこく → 行ゆき先さき」の順じゅんで書かくかは、乗客じょうきゃくがどう情報じょうほうを探さがすかに合あわせて設計せっけいされています。この節ふしでは、その基本きほん原則げんそくを見みていきます。

1.1 情報じょうほうデザインとは

情報じょうほうデザインは、情報じょうほうを受うけ手てが理解りかいしやすいように整理せいり・構造こうぞう化か・視覚しかく化かする設計せっけい手法しゅほうです。単たんなる「見みた目めを綺麗きれいにする」ことではなく、何なにをどの順じゅんで見みせるか、どう分類ぶんるいするか、誰だれに最適さいてき化かするかまでを含ふくみます。

具体ぐたい例れい: ECサイトで商品しょうひんを「人気にんき順じゅん」「価格かかく順じゅん」「新着しんちゃく順じゅん」で並ならべ替かえられるのは情報じょうほうデザインの一環いっかん。同おなじ商品しょうひんデータでも、並ならびの軸じくを変かえるだけで利用りよう者しゃの行動こうどうは大おおきく変かわります。また、地震じしん速報そくほうアプリが「最もっとも重要じゅうような震度しんど情報じょうほう」を大おおきく、「詳細しょうさい地域ちいき」を小ちいさく表示ひょうじするのも、情報じょうほうの重要じゅうよう度どに応おうじた視覚しかく的てき階層かいそうという情報じょうほうデザインの原則げんそく。

ポイント: 情報じょうほうデザインは「伝つたえたいこと」より「受うけ手てがどう使つかうか」を軸じくに考かんがえる。開発かいはつ者しゃ視点してんでなく利用りよう者しゃ視点してんで情報じょうほうを組くみ立たてるのが本質ほんしつ。

1.2 LATCH の 5 原則げんそく

情報じょうほうをどう並ならべるかを考かんがえるとき、5 つの軸じくがあります。頭文字かしらもじを取とって LATCH(ラッチ)と呼よばれ、情報じょうほうアーキテクトのRichard Saul Wurmanが提唱ていしょうしたものです。「何なんで並ならべると最もっとも使つかいやすいか」を考かんがえる出発しゅっぱつ点てんになります。

略りゃく英語えいご意味いみ例れい
LLocation場所ばしょ地図ちず、フロアマップ、店舗てんぽ検索けんさく
AAlphabetアルファベット順じゅん / 五十音ごじゅうおん順じゅん辞書じしょ、人名じんめいリスト、書架しょか
TTime時間じかん年表ねんぴょう、予定よてい表ひょう、投稿とうこう日時にちじ順じゅん SNS
CCategoryカテゴリショッピングサイトの分類ぶんるい、図書としょ十じゅう進しん分類ぶんるい
HHierarchy階層かいそう・ランクランキング、組織そしき図ず、売上うりあげ順じゅん

実例じつれいの使つかい分わけ: 本屋ほんやでは「カテゴリ(ジャンル)→ 著者ちょしゃ名めい(アルファベット)」の 2 段階だんかい、アマゾンでは「カテゴリ → 人気にんき順じゅん(ランク)」、スマホの連絡れんらく先さきは「五十音ごじゅうおん順じゅん」、災害さいがい情報じょうほうサイトは「時間じかん(発生はっせい順じゅん)」。扱あつかう情報じょうほうの性質せいしつによって最適さいてきな軸じくが違ちがうのがポイントです。

覚おぼえ方かた: 「LATCH(ラッチ)で情報じょうほうの扉とびらを開あける」 と覚おぼえる。Location / Alphabet / Time / Category / Hierarchy の 5 つ。

1.3 UX(ユーザエクスペリエンス)

製品せいひん・サービスを利用りようするときに利用りよう者しゃが感かんじること全体ぜんたいが UX(User Experience)。「使つかいやすい」だけでなく、「気持きもちいい」「信頼しんらいできる」「また使つかいたい」まで含ふくむ概念がいねんです。よく混同こんどうされる UI(User Interface)は、UX を実現じつげんするための接点せってん(画面がめん・ボタン・音声おんせい等とう)のこと。UI は道具どうぐ、UX は体験たいけんと覚おぼえると整理せいりしやすい。

用語ようご意味いみ
UX(User Experience)利用りよう者しゃが得える総合そうごう的てきな体験たいけん(使つかいやすさ + 感情かんじょう + 信頼しんらい)
UI(User Interface)利用りよう者しゃとシステムの接点せってん(画面がめん・ボタン・音声おんせい等とう)
CX(Customer Experience)顧客こきゃく体験たいけん全般ぜんぱん(購買こうばい〜サポートまで)
ユーザビリティゆーざびりてぃ使つかいやすさの度合どあい(ISO 9241-11 で「有効ゆうこうさ・効率こうりつ・満足まんぞく度ど」と定義ていぎ)
HCD(Human-Centered Design)人間にんげん中心ちゅうしん設計せっけい。利用りよう者しゃを起点きてんに設計せっけいするプロセス(ISO 9241-210)

具体ぐたい例れい: 飛行機ひこうきのチケット予約よやくサイトで「ボタンが押おしやすい(UI が良よい)」だけでは UX は完結かんけつしません。検索けんさく結果けっかが分わかりやすい / 決済けっさいが安心あんしん / メール案内あんないが丁寧ていねい まで含ふくめて初はじめて UX が良よいと評価ひょうかされます。UI は UX の一部いちぶ要素ようそ。

引ひっかけ: 「UI を良よくすれば UX も良よくなる」は半分はんぶん正解せいかい・半分はんぶん間違まちがい。UI は UX の一部いちぶにすぎず、遅おそいサーバ・不親切ふしんせつなサポート・分わかりにくい料金りょうきん体系たいけいがあれば UX は悪わるいまま。UX ≧ UI の包含ほうがん関係かんけいを意識いしきする。

1.4 アクセシビリティとユニバーサルデザイン

アクセシビリティあくせしびりてぃ(Accessibility)は、高齢こうれい者しゃや障害しょうがい者しゃを含ふくめた「誰だれもが」情報じょうほうやサービスにアクセスできる度合どあい。特とくに Web の場合ばあい、視覚しかく障害しょうがい者しゃ・聴覚ちょうかく障害しょうがい者しゃ・色覚しきかく特性とくせいのある人ひと・高齢こうれい者しゃ・操作そうさが不自由ふじゆうな人ひと——すべてが対象たいしょう。公的こうてき機関きかんサイトでは法令ほうれいで義務ぎむ化かされている国くにも多おおく、日本にほんでも JIS X 8341-3 で基準きじゅんが定さだめられています。

用語ようご意味いみ
Web アクセシビリティうぇぶあくせしびりてぃWeb コンテンツが誰だれもが利用りよう可能かのうであるか。JIS X 8341-3 で規格きかく化か
ユニバーサルデザインゆにばーさるでざいん最初さいしょから誰だれもが使つかえる設計せっけいを目指めざす考かんがえ方かた(7 原則げんそく)
バリアフリーばりあふりー既存きそんの障壁しょうへきを取とり除のぞくアプローチ(後ごから対応たいおう)
WAI-ARIAHTML に補助ほじょ情報じょうほうを付加ふかしてスクリーンリーダー対応たいおうを強化きょうかする仕様しよう
altテキスト画像がぞうの代替だいたいテキスト。<img alt="..."> で指定してい

具体ぐたい例れい: Web サイトで画像がぞうに alt テキストを付つけるのはアクセシビリティの基本きほん。視覚しかく障害しょうがい者しゃのスクリーンリーダーが画像がぞう内容ないようを読よみ上あげるために必要ひつよう。また、リンクを色いろだけで区別くべつしない(下線かせんも付つける)のは色覚しきかく特性とくせいへの配慮はいりょ。動画どうがに字幕じまくを付つけるのは聴覚ちょうかく障害しょうがい者しゃ対応たいおう。

引ひっかけ: アクセシビリティ vs ユーザビリティ の違ちがい。ユーザビリティは「健常けんじょうな利用りよう者しゃが使つかいやすいか」、アクセシビリティは「誰だれでも使つかえるか」。アクセシビリティの範囲はんいがより広ひろく、特とくに障害しょうがい者しゃ対応たいおうを明示めいじ的てきに含ふくむ。

頻出ひんしゅつ: ユニバーサルデザイン(事前じぜん対応たいおう) vs バリアフリー(事後じご対応たいおう)。「最初さいしょから使つかえる設計せっけい」= UD、「障壁しょうへきを取とり除のぞく」= バリアフリー。駅えきのエレベータ設置せっちはバリアフリー、自動じどうドアの幅はばを車椅子くるまいす対応たいおうで設計せっけいするのはユニバーサルデザイン。

2. ユーザインタフェース設計せっけい

コンピュータと人間にんげんのやりとりは、入力にゅうりょく手段しゅだんで大おおきく分類ぶんるいされます。昔むかしはコマンドを打うつしかなかった(CUI)ところから、マウスで操作そうさする GUI、声こえで指示しじする VUI、指ゆびで触さわる NUI へと進化しんかしてきました。試験しけんではこの系統けいとうと、GUI を構成こうせいする部品ぶひん名めいが頻出ひんしゅつします。

2.1 インタフェースの種類しゅるい

種類しゅるい正式せいしき名めい入力にゅうりょく手段しゅだん例れい
CUICharacter User Interfaceキーボード(文字もじ)Linux ターミナル、Windows コマンドプロンプト
GUIGraphical User Interfaceマウス・キーボードWindows、macOS、Web ブラウザ
VUIVoice User Interface声こえAmazon Alexa、Google Assistant、Siri
NUINatural User Interfaceタッチ・ジェスチャ・視線しせんスマホ、タブレット、Kinect

使つかい分わけの実例じつれい: プログラマが大量たいりょうファイルを一括いっかつ操作そうさしたいときは CUI(コマンドで書かける)、一般いっぱん利用りよう者しゃが PC を使つかうときは GUI(直感ちょっかん的てき)、手しゅが塞ふさがっている料理りょうり中ちゅうは VUI(Alexa に「タイマー 3 分ぶん」)、スマホは NUI(指ゆびでスワイプ)。状況じょうきょうで使つかい分わけるのがポイント。

覚おぼえ方かた: Command(文字もじ) / Graphical(絵え) / Voice(声こえ) / Natural(自然しぜん動作どうさ) の頭文字かしらもじ。系譜けいふは CUI → GUI → NUI/VUI の順じゅんで、より直感ちょっかん的てき・より自然しぜんへ進化しんかしてきた。

2.2 GUI の構成こうせい要素ようそ

GUI は部品ぶひん(ウィジェット)の組み合わせくみあわせで画面がめんを構成こうせいします。試験しけんでは「ラジオボタン vs チェックボックス」の混同こんどう問題もんだいが定番ていばんで、毎年まいとしのように出題しゅつだいされます。

要素ようそ役割やくわり例れい
ウィンドウアプリごとの表示ひょうじ領域りょういきブラウザの各かくタブ
メニューめにゅー(メニューバー / プルダウン)機能きのうの一覧いちらんから選択せんたくWord の「ファイル」「編集へんしゅう」…
ダイアログだいあろぐボックス確認かくにん・入力にゅうりょく用ようの小しょう窓まど「保存ほぞんしますか?」のポップアップ
アイコンあいこん機能きのうを絵えで表現ひょうげんデスクトップのアプリ・ごみ箱ばこ
ラジオボタン複数ふくすうの選択肢せんたくしから 1 つ選えらぶ性別せいべつ(男おとこ/女おんな)、支払しはらい方法ほうほう
チェックボックス複数ふくすうの選択肢せんたくしから 複数ふくすう選えらべる好すきな食べ物たべもの(複数ふくすう選択せんたく可か)
プルダウン(ドロップダウン)リストから選択せんたく国名こくめい・都道府県とどうふけんの選択せんたく
テキストボックス文字もじ入力にゅうりょく欄らん検索けんさくボックス、フォーム
スライダー連続れんぞく値ちの指定してい音量おんりょう・明あかるさの調整ちょうせい

頻出ひんしゅつ引ひっかけ: ラジオボタン = 1 つだけ(車しゃのラジオで同時どうじに 2 局きょく聞きけないのと同おなじ発想はっそう)、チェックボックス = 複数ふくすう可か。逆ぎゃくに問とわれることが多おおい定番ていばんの引ひっかけ。

2.3 Web デザインの基本きほん

Web ページは 3 つの言語げんご(HTML・CSS・JavaScript)で構成こうせいされます。HTML は骨格こっかく・CSS は見みた目め・JavaScript は動うごき、と役割やくわり分担ぶんたんされていて、この 3 つが分業ぶんぎょうすることで保守ほしゅしやすい作づくりになります。近年きんねんはスマホとパソコンの両方りょうほうで見みることが増ふえたため、画面がめん幅はばに応おうじて自動じどうでレイアウトを変かえるレスポンシブデザインが主流しゅりゅうです。

要素ようそ役割やくわり
HTML文書ぶんしょの構造こうぞうを記述きじゅつ(見出しみだし・段落だんらく・リンク等とう)
CSS(Cascading Style Sheets)見みた目め(色しょく・配置はいち・フォント・サイズ)を定義ていぎ
JavaScriptブラウザ上じょうで動的どうてき処理しょり(アニメ・検索けんさく候補こうほ・フォーム検証けんしょう)
レスポンシブデザインPC/スマホ/タブレットで自動的じどうてきにレイアウト調整ちょうせい
CMS(Content Management System)WordPress 等ひとし、コンテンツ更新こうしんを支援しえんするシステム

具体ぐたい例れい: 同おなじ Web サイトでも、PC で見みると横並よこならび 3 カラム、スマホで見みると縦たて 1 列れつに自動じどうで切きり替かわるのはレスポンシブデザイン。CSS の メディアクエリで画面がめん幅はばを判定はんていして切きり替かえています。

引ひっかけ: HTML だけ変かえれば見みた目めも変かわるは誤あやまり。HTML は構造こうぞう、CSS は見みた目めと役割やくわりが分わかれている。色いろを変かえたい時ときに HTML をいじる(<font> タグ等とう)のは古ふるいやり方かたで、現代げんだいでは CSS で一括いっかつ管理かんりするのが標準ひょうじゅん。

3. マルチメディアデータの符号ふごう化か

音声おんせい・画像がぞう・動画どうがをコンピュータが扱あつかえる形かたちにするには、アナログな情報じょうほうを数値すうちの列れつ(0 と 1)に変換へんかんする必要ひつようがあります。この変換へんかんを符号ふごう化か(エンコーディング)と呼よびます。同おなじ音声おんせいでも「そのまま数値すうち化か」するか「聞きこえない部分ぶぶんを捨すてて小ちいさく」するかで、ファイルサイズも用途ようとも変かわってきます。試験しけんでは形式けいしき名めいと用途ようとの対応たいおうが中心ちゅうしんに問とわれます。

3.1 音声おんせいの符号ふごう化か

アナログ音声おんせい(連続れんぞく波は)をデジタル化かする流ながれは、標本ひょうほん化か(サンプリング)→ 量子りょうし化か → 符号化ふごうか の 3 段階だんかい。標本ひょうほん化かは 1 秒びょうを何なに等分とうぶんするか(時間じかん方向ほうこう)、量子りょうし化かは音おとの大おおきさを何なに段階だんかいで表現ひょうげんするか(振幅しんぷく方向ほうこう)、符号ふごう化かはそれを 0/1 のビット列れつに落おとす工程こうていです。CD の音質おんしつは標本ひょうほん化か 44.1kHz・量子りょうし化か 16bit、これが音声おんせいデジタル化かの「基準きじゅん値ち」として覚おぼえておくと便利べんりです。

用語ようご意味いみ
PCMPulse Code Modulation。標準ひょうじゅん的てきな音声おんせいデジタル化か方式ほうしき
サンプリング周波数サンプリングしゅうはすう1 秒びょう間かんに標本ひょうほん化かする回数かいすう(Hz)。CD は 44.1kHz
量子りょうし化かビット数すう1 標本ひょうほんを表現ひょうげんするビット数すう。CD は 16bit
ビットレート1 秒びょうあたりのデータ量りょう(kbps)。音質おんしつとサイズのトレードオフ

形式けいしき別べつの特徴とくちょう:

形式けいしき特徴とくちょう圧縮あっしゅく用途ようと
WAV非ひ圧縮あっしゅく PCMなし音楽おんがく制作せいさくの原盤げんばん、サイズ大だい
MP3非可逆圧縮ひかぎゃくあっしゅくの代表だいひょう非ひ可逆かぎゃく(人間にんげんが聴きき取とれない音おとを削除さくじょ)音楽おんがく配信はいしん、スマホ
AACMP3 改良かいりょう版ばん、同どうビットレートで高こう音質おんしつ非ひ可逆かぎゃくiTunes、YouTube
FLAC可逆かぎゃく圧縮あっしゅくの音声おんせい形式けいしき可逆かぎゃく(音質おんしつ劣化れっかなし)ハイレゾ音楽おんがく
MIDI演奏えんそう情報じょうほうを数値すうち化か(楽譜がくふの符号ふごう化か)データ小しょう電子でんし楽器がっき・着ちゃくメロ

MIDI の独自どくじ性せい: MIDI は「音おとそのもの」ではなく「演奏えんそう情報じょうほう(この音おとを / この長ながさで / この強つよさで)」を記録きろくする形式けいしき。楽譜がくふをデジタル化かしたもの、と考かんがえるとわかりやすい。だからファイルサイズが極端きょくたんに小ちいさい(数かず KB)のに、長ながい曲きょくを表現ひょうげんできる。

引ひっかけ: 可逆かぎゃく圧縮あっしゅく(FLAC・WAV)は音質おんしつ劣化れっかなし、非ひ可逆かぎゃく圧縮あっしゅく(MP3・AAC)は音質おんしつ劣化れっかあり。MP3 は人間にんげんの耳みみに聞きこえにくい部分ぶぶんを捨すててサイズを小ちいさくする(心理しんり音響おんきょうモデル)。一度いちど捨すてられた情報じょうほうは戻もどらないので、MP3 を WAV に再さい変換へんかんしても元もとの音質おんしつには戻もどらない。

3.2 画像がぞうの符号ふごう化か

画像がぞうの表現ひょうげん方法ほうほうは大おおきく 2 つ:ラスタ(ピクセルの集合しゅうごう)とベクタ(数式すうしきで表現ひょうげん)。この違ちがいが「拡大かくだいしても劣化れっかするか」を決きめます。試験しけんでは用途ようとに応おうじた形式けいしき選えらびがそのまま問とわれます。

ラスタ(ビットマップ)とベクタ

方式ほうしき特徴とくちょう拡大かくだい時じ例れい
ラスタ(ビットマップ)画素がそ(ピクセル)の集合しゅうごうぼやける・ジャギー(ギザギザ)発生はっせいJPEG、PNG、GIF、BMP
ベクタ数式すうしきで線せんや図形ずけいを表現ひょうげん劣化れっかなし(何なん倍ばいでも綺麗きれい)SVG、図面ずめん CAD、フォント

具体ぐたい例れい: ロゴをラスタ(PNG)で保存ほぞんすると、印刷いんさつ時じに拡大かくだいしたときにぼやけます。ベクタ(SVG)で保存ほぞんすれば、名刺めいしサイズでも看板かんばんサイズでも同おなじ線せんのシャープさで印刷いんさつできます。このため会社かいしゃのロゴ・アイコン類るいはベクタで作つくるのが鉄則てっそく。写真しゃしんはそもそも連続れんぞく的てきな色いろの変化へんかなので、ラスタでしか表現ひょうげんできません。

画像がぞうファイル形式けいしき

形式けいしき圧縮あっしゅく透過とうか色いろ数すう特徴とくちょう・用途ようと
JPEG非ひ可逆かぎゃく❌フルカラー写真しゃしん向むき、小ちいさく保存ほぞんできる
PNG可逆かぎゃく✅フルカラー + αイラスト・ロゴ向むき、透過とうか対応たいおう
GIF可逆かぎゃく✅256 色いろまでアニメ GIF、単純たんじゅんなイラスト
SVG—✅—ベクタ、ロゴ・図面ずめん。拡大かくだい劣化れっかなし
BMP非ひ圧縮あっしゅく❌フルカラーWindows 標準ひょうじゅん、サイズ大だい
TIFF可逆かぎゃく/非ひ可逆かぎゃく切替きりかえ✅フルカラー印刷いんさつ・高こう品質ひんしつ用途ようと
WebP可逆かぎゃく/非ひ可逆かぎゃく✅フルカラーGoogle 提案ていあん、Web で高こう圧縮あっしゅく

使つかい分わけの実例じつれい:

  • 風景ふうけい写真しゃしん → JPEG(サイズ小しょう、画質がしつ十じゅう分ふん)
  • 会社かいしゃロゴ・アイコン → SVG(ベクタ、拡大かくだい劣化れっかなし)。代替だいたいに PNG(ラスタだが透過とうかあり)
  • 透過とうか背景はいけいが必要ひつようなイラスト → PNG
  • 単純たんじゅんなアニメーション → GIF またはAPNG
  • 印刷いんさつ用よう高画質こうがしつ → TIFF

頻出ひんしゅつ: 「写真しゃしん → JPEG」「ロゴ・透過とうか → PNG」「アニメ → GIF」「拡大かくだい自在じざい → SVG」 の 4 点てんセットを暗記あんき。特とくに 「写真しゃしんを PNG で保存ほぞんするとファイルサイズが巨大きょだい化かする」(非ひ可逆かぎゃく圧縮あっしゅくの恩恵おんけいがないため)という引ひっかけに注意ちゅうい。

色いろの表現ひょうげん

画面がめんのピクセルは光こうの 3 原色げんしょく RGB(赤あか・緑みどり・青あお)を重かさねて表現ひょうげんし、印刷物いんさつぶつはインクの 4 原色げんしょく CMYK(シアン・マゼンタ・イエロー・ブラック)を重かさねて表現ひょうげんします。両者りょうしゃは混色しょくの仕組しくみが正せい反対はんたいで、画面がめんで見みた色いろと印刷いんさつした色いろが微妙びみょうに違ちがうのはこのためです。

方式ほうしき用途ようと混色しょくの仕組しくみ構成こうせい
RGB画面がめん表示ひょうじ(ディスプレイ・LED)加法かほう混色しょく(光こうを足たすほど明あかるく→白しろ)R(赤あか) + G(緑みどり) + B(青あお)
CMYK印刷いんさつ(プリンタ・雑誌ざっし)減法げんぽう混色しょく(インクを足たすほど暗くらく→黒くろ)C(シアン) + M(マゼンタ) + Y(黄き) + K(黒くろ)
HSB / HSV色いろ選択せんたく UI色相しきそう・彩いろどり度ど・明度めいどで指定していH(色相しきそう) + S(彩いろどり度ど) + V/B(明度めいど)

RGB(加法かほう混色しょく)

画面がめん:光ひかりを足たすほど明あかるく

RGB結果けっか
●●○黄
●○●マゼンタ
○●●シアン
●●●白

RGB すべて足たすと白しろ。用途ようと: ディスプレイ・LED

CMYK(減法げんぽう混色しょく)

印刷いんさつ:インクを足たすほど暗くらく

CMY結果けっか
○○○白
●●○青
●○●緑
●●●黒(に近ちかづく)

3 色いろ重かさねると黒くろ。用途ようと: プリンタ・印刷いんさつ

頻出ひんしゅつ引ひっかけ: RGB は「光ひかり」、CMYK は「インク」。光ひかりは足たすほど明あかるく(最大さいだいは白しろ)なるので「加法かほう」、インクは重かさねるほど暗くらく(最大さいだいは黒くろ)なるので「減法げんぽう」。画面がめん = RGB、印刷いんさつ = CMYK で覚おぼえる。

解像度かいぞうどと階かい調ちょう

  • 解像度かいぞうど — 単位たんいあたりの画素がそ数すう。画像がぞうの細こまかさを表あらわす
    • dpi(dot per inch) — 印刷物いんさつぶつの密度みつど。1 インチあたりのドット数すう。印刷いんさつでは350dpi が一般いっぱん的てき基準きじゅん
    • ppi(pixels per inch) — 画面がめんの密度みつど。1 インチあたりのピクセル数すう。Retina ディスプレイは約やく 300ppi
  • 階かい調ちょう(bit 深度しんど) — 1 画素がそが表現ひょうげんできる色いろ数すう
    • 24 bit フルカラー = RGB 各かく 8bit = 約やく 1677 万まん色しょく(一般いっぱん的てきな Web 画像がぞう)
    • 30 bit = RGB 各かく 10bit = 約やく 10 億おく色しょく(HDR 映像えいぞう)

引ひっかけ: dpi と ppi は似にているが別べつ。dpi は印刷いんさつ(プリンタのインク粒つぶ密度みつど)、ppi は画面がめん(ディスプレイの画素がそ密度みつど)。両方りょうほうとも「1 インチあたり」だが測はかる対象たいしょうが違ちがう。

3.3 動画どうがの符号ふごう化か

動画どうがは静止せいし画が(フレーム)の連続れんぞくで、1 秒びょうに 30 枚まい程度ていどのペースで表示ひょうじして動うごきに見みせます。1 秒びょう 30 枚まいの 2 時間じかん映画えいがは 30 × 60 × 120 = 21.6 万まんフレーム。これをすべて非ひ圧縮あっしゅくで保存ほぞんするとファイルサイズが膨大ぼうだいになるため、フレーム間かんの差分さぶんだけ記録きろくするなどの圧縮あっしゅく技術ぎじゅつ(MPEG・H.264 等ひとし)が使つかわれます。

重要じゅうような区別くべつ: コーデック(圧縮あっしゅく方式ほうしき)とコンテナ(入いれ物もの)は別物べつもの。MP4 はコンテナ形式けいしきで、中身なかみのコーデックは H.264 だったり H.265 だったりします。MP4 ファイルが再生さいせいできないときはコーデック側がわの問題もんだいのことが多おおい。

形式けいしき種類しゅるい特徴とくちょう・用途ようと
MPEG(MPEG-2, MPEG-4)コーデック動画どうが圧縮あっしゅく規格きかく群ぐん
H.264コーデックMPEG-4 AVC、Blu-ray・YouTube の主流しゅりゅう
H.265(HEVC)コーデック4K/8K 対応たいおう、H.264 より高こう圧縮あっしゅく
MP4コンテナ映像えいぞう + 音声おんせい + 字幕じまくを 1 ファイルに
AVIコンテナWindows 標準ひょうじゅんコンテナ
MOVコンテナMac(QuickTime)標準ひょうじゅん
WebMコンテナGoogle 提案ていあん、Web 動画どうが向むけ

頻出ひんしゅつ: MPEG(規格きかく群ぐん)/ MP4(コンテナ)は別物べつもの。MPEG という言葉ことばが出でてきたら「圧縮あっしゅく方式ほうしきの話はなし」、MP4 が出でてきたら「ファイル入いれ物ものの話はなし」。この 2 つの混同こんどうが典型てんけい的てきな引ひっかけ。

3.4 圧縮あっしゅく方式ほうしき

圧縮あっしゅくは大おおきく 可逆かぎゃく圧縮あっしゅく(戻もどせる)と 非ひ可逆かぎゃく圧縮あっしゅく(戻もどせない)の 2 つ。用途ようとによって使つかい分わけます。プログラムコードや文書ぶんしょは可逆かぎゃくでないと使つかえず(1 ビット違ちがえば動うごかない)、写真しゃしんや音楽おんがくは非ひ可逆かぎゃくでも人間にんげんには気きづかないレベルで圧縮あっしゅくできます。

方式ほうしき特徴とくちょう復元ふくげん例れい
可逆圧縮かぎゃくあっしゅく(Lossless)元もとデータに完全かんぜんに戻もどせる100% 復元ふくげんZIP、PNG、GIF、FLAC
非可逆圧縮ひかぎゃくあっしゅく(Lossy)データの一部いちぶを捨すてて小ちいさくする元もとには戻もどらないJPEG、MP3、AAC、H.264

使つかい分わけの鉄則てっそく:

  • プログラム・文書ぶんしょ・ロゴ(1 バイトも欠かけてはいけない) → 可逆かぎゃく(ZIP・PNG)
  • 写真しゃしん・音楽おんがく・動画どうが(人間にんげんの知覚ちかく限界げんかいを超こえる部分ぶぶんは捨すててよい) → 非ひ可逆かぎゃく(JPEG・MP3・MP4)

引ひっかけ: PNG は可逆かぎゃく、JPEG は非ひ可逆かぎゃく。写真しゃしんを PNG で保存ほぞんすると、ファイルサイズが JPEG の 5〜10 倍ばいになる(非ひ可逆かぎゃく圧縮あっしゅくの恩恵おんけいを受うけられないため)。写真しゃしんは JPEG、イラスト・ロゴは PNG、が鉄則てっそく。

4. マルチメディアの応用おうよう

コンピュータグラフィックス(CG)は、実写じっしゃではなくコンピュータで描えがいた画像がぞう・映像えいぞうの総称そうしょう。2D CG(イラスト・漫画まんが)と 3DCG(立体りったい・映画えいが・ゲーム)があります。そして近年きんねん、CG を 現実げんじつと融合ゆうごうさせる技術ぎじゅつが発展はってんし、VR・AR・MR といった新あたらしいメディアが生うまれました。試験しけんではそれぞれの違ちがいと具体ぐたい例れいが必かならず問とわれます。

4.1 3D・CG・新しんメディア

用語ようご正式せいしき名めい意味いみ
CGComputer Graphicsコンピュータで描画びょうがした画像がぞう・映像えいぞう
3DCG3D Computer Graphics立体りったい的てきな CG(ゲーム・映画えいが・建築けんちくプレゼン)
VRVirtual Reality仮想かそう現実げんじつ(ヘッドセットで没入ぼつにゅう・現実げんじつが見みえない)
ARAugmented Reality拡張かくちょう現実げんじつ(現実げんじつに情報じょうほうを重かさねる。ポケモン GO、スマホ翻訳ほんやく)
MRMixed Reality複合ふくごう現実げんじつ(現実げんじつ物体ぶったいと仮想かそう物体ぶったいが相互そうご作用さよう。HoloLens)
XRExtended RealityVR/AR/MR の総称そうしょう
モーションキャプチャ—人ひとの動うごきをセンサで取得しゅとくして CG キャラに反映はんえい
レンダリング—3D モデルから 2D 画像がぞうを生成せいせいする工程こうてい

VR/AR/MR の使つかい分わけ:

  • VR ヘッドセット(Meta Quest 等ひとし)で現実げんじつが完全かんぜんに遮断しゃだんされた仮想かそう空間くうかんに入はいる → VR
  • スマホカメラ越ごしに現実げんじつにポケモンが立たっているように見みえる → AR
  • HoloLens で現実げんじつの机つくえに置おいた仮想かそうボールを手てで動うごかせる → MR(物理ぶつり相互そうご作用さようあり)

具体ぐたい例れい: 産業さんぎょうでの活用かつようも広ひろがっている。建築けんちく会社かいしゃはVR で完成かんせい前まえの建物たてものを顧客こきゃくに見みせ、自動車じどうしゃ整備せいび士しはAR で部品ぶひんの位置いち情報じょうほうをメガネに表示ひょうじし、医師いしはMR で患者かんじゃの体からだに CT 画像がぞうを重かさねて手術しゅじゅつを訓練くんれんしている。

現実げんじつ度ど名称めいしょう特徴とくちょう例
100%現実げんじつそのままの世界せかい(仮想かそう 0%)—
高AR(拡張かくちょう現実げんじつ)現実げんじつ + 情報じょうほう重かさねポケモン GO(スマホ越ごし)
中MR(複合ふくごう現実げんじつ)現実げんじつ物体ぶったいと仮想かそう物体ぶったいが相互そうご作用さようHoloLens
低VR(仮想かそう現実げんじつ)完全かんぜん仮想かそう(仮想かそう 100%)VR ヘッドセット(Meta Quest 等ひとし)

XR(Extended Reality)= VR / AR / MR の総称そうしょう。

頻出ひんしゅつ引ひっかけ: VR は完全かんぜんに別世界べっせかい(現実げんじつが見みえない)、AR は現実げんじつ + 情報じょうほう重かさね(ポケモン GO のように現実げんじつカメラ越ごしに仮想かそう物体ぶったい)、MR は AR の発展はってん形がたで現実げんじつ物体ぶったいと仮想かそう物体ぶったいが相互そうご作用さよう(テーブルに置おいた仮想かそうボールが本物ほんものの手てで動うごかせる)。

4.2 解像度かいぞうど規格きかく

動画どうが・テレビの映像えいぞう規格きかくは画素がそ数すうで区別くべつされます。数字すうじが大おおきいほど高こう精細せいさいで、同時どうじにデータ量りょうも増ふえるため、通信つうしん環境かんきょうや表示ひょうじ装置そうちに合あわせて選えらぶ必要ひつようがあります。

規格きかく画素がそ数すう用途ようと
SD720×480アナログ放送ほうそう世代せだい
HD1280×720旧きゅう地上ちじょうデジタル、低てい画質がしつ配信はいしん
フル HD1920×1080Blu-ray、主流しゅりゅう配信はいしん画質がしつ
4K(UHD)3840×2160高級こうきゅうテレビ、高画質こうがしつ配信はいしん
8K7680×4320プロ映像えいぞう、最さい上位じょういテレビ

覚おぼえ方かた: 4K = フル HD の 4 倍ばい(縦横じゅうおう 2 倍ばいずつで面積めんせき 4 倍ばい)、8K = 4K のさらに 4 倍ばい。「4K」の K は約やく 4000(3840)を指さす。

4.3 著作ちょさく権けん保護ほご技術ぎじゅつ

デジタルコンテンツはコピーが簡単かんたんなため、著作ちょさく者しゃの権利けんりを守まもるための著作ちょさく権けん保護ほご技術ぎじゅつが用意よういされています。音楽おんがく・動画どうが・電子でんし書籍しょせきなどで使つかわれており、試験しけんでは略語りゃくごと用途ようとの対応たいおうが問とわれます。

技術ぎじゅつ正式せいしき名めい用途ようと
DRMDigital Rights Managementデジタルコンテンツの著作ちょさく権けん保護ほご全般ぜんぱん(音楽おんがく・動画どうが・電子でんし書籍しょせき)
CPRMContent Protection for Recordable MediaDVD・SD カード等とう録画ろくが媒体ばいたいのコピー制限せいげん
電子でんし透すかし(Watermark)—画像がぞう・音声おんせいに目めに見みえない識別しきべつ情報じょうほうを埋め込みうめこみ、不正ふせいコピー追跡ついせき
PDFPortable Document Formatレイアウトを維持いじして配布はいふ。パスワード・印刷いんさつ制限せいげんも設定せってい可か

具体ぐたい例れい: Netflix や Amazon Prime Video で動画どうがをダウンロードしても他たのアプリで再生さいせいできないのは DRM による保護ほご。地ちデジの録画ろくが番組ばんぐみが特定とくてい機器ききでしか再生さいせいできないのは CPRM の仕組しくみ。有料ゆうりょう写真しゃしん素材そざいサイトの見本みほん画像がぞうにうっすら文字もじが重かさなっているのは電子でんし透すかしの一種いっしゅ。

頻出ひんしゅつ: DRM は「コンテンツ全般ぜんぱん」の保護ほごの総称そうしょう、CPRM は「録画ろくが媒体ばいたい」専用せんようのコピー制限せいげん。

📋 章しょう末まつまとめ

最さい重要じゅうようポイント 10 連発れんぱつ

  1. LATCH の 5 原則げんそく — 場所ばしょ・アルファベット・時間じかん・カテゴリ・階層かいそう
  2. UX ≧ UI — UX は体験たいけん全体ぜんたい、UI は接点せってん(UI は UX の一部いちぶ)
  3. アクセシビリティ(誰だれでも)vs ユーザビリティ(使つかいやすさ)
  4. CUI / GUI / VUI / NUI — 文字もじ / 絵え / 声こえ / 自然しぜん動作どうさ
  5. ラジオボタン = 1 つ、チェックボックス = 複数ふくすう(定番ていばん引ひっかけ)
  6. JPEG(写真しゃしん・非ひ可逆かぎゃく) vs PNG(イラスト・可逆かぎゃく・透過とうか) vs SVG(ベクタ・拡大かくだい自在じざい)
  7. RGB(画面がめん・加法かほう混色しょく) vs CMYK(印刷いんさつ・減法げんぽう混色しょく)
  8. 可逆かぎゃく圧縮あっしゅく vs 非ひ可逆かぎゃく圧縮あっしゅく — プログラムは可逆かぎゃく、写真しゃしん・音楽おんがくは非ひ可逆かぎゃくで可か
  9. VR(仮想かそう)/ AR(拡張かくちょう・ポケモン GO)/ MR(複合ふくごう・HoloLens)
  10. MPEG(コーデック・圧縮あっしゅく規格きかく) vs MP4(コンテナ・入いれ物もの) 混同こんどう注意ちゅうい

出題しゅつだい傾向けいこうのコツ

  • ファイル形式けいしきはゴールから逆ぎゃく引びき(「ロゴを拡大かくだいしても綺麗きれいに」→ SVG、「写真しゃしんを軽かるく」→ JPEG、「透過とうかのイラスト」→ PNG)
  • VR/AR/MR は具体ぐたい例れいセットで覚おぼえる(ポケモン GO = AR、Meta Quest = VR、HoloLens = MR)
  • UI/UX は「UI は道具どうぐ、UX は体験たいけん」と一言ひとことで言いえるように
  • 加法かほう混色しょく = RGB = 画面がめん、減法げんぽう混色しょく = CMYK = 印刷いんさつ
  • 可逆かぎゃく vs 非ひ可逆かぎゃくは「データが戻もどるか」で判定はんてい

出典しゅってんシラバス: ITパスポート試験しけんシラバス Ver.6.5(2026年ねん1月つき・IPA公開こうかい)

この教材きょうざいは役やくに立たちましたか?

この章しょうの練れん習しゅう

ほかの分ぶん野やの練れん習しゅうもチェック

一いち問もん一いっ答とう

情報セキュリティ 一問一答

IT パスポート試験で最重要の情報セキュリティ分野から 20 問を厳選。CIA 3 要素から攻撃手法、暗号・認証、対策技術まで体系的に確認できます。

一いち問もん一いっ答とう

コンピュータシステム 一問一答

IT パスポート試験のテクノロジ系頻出テーマから 20 問を厳選。CPU/メモリから仮想化・クラウド・RAID・稼働率計算まで、ハードウェアとシステム構成の基礎を体系的に確認。

一いち問もん一いっ答とう

データベース 一問一答

IT パスポート試験のデータベース分野から 20 問を厳選。主キー/外部キー/正規化/SQL(SELECT・WHERE・JOIN)/ACID/索引まで体系的に確認。

一いち問もん一いっ答とう

ネットワーク 一問一答

IT パスポート試験のネットワーク分野から 20 問を厳選。LAN/WAN・Wi-Fi セキュリティ・TCP/IP・IP アドレス・DNS・HTTP/HTTPS・IoT 通信まで体系的に確認。

一いち問もん一いっ答とう

企業と法務 一問一答

IT パスポート試験のストラテジ系の基礎「企業と法務」から 20 問を厳選。経営組織・OR/IE・会計財務・知的財産権・労働関連法規まで体系的に確認。

一いち問もん一いっ答とう

経営戦略 一問一答

IT パスポート試験の頻出分野「経営戦略」から 20 問を厳選。経営分析フレームワーク・マーケティング・経営管理システム・技術戦略・ビジネスインダストリまで体系的に確認。

一いち問もん一いっ答とう

システム戦略と企画 一問一答

IT パスポート試験のストラテジ系「システム戦略と企画」から 20 問を厳選。情報システム戦略・業務プロセス改革・クラウドサービス・システム企画調達まで体系的に確認。

一いち問もん一いっ答とう

開発技術 一問一答

IT パスポート試験のマネジメント系「開発技術」から 20 問を厳選。開発プロセス・設計・テスト手法・アジャイル/スクラム・構成管理・UX デザインまで体系的に確認。

一いち問もん一いっ答とう

プロジェクトマネジメント 一問一答

IT パスポート試験のマネジメント系「プロジェクトマネジメント」から 20 問を厳選。PMBOK の 10 知識エリア・WBS・スケジュール管理・コスト見積り・リスク管理まで体系的に確認。

一いち問もん一いっ答とう

サービスマネジメントとシステム監査 一問一答

IT パスポート試験のマネジメント系「サービスマネジメントとシステム監査」から 20 問を厳選。ITIL・SLA/SLM・主要プロセス・サービスデスク・J-SOX・COSO まで体系的に確認。

一いち問もん一いっ答とう

基礎理論 一問一答

IT パスポート試験のテクノロジ系「基礎理論」から 20 問を厳選。2 進数変換・AND/OR/XOR・確率計算・文字コード・誤差・機械学習 3 分類まで確認。

一いち問もん一いっ答とう

アルゴリズムとプログラミング 一問一答

IT パスポート試験のテクノロジ系「アルゴリズムとプログラミング」から 20 問を厳選。配列/リスト/スタック/キュー/木/ハッシュ・探索/整列・計算量・HTML/JSON まで確認。

一いち問もん一いっ答とう

ソフトウェア 一問一答

IT パスポート試験のテクノロジ系「ソフトウェア」から 20 問を厳選。OS 機能・プロセス/スレッド・圧縮形式・表計算関数・OSS ライセンスまで確認。

問もん題だい集しゅう

IT パスポート 本試験形式 100 問

IT パスポート試験の全 14 章から出題する本試験準拠の総合問題集 100 問。ストラテジ 32 / マネジメント 18 / テクノロジ 50 の分野別配分・120 分で、実試験と同じスケールの実戦演習が可能。