「GUI」はこの項目へ転送されています。その他の用法については「GUI (曖昧さ回避)」をご覧ください。
.mw-parser-output .ambox{border:1px solid #a2a9b1;border-left:10px solid #36c;background-color:#fbfbfb;box-sizing:border-box}.mw-parser-output .ambox+link+.ambox,.mw-parser-output .ambox+link+style+.ambox,.mw-parser-output .ambox+link+link+.ambox,.mw-parser-output .ambox+.mw-empty-elt+link+.ambox,.mw-parser-output .ambox+.mw-empty-elt+link+style+.ambox,.mw-parser-output .ambox+.mw-empty-elt+link+link+.ambox{margin-top:-1px}html body.mediawiki .mw-parser-output .ambox.mbox-small-left{margin:4px 1em 4px 0;overflow:hidden;width:238px;border-collapse:collapse;font-size:88%;line-height:1.25em}.mw-parser-output .ambox-speedy{border-left:10px solid #b32424;background-color:#fee7e6}.mw-parser-output .ambox-delete{border-left:10px solid #b32424}.mw-parser-output .ambox-content{border-left:10px solid #f28500}.mw-parser-output .ambox-style{border-left:10px solid #fc3}.mw-parser-output .ambox-move{border-left:10px solid #9932cc}.mw-parser-output .ambox-protection{border-left:10px solid #a2a9b1}.mw-parser-output .ambox .mbox-text{border:none;padding:0.25em 0.5em;width:100%;font-size:90%}.mw-parser-output .ambox .mbox-image{border:none;padding:2px 0 2px 0.5em;text-align:center}.mw-parser-output .ambox .mbox-imageright{border:none;padding:2px 0.5em 2px 0;text-align:center}.mw-parser-output .ambox .mbox-empty-cell{border:none;padding:0;width:1px}.mw-parser-output .ambox .mbox-image-div{width:52px}html.client-js body.skin-minerva .mw-parser-output .mbox-text-span{margin-left:23px!important}@media(min-width:720px){.mw-parser-output .ambox{margin:0 10%}}
この記事は検証可能な参考文献や出典が全く示されていないか、不十分です。出典を追加して記事の信頼性向上にご協力ください。(このテンプレートの使い方)
出典検索?: "グラフィカルユーザインタフェース"
オペレーティングシステム
主要項目
プロセス管理
割り込み
メモリ管理
ファイルシステム
デバイスドライバ
ネットワーク
セキュリティ
グラフィカルユーザインタフェース
入出力
.mw-parser-output .hlist ul,.mw-parser-output .hlist ol{padding-left:0}.mw-parser-output .hlist li,.mw-parser-output .hlist dd,.mw-parser-output .hlist dt{margin-right:0;display:inline-block;white-space:nowrap}.mw-parser-output .hlist dt:after,.mw-parser-output .hlist dd:after,.mw-parser-output .hlist li:after{white-space:normal}.mw-parser-output .hlist li:after,.mw-parser-output .hlist dd:after{content:" ・\a0 ";font-weight:bold}.mw-parser-output .hlist dt:after{content:": "}.mw-parser-output .hlist-pipe dd:after,.mw-parser-output .hlist-pipe li:after{content:" |\a0 ";font-weight:normal}.mw-parser-output .hlist-hyphen dd:after,.mw-parser-output .hlist-hyphen li:after{content:" -\a0 ";font-weight:normal}.mw-parser-output .hlist-comma dd:after,.mw-parser-output .hlist-comma li:after{content:"、";font-weight:normal}.mw-parser-output .hlist-slash dd:after,.mw-parser-output .hlist-slash li:after{content:" /\a0 ";font-weight:normal}.mw-parser-output .hlist dd:last-child:after,.mw-parser-output .hlist dt:last-child:after,.mw-parser-output .hlist li:last-child:after{content:none}.mw-parser-output .hlist dd dd:first-child:before,.mw-parser-output .hlist dd dt:first-child:before,.mw-parser-output .hlist dd li:first-child:before,.mw-parser-output .hlist dt dd:first-child:before,.mw-parser-output .hlist dt dt:first-child:before,.mw-parser-output .hlist dt li:first-child:before,.mw-parser-output .hlist li dd:first-child:before,.mw-parser-output .hlist li dt:first-child:before,.mw-parser-output .hlist li li:first-child:before{content:" (";font-weight:normal}.mw-parser-output .hlist dd dd:last-child:after,.mw-parser-output .hlist dd dt:last-child:after,.mw-parser-output .hlist dd li:last-child:after,.mw-parser-output .hlist dt dd:last-child:after,.mw-parser-output .hlist dt dt:last-child:after,.mw-parser-output .hlist dt li:last-child:after,.mw-parser-output .hlist li dd:last-child:after,.mw-parser-output .hlist li dt:last-child:after,.mw-parser-output .hlist li li:last-child:after{content:")\a0 ";font-weight:normal}.mw-parser-output .hlist ol{counter-reset:listitem}.mw-parser-output .hlist ol>li{counter-increment:listitem}.mw-parser-output .hlist ol>li:before{content:" "counter(listitem)" ";white-space:nowrap}.mw-parser-output .hlist dd ol>li:first-child:before,.mw-parser-output .hlist dt ol>li:first-child:before,.mw-parser-output .hlist li ol>li:first-child:before{content:" ("counter(listitem)" "}.mw-parser-output .navbar{display:inline;font-size:75%;font-weight:normal}.mw-parser-output .navbar-collapse{float:left;text-align:left}.mw-parser-output .navbar-boxtext{word-spacing:0}.mw-parser-output .navbar ul{display:inline-block;white-space:nowrap;line-height:inherit}.mw-parser-output .navbar-brackets::before{margin-right:-0.125em;content:"[ "}.mw-parser-output .navbar-brackets::after{margin-left:-0.125em;content:" ]"}.mw-parser-output .navbar li{word-spacing:-0.125em}.mw-parser-output .navbar-mini abbr{font-variant:small-caps;border-bottom:none;text-decoration:none;cursor:inherit}.mw-parser-output .navbar-ct-full{font-size:114%;margin:0 7em}.mw-parser-output .navbar-ct-mini{font-size:114%;margin:0 4em}.mw-parser-output .infobox .navbar{font-size:88%}.mw-parser-output .navbox .navbar{display:block;font-size:88%}.mw-parser-output .navbox-title .navbar{float:left;text-align:left;margin-right:0.5em}
表
話
編
歴
グラフィカルユーザインタフェース(英: graphical user interface、略称:GUI(ジーユーアイ、グイ、グーイ[1]))は、コンピュータグラフィックスとポインティングデバイスなどを用いる、グラフィカル(ビジュアル)であることを特徴とするユーザインタフェース。キャラクタユーザインタフェース (CUI) やテキストユーザインタフェース (TUI) と対比して語られることが多い。
歴史SAGE制御室。スクリーンにはアメリカ東海岸が表示されている。二つのターゲットが追跡されているところ
世界初の実用となったGUIは1963年に完成したSAGEというアメリカ空軍の開発した防空管制システムである。これはCRTとライトガンを備えており、核爆弾を搭載した敵航空機を迎撃するために多数のレーダーからの情報を統合し、複数のオペレーターがライトガンで迎撃目標を指示するだけで全軍の適切な箇所に自動で指令が届き、その結果レーダー情報の膨大さを気にすることなく的確に敵機を迎撃できるというものであった。
また、オシロスコープはテレビやディスプレイと同じ原理を使った装置だが、コンピュータの内部の信号を直接観察できる装置としても都合が良いため、初期のコンピュータではしばしばそのような目的でブラウン管が情報出力のために備えられていた。これはGUIとして扱うには機能的には足りないものだが、最初期のコンピュータの1基であるEDSACにも付いており、OXOというゲームに使われている。実用の目的で情報表示にブラウン管が使われた例としてはMARS-1(1960年、日本国有鉄道)がある。
1960年代の米国において、サザランドのSketchpadや、1960年代後半、マウスの発明者でもあるダグラス・エンゲルバートが率いるスタンフォード研究所の研究者は、当時の新しいデバイスであるマウスで操作されるテキストベースのハイパーリンクを使用するオンラインシステムNLSを開発した(軍用などの専用目的ではなく、汎用を意図した)。1968年12月のNLSのデモンストレーションは、「すべてのデモの母」として知られるようになった。NLSはエンゲルバートの提唱する「人間知性の拡大」という概念を実現するために作られており、ハイパーテキスト、ハイパーリンク、マルチウインドウなどの今日的なGUIには必須の概念を実装して見せたきわめて革新的なものである。またジャーナルと呼ばれるハイパーテキストベースの文書共有システムは正にWikiと同じ概念である文書によるコラボレーション・グループウェアを実装したものである。NLSの本質は単なるGUIの実装ではなく、GUIは会話・画像・文書をリアルタイムで共有する電子会議を通じた知的共有グループウェアを実現するための手段であった。さらに、後にWYSIWYGと呼ばれることになる機能もこのとき既に実装されていた[2]。AltoやNoteTakerで動作した暫定Dynabook環境(Smalltalk-76、同-78の頃)のGUI
1970年代には、アラン・ケイにより、誰でも簡単に使えることを目指して暫定Dynabook環境が作られた。当初はData General社のNovaでスクリプト言語的な位置づけで開発されたSmalltalk-72だったが、約5?10倍の能力とビットマップディスプレイ、マウスを装備したAltoへと移植され、マシンパワーを得るとすぐにオーバーラップ可能なウインドウシステムの構築が試みられた(Smalltalk-74)。このマルチウインドウシステムを効率よく機能させるために後に考え出されたダブルバッファリングおよびBitBltは、現在も、ちらつきのない画面描画のために使われるアルゴリズムおよびデータ操作/ハードウェア機能として知られる。
1974年までには、後にMicrosoft Wordの前身と言われるようになるBravoを開発していた別グループとの情報交換を経てパロアルト研究所初のWYSIWYGエディタも実装される。70年代半ば過ぎにはマウスによる操作、メニューによる命令実行、オーバーラップマルチウインドウシステム、絵と文章の共存できるWYSIWYGのマルチフォントエディタ、アイコンによる機能やオブジェクトの簡易表現など、現在ごくふつうに見られるグラフィカルユーザインタフェースの主要な要素は固まっていた。Smalltalk-72、同-74の後継であるSmalltalk-76ではさらに洗練・整備され、それを1979年に見たスティーブ・ジョブズが策定中のLisaの仕様決定に役立てた[3]。 GUIでは、コンピュータの画面上に、ウィンドウ、アイコン、ボタンといったグラフィックが表示され、ユーザはそれらの中から目的の動作を表すグラフィックスをマウスなどのポインティングデバイスで選択する。 基本的には「デスクトップ」「ウィンドウ」「メニュー」「アイコン」「ボタン」など要素を組み合わせて構成され、それらをポインティングデバイスによって操作されるカーソルを通じて指示を与える。 端的に言うと、画面上のボタンや画像などを選択する事でリアクションを発生させる仕組みを総称してGUIと言う。「ウィジェット (GUI)」も参照
概要
構成要素
デスクトップ
X Window System ではルートウィンドウと言う。「デスクトップ環境」のこと。この上にウィンドウを重ねることによってインタフェースはマルチタスクを実現する。一般的なインタフェースでは、ここにアプリケーションやデータのアイコンをおき、ここから作業を開始できるようにする。この画面は、既存のディレクトリ構成とは相容れない立場のため、特殊な位置におかれるディレクトリを参照する形でデータの内容を定義する。デスクトップの背景に画像や各種アクセサリを置いて、視覚的に楽しませる機能が提供される。また、アプリケーションの役割を果たすActive Desktopやガジェットなど(ウィジェットエンジン)を置くこともできる。最近では、仮想デスクトップをキューブで表示する、アイコンの配置に立体感を着ける、ウィンドウを立体的に表示など、3D効果によって操作性を向上するデスクトップ環境が増えている。Unix系ウィンドウマネージャのCompiz、Windows VistaのAero、サン・マイクロシステムズのProject Looking Glass
ウィンドウ
アプリケーションがデータを扱うためのグラフィカルインタフェースにおけるひとつの単位となるもの。ウィンドウ内においては、アプリケーションとデータは一体化する。ここにおいて、アプリケーションを操作し、データを管理、生成、編集する。通常はメニュー、アイコンなどを周辺に配置し、中央にデータをおく。ウィンドウには、データやアプリケーションに応じてタイトルが付けられ、ウィンドウの最上部にタイトルがおかれる。一般的には、ウィンドウをディスプレイ全体に表示する「最大化」、表示を隠す「最小化」、複数枚のウィンドウの最前面、タイトルだけを表示する「シェード」などがサポートされ、これにより、ウィンドウの操作を簡単に行うことが出来る。
Single Document Interface (SDI)
ウィンドウにおいて、ひとつのデータをひとつのウィンドウ内に完結させる方式。この場合は、データの数だけ、ウィンドウが出力される。他のアプリケーションのウィンドウと突き合わせて利用できるが、その分だけ、ウィンドウの数が多くなり、管理が繁雑になる。
Multiple Document Interface (MDI)
ひとつのウィンドウ内に入れ子状にウィンドウが表示され、複数のデータ管理を行う方式。この場合は、ウィンドウ管理が簡単になるが、作業の管理が二重になる。
タブ
MDIにおけるデータ管理方式のうち、データのタイトルをウィンドウ内に並べ、タイトルを選んで必要なデータだけを表示するもの。これにより、簡単にデータにアクセスできるようになる。
メニュー
アプリケーション、オペレーティングシステム (OS)より指示できるコマンドを階層上に表現したもの。画面上部、または画面下部におかれ、そのアプリケーションから利用できるコマンドがほぼ全て配置される。通常は左に重要度の高いものがおかれ、右にいくにしたがって重要度は低くなる。コマンドの階層はアプリケーションにより異なるが、ファイル操作、編集の機能を重視して、それらのコマンドから左側からおかれ、右には、ヘルプなどがおかれる。マウスの第一ボタンによって操作する。
コンテキストメニュー
アプリケーションの用意した階層上のメニューとは別に、メニュー以外のところでマウスの第二ボタンなどを押した際に機能するメニューの事。ボタンが呼び出された位置に応じてメニューの内容が変化し、編集操作を簡単に行うことが出来るようになっている。
アイコン
データ管理アプリケーションにおいて、データ、アプリケーション、ディレクトリなど表現したもの。データ管理アプリケーション、すなわち、ディレクトリにおけるユーザーデータの管理や、特定のデータを管理を行うアプリケーションの場合、アイコンによりデータを表現する。通常は、データの中身や、拡張子などから関連づけられたアプリケーションを表現するが、ユーザーが自由に変更する場合もある。