高校「情報Ⅰ」単語帳 - 東京書籍「情報Ⅰ Step Forward!」 - 情報デザイン

1996年にアメリカの建築家・グラフィックデザイナー、リチャード・ワーマン(Richard Saul Wurman)氏が提唱した情報の整理法で、世の中に存在する様々な情報は5つの基準を用いて整理することができるとする考え方である。“LATCH” の名称は、“Location” (場所)、“Alphabet” (文字)、“Time” (時間)、“Category” (種類)、“Hierarchy” (階層)の頭文字を繋いだもの。

“Location” は「場所」「位置」という意味で、情報を空間的な位置関係に基づいて並べ替えたり配置したりグループ化する方法を指す。都道府県名を北から順に並べたり、画面に地図を表示してアイコンなどで位置を指し示すといった手法などが該当する。

“Alphabet” は情報を項目名や関連する属性のアルファベット順(辞書順、あいうえお順)で並べたりグループ化する方法を指す。図書館の書架で著者のあいうえお順に蔵書を整理したり、CD/DVD販売店やレンタルビデオ店で作品名やアーティスト名などの辞書順で陳列棚を構成する手法などが該当する。

“Time” は情報を時系列に並べたり、紐付けられた日付や時刻に基づいてグループ化する方法を指す。天気予報を時刻ごとに一列に並べたり、カレンダーから日付を選んでスケジュールを確認できるようにしたり、ブログの記事を新しい順に並べたり、展覧会や博物館の展示を時代や時系列に沿って並べる手法などが該当する。

“Category” は情報を種類や属性に応じてグループ化する方法を指す。小売店の売り場や陳列棚を同種あるいは類似の商品、互いに関連性の高い商品(鍋ものコーナーなど)、共通する性質や属性を持つ商品(冷凍食品など)ごとにまとめたり、Webサイトを同じ種類の情報を掲載しているページごとにカテゴリー分けする手法などが該当する。

“Hierarchy”は何らかの尺度に基づく順位や順序、階級などに従って情報を並べたりグループ化する方法を指す。サイズや価格など量的な基準による大小順の並べ方や分類、人気度や顧客満足度など評価に基づく順位付け(ランキング)、その他、重要度や使用頻度など何らかの量的データや尺度による上下や大小、高低によって情報を整理する手法が該当する。

米認知科学者ドナルド・ノーマン(Donald A. Norman)が提唱した概念で、人間がモノに接したときに知覚される、行動の手掛かりとなる要素のことである。典型的には物体の形状やデザインなど視覚的な要素だが、発する音(聴覚)や表面の質感(触覚)などが手掛かりとなる場合もある。

例えば、ゴミ箱の設計者が上部に小さな丸い穴の空いた形状にデザインすれば、特に文字や絵文字で案内しなくても、それがビンや缶、ペットボトルなどを入れるものであることが伝わる。これは意図されたシグニファイアだが、通路で大きなプラ容器を雨漏りの水受けに使っていたらゴミを捨てられてしまう、といった意図しない(あるいは意図に反する)シグニファイアが生じることもある。

類義語と語源

似た概念に「アフォーダンス」(affordance)がある。モノと人間の間に生じる相互作用の可能性を表し、人間が知覚するかどうかに関わらずモノが宿している性質であるとされる。ノーマンは当初、デザインによって適切にアフォーダンスの手掛かりを与えることの重要性を説いていたが、デザイン上の手掛かりがアフォーダンスであるとする解釈が広まってしまったため、改めてシグニファイアの概念を提唱した。

「シグニファイア」の語は記号学の用語「シニフィアン」(仏語 “signifiant”、英語では “signifier” )から取られたもので、記号学ではある特定の内容を指し示す文字による表記や発話などを意味する。それによって指し示された実際の内容である「シニフィエ」(signifier)と対になる概念である。

リレーショナルデータベースのテーブルやCSVファイルのように、一件のレコードの構成、各項目のデータ型や形式、項目の並び順、項目やレコードの区切り文字などが事前に決まっており、同じ構成のレコードの繰り返しとしてデータを列挙したものを指すことが多い。

ソフトウェアによって容易に読み込んで内容を認識させることができ、大量のデータを集計したり分析するのに適している。人間がそのまま眺めて読みやすい形式とは限らず、ソフトウェアによって抽出や集計を行ったり、見やすいよう整形したり、レポートなど別の形式へ変換してから人間に供されることが多い。

一方、Webページや電子メール等のメッセージ、ワープロソフトやプレゼンテーションソフトなどで作成した(見栄え重視の)文書ファイル、画像や音声、動画などのメディアデータといった、決まった形式や配置に従ってデータが並んでいるわけではない不定形なデータ群のことを「非構造化データ」(unstructured data)という。

Webページの構造化データ

WebページのHTMLコードは、Webブラウザにその文書の構造やレイアウトを伝達するという意味では構造化されているが、書かれている情報をサイト横断的に同じ形式に従って自動収集・処理できるような構造にはなっていない。

そこで、ソフトウェアが自動処理しやすいようページ内に書かれている内容を特定の規約に則って構造化として記述する手法が提唱されている。同じ情報を人間向けと機械向けに同じページに埋め込んでおき、ブラウザは人間向けのデータを表示し、Webロボットなどの自動処理プログラムは機械向けのデータを収集する。

