16
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

RailsにおけるOOUI(オブジェクト指向ユーザーインターフェース)

Last updated at Posted at 2018-12-13

OOUIとは

OOUIとは、オブジェクト指向ユーザーインターフェース Object-Oriented User Interface の頭字語です。

GUI アプリケーションをデザインする際の手法で、「オブジェクトベース」でユーザーにアプリケーションを提供するUIです。
対比として取り上げられるのは「タスクベース」のUIで、これはユーザーがデータを操作できる手順が固定されているようなものを指します。

日本語でまとまっている資料は、まず書籍のオブジェクト指向UIデザイン ― 使いやすいソフトウェアの原理です。
また、Web上でもこの本の著者である上野学氏のOOUX – オブジェクトベースのUIモデリングでも概要が読めます。
業務アプリの銀の弾丸、OOUI本を読むという記事で私の感想も書いています)

WEB+DB PRESS Vol.107 にあるOOUIの特集も上野学氏のものです。私もOOUIというものをこの記事で知りました。
この記事ではRailsとOOUIの関係について、自分が考えたことを書き残しておきたいと思います。

また、OOUXという言葉もあり、記事の中でも触れられていますが、ほぼ同じ意味です。
少し前にオブジェクト指向UXという記事がありました。これはOOUX(OOUI)の事例が載っています。

Railsで見られるOOUI

Railsの基本的な動作からOOUIを実現している部分を書き出してみます。

オブジェクトを示す目当てとしてのURI

config/routes.rb にて定義されるパスは、RESTFulであることが推奨されます。
これは、オブジェクトのコレクションやシングルを一意に示すURIを生成し、人も機械もそのURIを頼りにオブジェクトにアクセスできます。
RESTFullなURI設計によって、メインとなるオブジェクトは浅いパスに、サブになるオブジェクトはメインとなるオブジェクトの配下のパスに置かれることが明示されます。

scaffoldによってデフォルトでオブジェクトの一覧と詳細を作る

Railsは rails generate scaffold のコマンドを使うことで、データをCRUDできる機能が一通り生成できます。
その際に作られるいわゆる一覧(index)画面で、データベース内のデータが一覧(コレクション)で表示され、それぞれのデータの詳細(シングル)へ遷移・編集・削除の操作ができるリンクが表示されます。
デスクトップアプリケーションでのアイコンなどが表示されているGUIとはまた少し違っていますが、ユーザーに対して操作する対象(オブジェクト)をまず提示し、操作がそれに紐づく、という形式になっています。

規約やデフォルトでこういった形式を採用することで、管理画面などは少ない手数で作れますし、全てのデータをCRUDするためのUIも統一され、ユーザーいとって理解しやすいインターフェースが提供されます。
むしろタスクベースのUIになるように修正するほうが大変で、画面の種類が増えることでコントローラのメソッドも増えることになり、メンテナンスのコストも増えてしまいます。

RailsでOOUIを手軽に実現するために不足している技術

モードレスな入出力

オブジェクトの新規作成 new や更新 edit は専用の画面を必要とし、モードレスとは言えません。
これはWebアプリケーションでは、JavaScriptを使わないと難しい部分です。
そしてRailsはフロントエンドがそんなにうまくサポートできているとは言えない状況が続いています。

テキストであるWebとの融合

ブラウザによってGUIの世界に引っ張り出されてはいますが、WebはHTML(テキスト)で出来ています。そのため、いわゆるGUIを実現できるグラフィカルなパーツは、別途作成する必要があります。
ReactやWebComponentsなどの技術により、Webの世界でもコンポーネント化の流れがありますが、RailsのModelとはまだ結びついてはいません。
その辺りを補完できるライブラリが作られ、Railsの標準で取り込まれたりすると、GUIのSPAが一気に普及する可能性があります。

オブジェクト同士の関連付け

これは一般的なGUIでもそうですが、オブジェクトとオブジェクトを結びつけるような操作は難しいです。
例えば、記事(Article)に対して任意の数のタグ(Tag)を結びつけるような場合は、Railsでは多対多のアソシエーションとしてよく実装されます。
そういった関係性を操作するようなUIは、オブジェクト同士をドラッグ・アンド・ドロップで重ね合わせたり、スマートフォンであればタップ&ホールドする必要があったりと、複雑な実装を必要とします。
また、中間のデータにさらに作成者やコメントが紐づく場合など、いろいろ関係性は考えられるのでパターン化するのはなかなか大変そうです。

まとめ

Railsは、Martin Fowler氏のActiveRecord やMVCモデルなど、ソフトウェア開発のパターンを多く取り込んでいます。
OOUIもソフトウェア工学の流れを組んでRailsに取り込まれているのかなと思っておりますが、真偽の程は定かではありません。

ただ、ユーザーに対してデータの操作をオープンにしていく、という方針はRailsのCRUDの作りやすさにはあると思っています。
Railsのレールにのって、今後もユーザーにとって使い易く、かつ、プログラマもメンテナンスしやすいWebアプリケーションを作っていければ良いですね。

16
8
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
16
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?