UIデザイナーと協業するならエンジニアは「モードレス」を知っておくと良いでしょうが!

フロントエンドエンジニアの茶木です。
GWに北海道は富良野に行ってきました。タイトルはその影響です。

前回に引き続き『オブジェクト指向UIデザイン』を読んでの感想文です。

以下、前回分です。

はじめに

前回、デザインにおけるオブジェクト指向はエンジニアが捉えるものより原義に近く、逆にエンジニアは道具的に捉え、やや狭い意味で使っているだろうとまとめました。

踏まえて、今回はオブジェクト指向という言葉を使わずにモードレスという視点で考えてみようと思います。

エンジニアはついタスク指向でモノを見てしまいがち

エンジニアは……と書きましたが、UIデザインに触れてない全般の人の傾向です。

デザイン経験のないエンジニアにデザインをやらせると、ユーザーがやりたいことを列挙したようなデザインをきっとやってしまうでしょう。これは実際にはユーザーにやらせたいことのタスク指向になってしまうのです。

これは、物事をシンプルに落とし込みたいエンジニアのサガ的な部分でもあるんですが、ユーザーには使いにくいものになってしまうのです。

ユーザーの作業はもっとクリエイティブだ

タスク指向がなぜ使いにくいのかというと、AをやってBをやってCをやって完了!のような手順の想定は的はずれであり、実際のユーザーの作業は、順番を行きつ戻りつしたり、端折ったり、工夫をこらしたり、発見があり、それ自体がクリエイティブだからです。道具は独創性によって自由に使われる!

モード・モードレスとはなにか

ここで、モードについて話をします。

モードは次にとれるアクションが強制される状態を指し、避けるべき状態です。

わかりやすい例がモーダルウインドウです。モーダルウインドウは、操作がOK・キャンセルなどのウインドウ内に制限され、閉じるまで他の作業ができません。

その逆がモードレスで、ユーザーの作業を自由にするものです。

手順が決まっておらず、ユーザーが好きな方法で目的に向かっていける。これがGUIの根本にあるモードレス性です。

『オブジェクト指向UIデザイン』p324

これがモードレスを重要視するゆえんです。

モードレスへの飽くなき挑戦

実際、モードレスはあらゆるところに潜んでいて、除去が難しいケースもあります。

たとえば、入力編集フォームと完了ボタンの組み合わせは一般的ですよね。でもこれすらもモードです。なぜなら完了ボタンを押さないと編集モードが終わらず、無理にページを離れれば入力が全部失われてしまう不便さを抱えているからです。

これを排除して、どのようにモードレスにできるでしょう?んー無理じゃない?

と思ったら、ひとつの回答があります。つまり入力が即座に逐次保存されていくフォームならモードレスになります。モードレスエディットパターンと呼ぶそうです。

そしてエンジニアの私達が毎日触れる GitHub の テキストフォームが実はそうなっていましたね。ページを離れても、同一フォームに入力しようとすると前回分が残っているのです。

ここでいう comment ボタンは保存ではなく投稿とみなせるわけです(保存は随時自動保存)

これはきっとデザイナーさんがすっごい考えに考え抜いて生まれたのだろうなあ。

おわりに

最後に好きな一節を引用します。

良いデザインとは、ユーザーに合わせたものではなくユーザーが自らを合わせられるものなのです。箸やバイオリンや自転車などの優れた道具は、人に合わせたというより、人が自らをどこまでも合わせていけるようにデザインされています。<中略>抽象度の高い道具は、それ自体が決まった使い方を強要していないという意味で、モードレスです。同様に、抽象度の低い道具はモーダルです。そしてモードレスな道具は、それを使うユーザー自身の変化によって意味性を高めるという意味で、人と道具の相互発展をポジティブな方向に促すのです。これが、モーダルなタスク指向のデザインではなく、モードレスなオブジェクト指向のデザインを行うことの意義です。

オブジェクト指向UIデザイン』p50-p51

Gaji-Laboでは、UIデザイナーを募集しています

弊社では手ざわりのいいUIを通して事業に貢献したいUIデザイナー、一緒にお仕事をしてくださるパートナーさんの両方を募集しています。大きな制作会社や事業会社とはひと味もふた味も違うGaji-Laboを味わいに来ませんか?

パートナー契約へのお問い合わせもお仕事へのお問い合わせも、どちらもいつでも大歓迎です。まずはオンラインでのリモート面談からはじめましょう。ぜひお気軽にお問い合わせください!

求人応募してみる!


投稿者 Chaki Hironori

webライターもやってるフロントエンドエンジニアです。Reactは自信があります。またデザイン畑の出身で、気持ちのいいアニメーションやインタラクティブな表現は丁寧に手掛けます。好きなものは中南米の遺跡で、スペイン語が少しできます。