様々な手法が提唱されているが、現在有力な方式はHTMLのヘッダ領域などにJSON-LD形式でスクリプトの形で情報を埋め込む手法で、Schema.orgという業界団体が情報の種類ごとにデータの記述形式(スキーマ)の標準を提案している。

例えば、ある行事の開催案内のWebページに、Schema.orgの定義する「Event」(行事)のスキーマで構造化を埋め込むことで、巡回してきたロボットに行事名や主催、出演者、開催日時などを伝達することができる。

ソフトウェア開発における抽象化

ITの分野では、ソフトウェアの設計・開発やプログラミングで特に多用される概念で、制御の抽象化とデータの抽象化に分かれる。

例えば、プログラム中の様々な箇所で似たような具体的な処理を行っているときに、これを一つの汎用的なサブルーチンとして独立させ、必要な箇所から呼び出して利用するようにしたり、複数のプログラムで共通する機能をモジュールやコンポーネントなどの形に抜き出すことが該当する。

オブジェクト指向プログラミングでは、ある対象を表すデータ群と手続きを一体のオブジェクト(の雛形であるクラス)として定義するが、これも対象をプログラム上で扱うための一種の抽象化と考えることができる。

複数の具体的な対象を表すクラスから共通するデータや操作を取り出してスーパークラス(基底クラス/親クラス)を定義する場合があり、これを抽象化と呼ぶことがある。宣言だけがあり実装がサブクラス(派生クラス/子クラス)に任されている抽象メソッドを含むクラスは特に「抽象クラス」(abstract class)と呼ばれる。

一人では考えつかないようなアイデアを導き出すために行われる会議で、結論を得たり決定を行うことは目的ではない。出た意見やアイデアは会議後に整理したり分析したりして、その後の過程に役立てる。

アイデアをより豊かで創造的なものにするための原則がある。「他の参加者の意見を否定・批判しない」「突飛・奇抜・乱雑・常識外れな意見も歓迎する」「質より量を重視する」「他の参加者の意見から連想したり自分の意見を加えて発展させる」の4つである。

1942年に大手広告代理店グループBBDO創業者の一人として知られるアレックス・オズボーン(Alex Faickney Osborn)氏が著書 “How to Think Up” で提唱したのが始まりとされる。ブレーンストーミングのように集団で創発的な活動を行う技法としては他にKJ法やバズセッションがよく知られる。

まず、手元にある情報やデータを小さなカードに一枚一項目で書き出し、広い場所にばらばらに置く。互いに関連が強い、あるいは同じ種類のものを集めてグループ化し、グループの見出しのカードを置く。数が多い場合はグループ同士を集めて大グループを作り、さらに何段階かこの作業を繰り返す。

グループ分けが完了したら、各グループ間の関連性が分かるようにグループを配置しなおし、別の紙にその様子を写しとる。そこに枠や線分、矢印などを書き入れ、それぞれの関連性を明らかにする。この図解を元にテーマを選定したり、文章化してまとめたりする。

1967年に東京工業大学教授で文化人類学者の川喜田二郎氏が考案したもので、フィールドワークで集めた知見を整理するための手法として開発された。「KJ」は同氏の氏名のイニシャルに由来する。製造業の品質管理の手法を体系化した「新QC7つ道具」の一つとしても採用されており、こちらでは「親和図法」の名称で知られる。

物事の内訳や分類、問題の原因などを図示する技法の一つである。左端に大本の事象を書き入れ、そこから構成要素を右側に枝分かれさせる。各要素を細分化した要素をさらに右側に枝分かれさせ、この手順を繰り返して段階的に詳細化していく。

ある要素を構成要素へ分解する際には、細分化された要素をすべて足し合わせると左側の元になった要素全体を表すように心がける。このような分解法は「漏れなく、重複なく」という英語表現の頭文字をとって「MECEミーシー」(Mutually Exclusive, Collectively Exhaustive)と呼ばれる。

ロジックツリーは様々な場面や対象に適用できる汎用的な技法で、構成要素に分解するものを「要素分解ツリー」(Whatツリー)、事象の原因を探求するものを「原因追求ツリー」(Whyツリー)、問題の解決策を探求するものを「問題解決ツリー」(Howツリー)と呼ぶことがある。組織の目標管理などでは「KPIツリー」もよく用いられる。

情報を階層的に整理し、視覚的に図示する手法である。中心になるキーワードを決めて紙面の中心に書き入れ、関連するキーワードを放射状に周囲に向かう曲線の傍らに書き入れる。各キーワードから更に枝分かれする曲線を書き入れ、関連するキーワードを配置していく。

ブザン氏が提唱した描画法では、無地の紙を横置きにして、中心から描き始める。枝は曲線で描き、一つの枝には一つのキーワードを対応付ける。木のように中心に近い枝ほど太く、周辺ほど細くしていく。画像や記号、色分けなど絵画的な要素をふんだんに用いるべきとされる。

もとは紙に手書きする図法だが、現代ではコンピュータ上のソフトウェアとしてマインドマップを作図できるものも開発されている。ブザン社は各国に支社を設けてインストラクターの公認制度やセミナー事業などを展開している。「マインドマップ」「Mind Map」は図法の一般名ではなく同社の登録商標であるため、無許諾で製品名やサービス名などの一部に用いることはできない。

