2016.11.19 まなびん

アプリ開発・ウェブ開発

使いやすい管理画面を追求していく

今日は管理画面の設計で色々考えてました。

管理画面ってプロフィールを入力したりする、こういうやつです。

管理画面フォームのイメージ

管理画面のUIってフォームとリンクがメインになるんですが、なにも考えずにプロトタイプ作ると結構迷うUIになることが多いんですよね。

プログラマーは制作中何度も画面を見てテストするので迷うことはないのですが、初見の人に使ってもらうと思ってもいないところで離脱したりするんです。
簡単な例ですが、ユーザーのプロフィールを入力するような画面があった場合で、かつプロフィール写真を複数登録する必要がある場合、

開発者目線ではプロフィール項目を入力させてから、別画面に移動して画像を入れるようなUIを作りたくなるんです。(理由は複数画像を入れるテーブルは別のテーブルに用意するのが普通だからです)

画像登録フォーム

プロフィール情報が保存されてないのに、それに紐作くテーブルを作るのは工数がかかるし、別々のフォームを用意した方がバグの原因も少なく楽なんです。

でも、プロフィールと同じフォームで画像がアップできないっていうのはユーザー目線では使いにくく、迷わせてしまう原因になります。

開発ではこのような、UI UXを取るか、開発のしやすさで実装するかのジレンマがよくあるんですが、管理画面はその典型です。
管理画面の根本的な問題の多くは、ユーザーが行ったアクションがどういう結果をもたらすか、ユーザーに伝わらないからだと思うんですよね。

だからと言って、管理画面上に注釈を書いてもユーザーは読まないし、スマホアプリのチュートリアルもほとんどの人が飛ばすし、みんなわざわざ理解したいと思わないんです。

人はそもそも字を読みたくないんです。

字を読みたくないと言うのは、ウェブ以前から同じで、紙のフライヤーでもキャッチが大事で細かい文書は読まないというのはよく知られてると思います。
洗練された管理画面はできるだけ字で説明せずに伝える必要があるわけです。

さてどうするか？

公開画面に編集ボタンをつければいいんです。

公開画面

1. ログインユーザーで自分のページを見た時に、自分の投稿であることを伝えてやる。

2. 管理画面にリンクを作るのではなく、公開画面側の各項目にボタンをつけてフォームにリンクする

これでプレビュー効果もあるし、編集したいところとフォームのリンクもできるわけです。

この考え方でいくと、管理画面はできるだけない方がよくて、公開画面側で編集できるようにしていくのが理想なのかなぁと思ったりします。

ちなみにメジャーなサービスでも楽天RMS、ヤフオク、ぐるなびなどなどUIが最悪なサービスは多々あります。。

設計が悪いと言うより、肥大化して手がつけられないと思うので程度は仕方ないと思うんですが、ぐるなびはUIを何度か新しくして努力してたりします。対して楽天RMSは多分10年くらい変わってなくて相変わらず史上最悪のUIです。

せめてリンクの配置くらいは改善したらいいのになぁと思う昨今です。

まなびん

会社の代表やってます。遊ぶように仕事やってます。

SNS