ハジカラ 〜はじめからでも、プログラミング勉強〜

入門向けに、IT関連(javaやKotlin)をコツコツ書いたり検証したりします。

【IT入門】ユーザインタフェースに関して①

calendar

reload

【IT入門】ユーザインタフェースに関して①

こんにちは😀

今回は、ユーザインタフェースをみてみます。
ユーザインタフェースとは、ユーザが実際にシステムを操作すること、システムの使いやすさのことです。
PCのOSやスマホの画面など、直感的に操作がわかるものなどは、ユーザインタフェースの設計が良いと言われます。

システムの外部設計の段階では、ユーザ視点でユーザインタフェースの設計をいかに行うかが大事になります。

スポンサーリンク

CUIとは

画面に表示されるのは文字だけで、コンピュータに対して入力するのも文字だけになります。
適切な文字を打ち込むことで命令を伝えて処理を行います。

このような文字ベースの方式をCUI(Character User Interface)と言います。

GUIとは

CUIは一昔前のPCという感じですが、画面にアイコンやボタンを表示して、それをマウス操作などで命令を伝えるグラフィカルな操作方式があります。

このような方式を、GUI(Graphical User Interface)と言います。

一般的に使用されているWindowsやMacなどのPCは、GUI方式を使用しています。

GUIで使用される部品

GUIでは、以下のような部品を組み合わせて操作画面を作ります。

ウィンドウ

ここがアプリケーションの基本領域になります。
この部分に部品を配置して、操作画面を作成します。

メニューバー

アプリケーションを操作するための項目が並んだ部分になります。
細目のラインのプルダウンメニューが羅列されています。

プルダウンメニュー

クリックすると、下に垂れ下がって表示されるメニューになります。

テキストボックス

文字入力用の短形領域になります。

ラジオボタン

複数ある選択肢の中から、1つだけを選ばせたい場合に使用します。

チェックボックス

選択肢を複数選択したり、特定の項目をオンorオフすると行った用途に使用します。

画面設計時の留意点

ユーザにとって使いやすいインタフェースを実現するため、画面設計を行う際には、以下のような点に留意します。

  • 入力は自然な流れとなうように、左→右、上→下へとフォーカスを移動させます。
  • 画面上で用いる色遣いにルールを持たせます。
  • 選択肢の数が多い場合、選択肢をグループ分けしたり、階層化して選びやすくします。
  • 入力ミスに関しては、エラーメッセージを出力して、原因と対処法をわかりやすく簡潔に表示します。
  • 画面ごとのレイアウトや入力パターンを共通化させます。
  • 不慣れなユーザのために、ヘルプなどの操作ガイダンスを用意します。

今回の一言・・・

ユーザインタフェースは使用することはその使いやすさに気がつかないものですが、いざ設計してみるとその工夫や使いやすさの実現の難しさに勉強になることがあります。
ここら辺も基本はしっかりおさえておきます。

ここまで読んでくれてありがとう。
では、また次回。

IT入門一覧はこちら】

この記事をシェアする

コメント

コメントはありません。

down コメントを残す