笑っている顔や親指を立てた手、ハートマーク、自動車といったように、日常的に目にする存在や概念を、一文字分の領域に簡単なカラーイラストとして表現し、それぞれ固有の文字コード(文字の識別番号)を割り当てて英数字やひらがな、漢字などと同じ文字の一種として扱うものを指す。

特定のシステム向けのものは1960年代頃から新聞社で使われているものなどが知られているが、現在のように広く一般的に用いられるようになったのは、1990年代後半に日本の高機能携帯電話(現代でいう「ガラケー」)が文字コード規格を独自に拡張して絵文字を採用し始めたことがきっかけであると言われている。

当時は携帯電話会社(キャリア)ごとに独自のコード体系を用いており同じキャリアの端末同士でしか正確に表示することができなかった(他社の端末に送ると別の絵文字に「文字化け」する)が、スマートフォンの時代になると米大手二社(アップル、グーグル)などが仕様の統一を推進し、国際的な文字コード標準規格「Unicode」(ユニコード)のバージョン6(2010年)から絵文字の採録が始まった。

現在では単に絵文字といった場合はこの「Unicode絵文字」のことを指し、1800以上の絵文字が収録されている。英語圏では以前から「:-)」のように文字を組み合わせて顔を表す “emoticon” (エモーティコン)が使われていたが、Unicode絵文字のことは日本語をそのまま使い “emoji” (読みは本来エモジだが、英語風にイーモジと読む人が多い)と呼ぶ。

ちなみに、日本語文字コードには古くから記号文字(「◆」「※」「〒」など)が存在するが、これは句読点や鉤括弧といった約物から派生したもので絵文字とは区別される(絵文字と一部重複はある)。また、複数の文字を組み合わせて顔などを表現した「顔文字」(^_^;など)や「アスキーアート」も、既存の文字を組み合わせたもので絵を一文字にコード化したものではないため区別される。

Unicode絵文字一覧

初期のインターネットでは文字しか伝達できないシステムが多かったため、ニュアンスや感情を表現するために文末などに記す用法が広まった。文章だけでは誤解を与えかねない場合などに、語調を和らげることができるという利点がある。

一方、手紙に絵を添えるようにくだけた調子になるため、あまり親しくない人に対して使うと馴れ馴れしい印象を与えることがあるので注意が必要である。一般に、仕事相手への電子メールなど、改まった場では用いるべきでないとされている。

歴史と言語による違い

欧米ではタイプライターの時代から顔に見立てた文字の並びが文書や電報に使用されていた記録があるが、日本では1980年代にパソコン通信で使用されたのが始まりだとする説が有力となっている。

欧米圏では使用できる文字がアルファベットと数字、およびいわゆる半角記号のみであるため比較的シンプルなものが多いが、日本では漢字やかな、キリル文字、ギリシャ文字、全角英数字など様々な文字や記号を組み合わせ、独自の表現が発達した。同様に、中国語圏では漢字を取り入れたものが、韓国ではハングル文字を取り入れたものが独自に発達している。

携帯電話の絵文字・顔文字

日本の携帯電話では1990年代末頃から、記号文字の考え方を拡張して様々な物事や概念を表す絵を一文字に表した絵文字が利用できるようになり、その一部として笑顔や泣き顔などの顔文字も収録された。

当初は各携帯電話・PHS事業者(キャリア)独自の拡張仕様として同じキャリアの加入者同士でしか交換できない機種依存文字だった(他社加入者へ送ると文字化けしたり下駄記号「〓」になった)が、2000年代半ばに各社のメール送受信システムで透過的に相互変換する仕組みが整えられ、共通して利用できるようになった。

Unicodeの絵文字・顔文字

日本の携帯電話の絵文字を参考に、文字コードの国際規格であるUnicodeにも絵文字が採用されることになり、2010年のUnicode 6.0から“Emoji”として登録が開始された。

顔文字も大量に登録されており、Unicode対応フォントで容易に入力・表示できるようになったため、現在では “smiley” “emoticon” といった単語は伝統的な文字を組み合わせた顔文字ではなくUnicode Emojiの顔文字を表すのが一般的になりつつある。

利用者はマウスやタッチパネルなど位置を入力する装置を用いて画面上のアイコンを指定し、コンピュータに実行内容の指示などを行う。例えば、アプリケーションソフトを表すアイコンを開くと起動して操作画面が現れ、ファイルを表すアイコンを開くと閲覧画面や編集画面が現れる。

アイコンは操作画面を画像や図形で構成するグラフィカルユーザーインターフェース(GUI)の主要な構成要素であり、キーボードなどから文字で指示を入力する方式に比べ、文字入力が不慣れな人や命令文などを覚えていない初心者でも容易に操作内容を指示できる。

アイコンの大きさや形状はシステムによって異なるが、システムごとに規定された決まった大きさ(縦横数十ピクセル程度)の正方形に揃えられ、複数のアイコンを縦横に規則正しく並べて表示する場合が多い。脇にファイル名などの文字情報を添えたり、マウスカーソルを合わせると短い説明が表示されたりする場合もある。

どの絵柄が何を表すかはシステムによって異なるが、何の機能や対象を表しているのか直感的に連想しやすいものになるよう工夫されている。しかし、コンピュータに特有な事項や抽象的な事柄などは絵や図に表すのが難しく、慣れていない人が一見しても何のことか伝わらないことも多い。

