CUIとGUIってなに?

CUIとGUIってなに?

この前、仕事で完成物を提出しようとSourcetreeを久々に開いたらエラーが起きて、その場ですぐにプルリクを作成できなかったことがあった。エラーを解決しようとSourcetreeについて調べたら「SourcetreeでgitをGUIで操作できる」と書いてあった。「GUI?」ってなったから、調べたのをまとめてみた。

そもそもUIとは

結論から言うと、GUIは「Graphical User Interface」の略で、CUIは「Character-based User Interface」の略である。GUIはユーザーインターフェース(UI)がグラフィカルで、CUIはユーザーインターフェースがキャラクターベースドになっている。まずはUIが何かってところから見ていこう。

ユーザーと機械の接点

ユーザーインターフェースは一般にUIと省略して使われることが多い。そのUIとは一体なんなのか。それは「ユーザーと機械の接点」全般を意味する。

日本語で「ユーザー」は「利用者」、「インターフェース」は「接点」を意味する。例えば、あなたがスマホを使いたい時、iPhoneだったら本体の右側面に電源ボタンがあると思う。そのボタンを押すとiPhoneは画面がつく。これはUIの1つだ。iPhoneの電源をつけるための、「あなた」と「機械」の「接点」である。他にもパソコンでデスクトップからGoogle Chromeのアプリのアイコンを押すと、Google Chromeのブラウザが立ち上がり、画面に表示される。このアプリも、「あなた」と「機械」の「接点」である。洋服がしまってあるタンスの取手もあなたがタンスを開くための接点、UIと言えるだろう。例を挙げるとキリがないけど、世の中にあるもののたくさんはUIの側面を持つ。

パソコンにおけるUI

時をGUI・CUIの話に戻そう。Gのグラフィカルは英語で「絵画的な」という意味。一方で、Cのキャラクターベースドは、キャラクターが「文字、記号」を意味するから、「文字ベースの」という意味がある。つまり、GUIは視覚的なUI、CUIは文字ベースのUIという意味になっている。

GUIは見た目で操作

GUIはUIがグラフィカルだから、例えばパソコンのデスクトップ上のファイルを開くは、そのファイルのアイコンをクリックするとファイルが開ける。ユーザーとファイルの接点は画面上のアイコンである。

sample_folderに入っているindex.html
index.htmlのファイルをクリックして開いた時

CUIはコマンドで操作

一方で、CUIはUIが文字ベースだから、同じくデスクトップ上のファイルをCUI的に開こうと思ったら、例えばターミナルを開いてディレクトリを移動してvimコマンドで開くという方法がある(恐らくエンジニアじゃ無い人は何を言っているのか全然分からないと思うけど)。

ターミナルで見たsample_folderとindex.html
vimで開いたindex.html

Apple社の「Macintosh」が登場

今の様にパソコンが普及する前は、元々コンピューターを操作する方法はCUIしかなかったらしい。一部の技術者(エンジニア)が文字ベースの操作を行って、知識が無い人が端から見ると何をしているか全く分からない様な状態だった。

それがApple社のMacintosh(通称、Mac)が登場し、多くにユーザーに広まったことによってGUIが大幅に浸透したと聞いたことがある。

【結論】

プログラミングを始めたての人は見た目でも使いやすいVSCodeなどのエディタを使うことが多いと思う(自分もずっと使っている)が、ある程度技術力がつくとvimで操作する方がラクになるらしい。僕も早くvimmerになりたいなぁ。