UIデザインを共有するためのシンプルな記法とは？（37signalsの場合）
- September 18th, 2009
- Posted in ライフハック
- Write comment
いつも素敵なアイデアを連発している37signalsですが、今回はUIデザインに関するノウハウがシェアされていましたよ。シンプルですが、かなり使えそうなのでご紹介。
彼らが問題にしているのは、ユーザー体験をどう設計して、それをどうチームに使えるか、という点。
いままでは画面の遷移図を描いたり、ユーザー体験をストーリー仕立てにしていましたがどちらも一長一短があったそうです。画面を描いてもすぐに変わるし、ストーリーはあとで参照するのが面倒だったりします。
そこで彼らが考えたのは次の図。全部これで表現すればよくね？ということで実践してみたところ、うまくいっているらしいです。
↑ それぞれの画面に対して「何があるか」「何をするか」に分けて記述しています。
↑ たとえばTo Doを追加するときのユーザー体験。
↑ もっと複雑なフロー。これはログイン画面。
たしかにシンプルではありますが、画面だけ羅列するよりは格段にわかりやすいですね。また「ユーザーが何を見るか？」が書いてあればある程度は画面も想像できるので効率的かも。
もちろんTPOや見せる相手にもよりますが、ユーザー体験をシンプルに記述したい場合にはかなり使えるのではないでしょうか。今度自分でも使ってみよう・・・（って一人で作ってたら意味ないかｗ）。
» A shorthand for designing UI flows – (37signals)
「ユーザーが見るもの」のところを四角枠線の中に書いて、ユーザーがすること、を次のユーザーが見るものへの矢印の横に書く方がわかりやすいのでは？
四角枠線の中に具体的なUIで置き換えればそのまま画面遷移図にもなるし。