歯車が「設定」、重なった2枚の紙が「複製」、ゴミ箱が「削除」、フロッピーディスクが「保存」、虫眼鏡が「検索」、左回りの回転矢印が「アンドゥ」(操作の取り消し)など、多くのソフトウェアに共通する機能については慣用的に同じような図柄が採用されることが多い。

情報や案内を単語や文章で記載するとその言語が読めない人には内容が伝わらないが、様々な場所で共通して使われるピクトグラムを描いておけば、言葉が分からなくても最低限の内容は伝達できる。文字のみの場合よりもよく目立ち、ひと目ですぐに情報が伝わる利点もある。

代表的な例として、公共施設などにあるトイレの男女のマーク、障害者用を表す車椅子のマーク、非常口のマーク、禁煙マークなどがある。その場所における禁止事項や危険についてピクトグラムを列挙した看板などもよく見かける。

図柄は線や図形を組み合わせた単色か二色(背景色を含めれば2～3色)のシンプルなデザインとすることが多い。「赤は禁止、黄色は注意」「青は男、赤は女」といった具合に色の違いに意味が込められている場合もある。

駐車場の「P」マークや案内所の「i」マークのようにアルファベット頭文字をモチーフとする慣例がある少数の事例を除き、文字部分が読めなければ意味が伝わらないデザインにはしないのが原則である。図柄の下などに「立入禁止」のように補助的に内容を表す単語を添えることはある(厳密にはこの部分はピクトグラム本体に含まれないとも言える)。

施設の設置者などが独自にデザインして掲示する例も多いが、社会的に共通してよく使われるものは標準の図柄が国際規格や国内規格で定められている。一般的な案内用のピクトグラムについて国際標準化機構が定めたISO 7001や、危険や警告、禁止などを表す標識を定めたISO 7010、これらを反映して定められた日本国内のJIS規格であるJIS Z 8210(案内用図記号)などがよく知られている。

単なるグラフやイラストではなく、様々な視覚的な要素を組み合わせ、色彩や形状、大きさ、配置などをデザインすることにより、一目で概要を把握できるように表現された画像を意味する。アニメーションする動画や対話的に操作できるソフトウェアの形に仕上げたものもある。

日常的によく目にする例として、鉄道の路線図や交通標識、各地の天気予報を地図に重ねて表示した画像、各地域の統計値を地図に書き入れた図などがある。科学技術の分野では、人工物の構造図や自然現象の模式図などに補助的な線や矢印、注釈、数値などを書き入れた画像がよく用いられる。

光は波長の違いにより人の目にそれぞれ異なった色として映り、赤、青、緑といった人間が感じる色の種類(色味)のことを「色相」(hue)という。波長の変化に応じて連続的に色味が変化する様子を円環状に表したものを色相環という。

色と位置の対応関係は色の表現方法(表色系)によって微妙に異なるが、名前のある主な色で言うと赤-赤紫-紫-青紫-青-水色-エメラルドグリーン-緑-黄緑-黄-橙-赤の順に並ぶ。いわゆる「光の三原色」(赤・緑・青)や「色の三原色」(水色・薄紫・黄)は、概ね各色が120度ずつ離れた配置となる。

色相環で隣や近くにある色同士を「類似色」、中心を挟んでちょうど反対側にある色同士を「補色」という。補色については表色系によって色の組み合わせも微妙に異なるが、絵の具や印刷物など減法混色の系でよく知られるRYB色相環やマンセル色相環では「赤-緑」「黄-紫」「青-橙」などが補色となる。

見出しや文章、画像、図表などの素材を作成・編集し、それらを紙面に割り付けて構成する作業をコンピュータの画面上で行う。出来上がりの紙面状態を確認しながら編集するWYSIWYG環境を備えたソフトウェアを用いるのが一般的だが、TeXのように専用の人工言語を用いてプログラミングの要領で紙面構成を記述していくシステムもある。

簡易な用途には一般的なワープロソフトなどを用いることもあるが、印刷物の紙面構成を行う機能に特化した「DTPソフト」と呼ばれる業務用のソフトウェアを用いることが多い。

DTPは1990年代前半頃から普及が始まり、パソコンやプリンタ、イメージスキャナなどの高性能化・低価格化や、フォントなどの環境の整備が進んだことにより、現在では商業出版物の編集作業のほとんどがDTPで行われるようになっている。

初期のDTPには専用の高性能ワークステーションや米アップル・コンピュータ(Apple Computer/現Apple)社のMacintoshシリーズがよく用いられ、米アルダス(Aldus)社(当時)の「Aldus PageMaker」(ページメーカー)や米クォーク(Quark)社の「QuarkXPress」(クォークエクスプレス)が人気を博した。

現在ではWindowsパソコンもよく使われるようになり、Aldus社を買収してこの分野に進出した米アドビ(Adobe)社の「Adobe InDesign」(アドビ・インデザイン)がQuarkXPressと競い合っている。出版社や新聞社では内製や特注の専用システムを利用している場合もある。

写真や画像、図版などでは、全体の中で必要な部分だけを取り出して強調するために、不要な周縁部を切り取って排除する処理や操作をトリミングという。

映像の場合は、主に縦横比(アスペクト比)の調整のために上下あるいは左右を一定の割合で切り落として調整することをトリミングという。映画をアナログテレビ放送する際に左右をカットしてアスペクト比を4：3にする処理などが該当する。一方、写真の場合ように被写体の強調のために一部を切り取って拡大する処理や作業のことは「クロッピング」(cropping)という。

プログラミングやデータベースの分野では、文字列データの先頭や末尾に含まれる空白文字などを削除する操作のことをトリミングという。また、ログなど時系列に蓄積されていくデータなどについて、一定の条件や基準に基づいて自動的に削除する処理のことをトリミングという場合もある。

従来の一般的なフォントは健常な成人が読むことを暗黙の前提としており、高齢者や子ども、弱視(ロービジョン)や読字障害(ディスレクシア)など視覚に関する障害や特性を持つ人々、日本語がネイティブではない外国出身者などにとって、読み取りにくかったり誤読しやすい箇所が含まれることがあった。

UDフォントはユニバーサルデザイン(UD：Universal Design)の考え方に基づいて、できる限り多くの人が同じように読み取ることができるよう配慮された字形となっている。文字としての見やすさや分かりやすさ、文として並べたときの読みやすさ、他の文字との判別しやすさ、誤読しにくさを重視してデザインされている。

「このような特徴がある字形はUDフォントである」といった明確な基準や共通する性質があるわけではないが、短いはみ出し部分を除去するなどすっきりしたシンプルなデザインにしたり、「C」「3」などの開口部を広く取ったり、濁点と半濁点を取り違えないよう大きくしたり、「1」「I」「l」などの字形の似ている文字にそれぞれ明確な特徴を与えるなどの工夫が凝らされている。

UDフォントは様々な人が様々な状況で目にする可能性がある場合によく用いられ、家電製品などの電子機器の操作画面、商品のパッケージや取扱説明書、街頭や公共施設、店舗、交通機関などの案内や掲示物、新聞や雑誌などの出版物、手続きや契約関係の書類などで採用が広がっている。教科書にも「UD教科書体」が使われる例が増えている。

フォントは字形の特徴によって様々な種類があり、一定の共通した特徴を持つデザイン様式のことを「書体」(typeface/タイプフェイス)という。欧文フォントの書体には、線に強弱があり端に飾りのついた「セリフ体」(serif)や、線が均一の太さで飾りのない「サンセリフ体」(Sans-serif)、手書きに近い「スクリプト体」などの種類がある。

日本語書体には、線に強弱がありトメ、ハネ、ハライの表現された「明朝体」や「楷書体」、均一な太さの「ゴシック体」(gothic)、筆で書いたような字形の「行書体」や「草書体」などの種類がある。なお、書体という語をフォントの意味(“font”の訳語)として用いることもある。

すべての文字を同じ幅で表現したものを「等幅フォント」(monospaced font/固定幅フォント)、文字ごとに最適な幅が設定されたものを「プロポーショナルフォント」(proportional font/可変幅フォント)と呼ぶ。用途に応じて使い分けられるように、同じ字形のフォントで固定幅のものと可変幅のものが両方提供される場合もある(ＭＳゴシックとＭＳＰゴシックなど)。

データの表現形式によっても分類され、文字の形を小さな正方形の点(ドット)の集まりとして表現したものを「ビットマップフォント」(bitmap font)あるいは「ラスターフォント」(raster font)、基準となる点の座標や輪郭線を表す曲線のパラメータの集まりとして表現したものを「アウトラインフォント」(outline font)と言う。

ビットマップ方式は高速に処理でき、小さな表示サイズでは美しく表示できるが、拡大・変形すると形が崩れてしまうため、現在では、サイズによらず同じ品質を得られるアウトライン方式が用いられることが多い。また、プロッタなど特定の用途では、太さの概念が無く、中心線の曲線のパラメータのみで字形を表した「ストロークフォント」(stroke font)と呼ばれる方式が用いられることもある。

アウトライン方式のフォントデータのファイル形式にはいくつかの標準的な形式があり、様々なシステムで同じデータを共通して利用することができる。「TrueTypeフォント」や「OpenType」「WOFF」(Web Open Font Format)「PostScriptフォント」(Type 1フォントやCIDフォントなど)などが有名である。

装飾がなく線の太さが均一であるようなフォントがゴシック体に分類される。角や端が角ばったデザインのものを「角ゴシック体」、丸みを帯びているものを「丸ゴシック体」と呼ぶことがある。

印刷物では表題や見出し、強調箇所などに用いることが多く、本文など長い文章は明朝体など線幅に変化のあるフォントが用いられることが多い。遠くから視認しやすいため屋内の案内や屋外の看板などにもよく用いられる。

コンピュータでは、解像度の低いディスプレイで線幅が一定しないフォントを表示すると輪郭にガタつきが多く発生し読みにくかったことから、操作画面などの表示のほとんどでゴシック体のフォントが用いられてきた。現在では高解像度の表示装置も増えているため、長い文章を読む表示モード(リーダーモード)などで明朝体などを使用する例も増えている。

なお、欧文の場合は線幅が一定で飾りの無い書体を「サンセリフ体」(sans-serif font)と呼ぶのが一般的である。“Gothic font” と言った場合、中世の古文書に出てくるような、縦横の線幅が極端に異なり角ばった独特の字形をした「ブラックレター」(blackletter)のことを指し、日本語フォントのゴシック体とはまったく異なる字体となるため注意が必要である。

中国の明みんの時代に漢字の活版印刷を行うために整理された字体を元にしているためこのように呼ばれる。日本では明治時代にやはり活版印刷のために漢字と仮名の書体が整備され、書籍や新聞、雑誌などの本文に広く用いられるようになった。

線幅が一定でない字体には楷書体や教科書体もあるが、これらが筆などで人が書いた手書き文字に近い一方、明朝体は縦や横に伸びる画の多くを垂直・水平に寄せ、線幅をなるべく一定に保ってトメを字飾りのように三角の盛り上がりで表現するなど、独特の様式が見られる。

コンピュータでは、初期の解像度が低いディスプレイ装置だと輪郭が崩れやすく見にくかったため、画面表示に用いられるフォントはゴシック体が標準となっている。一方、ワープロソフトやDTPソフトなど印刷用途では明朝体が標準的に用いられ、本文など長い文章に設定されることが多い。

近年ではディスプレイの解像度が高精細化したため、メニューなどの表示に明朝体のフォントが用いられたり、長い文章を読むための表示モード(リーダーモード)などで本文を表示する用途に明朝体が用いられることも増えている。

なお、 欧文の場合は線幅に変化があり飾り付きの書体を「セリフ体」(serif font)と呼ぶのが一般的で、明朝体とセリフ体、ゴシック体とサンセリフ体が字形や用途などでほぼ対応関係にある。

各文字の左右の余白の量が概ね同じであり、字間の調整などをしなくても書き文字のようにほぼ一定の間隔で文字が並ぶ。長い文章などを表示・印刷したときに自然で読みやすい。横書きで折返しのある文章では行末や縦方向の並びは揃わず、一行に表示される文字数も行ごとに変化する。

幅の変化は「l」と「m」、「<」と「.」のように英数字・記号において顕著だが、日本語文字でも「っ」「ァ」のような小さなカナ文字はサイズに合わせて幅も狭まっており、フォントによっては「目」「う」「リ」のような文字を細め(縦長)に調整している場合もある。

一方、すべての文字の幅が同じに設定されているフォントは「等幅フォント」(monospaced font)「固定幅フォント」と呼ばれる。初期のコンピュータではあらかじめ一定幅の格子に区切られた領域に文字を表示・印刷することしかできなかったため、文字はすべて等幅だったが、処理能力の向上によりプロポーショナルフォントを扱うことができるようになった。現在でも縦方向の並びが揃っていたほうが見やすいプログラムコードの表示などでは等幅フォントが好まれる。

本来、文字にはそれぞれ固有の幅があるが、フォントデータには、すべての文字を均一の枠に収めるように設計された「等幅フォント」(固定幅フォント)と、手書きの場合と同じように文字ごとに幅が設定された「プロポーショナルフォント」(可変幅フォント)の違いがある。

等幅フォントでは同じ幅にすべての文字を収めるため、各文字の左右の余白の量は幅が狭い文字では大きく、広い文字では小さくなる。文字自体の字間の空きはまちまちになるが、文字の表示枠は一定の幅で並び、一行に表示・印刷される文字数も(文字の大きさが同じなら)常に一定となる。

ASCII文字などいわゆる半角文字(半角英数字・記号)は幅が高さの半分の縦長の長方形に収められ、いわゆる全角文字(漢字、仮名、全角英数字・記号など)は幅と高さが等しい正方形の領域に収められる。後者は前者のちょうど2文字分となる。

「Courier」(クーリエ)のように等幅フォントとしてのみ提供されるフォントと、「ＭＳ ゴシック」(等幅)と「ＭＳ Ｐゴシック」(プロポーショナル)、「Noto Sans」(プロポーショナル)と「Noto Sans Mono」(等幅)のように同じ字形で等幅とプロポーショナルの両方が用意されているものがある。

主な用途

コンピュータが実用化されてから1990年代頃までは、あらかじめ一定幅の格子に区切られた領域に文字を表示・印刷する仕組みだったため、フォントはすべて等幅だった。文書作成などでプロポーショナルフォントが一般的になった今でも等幅フォントが用いられる場面はある。

等幅フォントは複数行に表示した際に文字が格子状に規則正しく配置されるため、リストや表など縦に項目が並ぶような文書の表示・印刷に適している。「┌」「├」などの罫線用の文字も、等幅フォントでの表示・印刷を前提に用意されたものである。

プログラムコードや設定ファイルなどを見やすく表示・編集できるため、テキストエディタやコードエディタなどでも標準のフォントが等幅に設定されていることが多い。コンピュータのコマンド入力画面(シェルやコマンドプロンプト)も等幅フォントによる表示が標準となっている。

従来の一般的なフォントは健常な成人が読むことを暗黙の前提としており、高齢者や子ども、弱視(ロービジョン)や読字障害(ディスレクシア)など視覚に関する障害や特性を持つ人々、日本語がネイティブではない外国出身者などにとって、読み取りにくかったり誤読しやすい箇所が含まれることがあった。

UDフォントはユニバーサルデザイン(UD：Universal Design)の考え方に基づいて、できる限り多くの人が同じように読み取ることができるよう配慮された字形となっている。文字としての見やすさや分かりやすさ、文として並べたときの読みやすさ、他の文字との判別しやすさ、誤読しにくさを重視してデザインされている。

「このような特徴がある字形はUDフォントである」といった明確な基準や共通する性質があるわけではないが、短いはみ出し部分を除去するなどすっきりしたシンプルなデザインにしたり、「C」「3」などの開口部を広く取ったり、濁点と半濁点を取り違えないよう大きくしたり、「1」「I」「l」などの字形の似ている文字にそれぞれ明確な特徴を与えるなどの工夫が凝らされている。

UDフォントは様々な人が様々な状況で目にする可能性がある場合によく用いられ、家電製品などの電子機器の操作画面、商品のパッケージや取扱説明書、街頭や公共施設、店舗、交通機関などの案内や掲示物、新聞や雑誌などの出版物、手続きや契約関係の書類などで採用が広がっている。教科書にも「UD教科書体」が使われる例が増えている。

コンピュータの主なユーザーインターフェースは、ディスプレイ装置などの画面表示、マイクやスピーカー、イヤフォンによる音声入出力、キーボードなどによる文字入力、マウスやペンタブレット、タッチパネル、ジョイスティックなどによる(画面上の)位置や方向の入力、カメラなどによる画像・映像入力、およびこれらの組み合わせによって構成されることが多い。

現代のコンピュータのユーザーインターフェースは大きく分けて、文字による表示や入力を基本とする「CUI」(Character User Interface：キャラクタユーザインターフェース)あるいは「CLI」(Command Line Interface：コマンドラインインターフェース)と、絵や図形による表示、画面内の位置を指示することによる操作を基本とする「GUI」(Graphical User Interface：グラフィカルユーザインターフェース)の二種類がある。

CUI/CLI

CUI/CLIは主にキーボードからコンピュータへの命令(コマンド)を文字により入力し、コンピュータは応答や処理結果を画面に文字で表示する方式である。歴史が古く、慣れれば効率よく操作することができるが、コマンドを覚えなければ操作できないため初心者にはとっつきにくい。

連続して実行するコマンドをファイルに記録して繰り返し一括実行したり、コマンドの出力文字列を他のコマンドの入力に与えるなどの手法で操作の一部を自動化しやすいことから、現在もコンピュータに詳しい人や技術者など専門家がよく利用する。

GUI

GUIはコンピュータの性能・機能が向上し、グラフィック表示やマウスなどが利用できるようになった1980年代頃から普及し始めたもので、専門家でない人やコンピュータに詳しくない人でも直感的に使用できることから、一般に販売されるパソコンや携帯端末などの多くで採用されている。

パソコンでは画面全体を机の上になぞらえた「デスクトップ」という形式で表示し、動作中のソフトウェアに与えられた矩形の表示領域である「ウィンドウ」を並べることができる。ファイルやアプリケーションなどは「アイコン」で表示され、マウス操作やタッチ操作で位置を指し示して操作指示を与える。

近年では、画面に指や専用のペン型の器具などで触れて対象や位置を指示するタッチパネルを利用した操作方式が普及しており、スマートフォンやタブレット端末では標準のGUIとなっている。こうした機器では液晶画面が入出力インターフェースのほとんどの機能を提供しており、いくつかのボタンを除き操作に他の装置は使用しない。

UXとの違い

システムの性能が優れていたり機能が豊富でも、ユーザーインターフェースの設計や実装が不適切だと利用者がシステムの提供する資源を十分に活用することができず、また無用な負担を強いられ作業効率も低下するため、システムの総合的な優劣を決する重要な構成要素の一つと言える。

ユーザーインターフェースという概念は主にシステム側の機能や動作を中心に捉えるものだが、近年では、利用者側の視点から、一連の操作や表示の流れから得られる利用者の体験の総体を表す概念として「UX」(User Experience：ユーザーエクスペリエンス、ユーザー体験)という用語が提唱されている。

なお、コンピュータの分野ではユーザーインターフェースが一般的な用語だが、機械などの分野では「HMI」(Human Machine Interface：ヒューマンマシンインターフェース)あるいは「MMI」(Man Machine Interface：マンマシンインターフェース)と呼ぶことが多い。

画面上にアイコンやメニュー、ボタンといった絵や図形に補助的な文字情報を組み合わせた操作要素が表示され、これをマウスやトラックパッド、タッチパネルなどのポインティングデバイス(位置入力装置)で選択してコンピュータへの指示を与える。

パソコンなどではオペレーティングシステム(OS)が管理する「デスクトップ」(desktop)と呼ばれる初期画面が表示される。各アプリケーションソフトは「ウィンドウ」(window)と呼ばれる矩形の領域を与えられ、その中で表示や操作を行う。複数のウィンドウを同時に開き、並行して処理を行ったり、即座に切り替えて操作することができる。

スマートフォンやタブレット端末では「ホーム画面」(home screen)が表示され、導入済みのソフトウェア(アプリ)がアイコンとして並んでいる。これをタッチ操作で選択するとアプリが起動して全画面で操作可能になる。複数アプリを同時に起動することはできるが、画面を切り替えて使用するのが一般的となっている。

CUIとの違い

一方、情報の提示も操作の受付も原則として文字によって行うユーザーインターフェースを「CUI」(Character User Interface：キャラクターユーザーインターフェース)あるいは「CLI」(Command Line Interface：コマンドラインインターフェース)という。

利用者はキーボードなどを用いてコンピュータへの指示を文字によって与え、コンピュータからの出力も画面に文字を表示して行われる。LinuxなどのUNIX系OSやメインフレーム(大型コンピュータ)、ネットワーク機器など、訓練を受けた専門の技術者やオペレータが操作する前提のコンピュータ製品で多く用いられる。

パソコン向けOSのWindowsやmacOS、スマートフォンやタブレット端末向けのAndroidやiOSなど、技術者ではない一般消費者や(企業の)従業員が操作することを想定したコンピュータ製品は、情報の見やすさや操作方法の習得のしやすさなどを重視してGUIを中心に構成することが多い。家庭用ゲーム機、デジタル家電など民生用コンピュータ応用製品の多くも、主要な表示・操作方式としてGUIを用いる。

利用者はマウスやタッチパネルなど位置を入力する装置を用いて画面上のアイコンを指定し、コンピュータに実行内容の指示などを行う。例えば、アプリケーションソフトを表すアイコンを開くと起動して操作画面が現れ、ファイルを表すアイコンを開くと閲覧画面や編集画面が現れる。

アイコンは操作画面を画像や図形で構成するグラフィカルユーザーインターフェース(GUI)の主要な構成要素であり、キーボードなどから文字で指示を入力する方式に比べ、文字入力が不慣れな人や命令文などを覚えていない初心者でも容易に操作内容を指示できる。

アイコンの大きさや形状はシステムによって異なるが、システムごとに規定された決まった大きさ(縦横数十ピクセル程度)の正方形に揃えられ、複数のアイコンを縦横に規則正しく並べて表示する場合が多い。脇にファイル名などの文字情報を添えたり、マウスカーソルを合わせると短い説明が表示されたりする場合もある。

どの絵柄が何を表すかはシステムによって異なるが、何の機能や対象を表しているのか直感的に連想しやすいものになるよう工夫されている。しかし、コンピュータに特有な事項や抽象的な事柄などは絵や図に表すのが難しく、慣れていない人が一見しても何のことか伝わらないことも多い。

歯車が「設定」、重なった2枚の紙が「複製」、ゴミ箱が「削除」、フロッピーディスクが「保存」、虫眼鏡が「検索」、左回りの回転矢印が「アンドゥ」(操作の取り消し)など、多くのソフトウェアに共通する機能については慣用的に同じような図柄が採用されることが多い。

コンピュータの操作画面上で、同じ操作によってオンとオフが切り替わるような操作要素を「トグルボタン」(toggle button)あるいは「トグルスイッチ」(toggle switch)という。メディアプレーヤーの再生ボタン(押すたびに再生と一時停止が切り替わる)などによく使われる。

プログラミングの分野でも、同じ処理や命令の実行によって二つの状態が交互に反転するような処理のことを「トグル動作」「トグル処理」などと呼ぶ。例えば「x=1-x」という代入文は、初期状態がx=0の場合、実行するたびにxが0なら1に、1なら0に切り替わる。

利用者はキーボードなどを用いて文字列によって指示を与え、コンピュータからはディスプレイ装置に文字を表示して応答を返したり情報を提示する。画面やウィンドウの上部から人間の入力文字列とコンピュータの出力文字列が交互に並ぶ対話式の操作環境が一般的である。

OSの操作などのために用いられる操作環境では、操作が可能になると画面左端などに入力を促すプロンプト(prompt)と呼ばれる短い記号や文字の組み合わせが表示され、これに続けて人間がソフトウェアへの命令やその内容を表すコマンド(command)を入力する。

Enterキーなどで入力内容を決定・投入すると、改行されてコンピュータ側の処理が始まり、結果がコマンドの次行から一行または複数行に渡り表示される。処理が終了して再度入力可能になると改行されて新しい行の左端にプロンプトが表示され、コマンド入力待ちとなる。

初期の大型コンピュータ(メインフレーム)でタイプライターとプリンタを組み合わせたテレプリンタ端末が使用されたのが起源とされ、1970年代にキーボードとCRTディスプレイによるVDT環境が普及すると、メインフレームやUNIX系システムの標準的な操作環境として普及した。現在でもこれらの業務用や技術者向けのコンピュータシステムではCUI環境が好まれる傾向がある。

一方、コンピュータからの出力にグラフィックス表示を多用し、操作をマウスなどで主に画面上の位置を指定して行う操作環境はGUI(Graphical User Interface：グラフィカルユーザーインターフェース)という。現在では、パソコンやスマートフォン、タブレット端末など、コンピュータに詳しいとは限らない一般消費者にも広く普及しているコンピュータ製品のほとんどがGUIによる表示・操作を基本としている。

モックアップや概念実証(PoC)とは異なり、製品版と遜色ない機能や性能、外観などを備えており、実際に使用してみることができる。プロトタイプを用いて試験を行い、不具合の修正などを行ったら、これを量産して製品として投入することになる。

製品開発の初期段階でまず動作に必要な最小限の機能のみを実装したプロトタイプを作成し、これを元に試験、評価、修正のサイクルを何度も繰り返しながら徐々に完成度を高めていく手法を「プロトタイピング」(prototyping)という。反復型開発の一種で、ITの分野ではソフトウェアや情報システムの開発で用いられることがある。

プログラミングの分野では、C言語などで関数の宣言部分のみを記述したものをプロトタイプ宣言と呼んだり、JavaScriptなどのオブジェクト指向言語でオブジェクトを定義する際に複製元となるオブジェクトをプロトタイプと呼ぶなど、言語仕様上の特定の要素をプロトタイプと呼ぶことがある。