鈴木健一さんと鈴木智大さんをお招きして講師をお願いしました。設計などにも関わった実績のある会社です。デザイン」を読んだことがキッカケで、直接コンタクトをとったことに始まります。Flows」というツールについてお話いただきました。フローをデザインするための簡易記法」も発見。画面遷移図というと、どうしても画面(ボックス)どうしを線でつなげた図を思い浮かべますが、ここで紹介された手法では「ユーザーが見るもの/ユーザーがすること」という具合に、画面に紐づくアクションをいっしょに書くスタイルです。これにより単に画面を線でつなぐときよりも、どうするとこの画面にたどり着くのかが明示しやすくなります。画面に対するアクションの数が増えれば増えるほど、ブランチが多くなる課題を持っています。サイトの場合には適用しづらいかなという印象を持ちました。「なぜその画面が必要か」はこのツールでは見つけられません。ワイヤーフレーム」のうちの「画面遷移」を取り出しているため、その前提となるシナリオはここでは触れていないことにも注意が必要です。いうのも、ボクの経験では、画面に紐づくアクションの前提となるユーザー行動から整理していったほうが理解しやすいと思いました。合体して考えると、次のようなレイヤーで考えることができます。合体した例ここまで一気通貫で可視化ができれば、何のためにその画面が必要で、どういうアクションができるのかが一目瞭然な気がします。これはジャーニー化の原型として見ることもできるので、見え方でいえばこちらのほうが自然かなと思いました。画面を基準に考えるアプローチではありますが、実際にはアクティビティに大きく影響され、画面単位ではなくアクション単位に深堀りするツールだと言えます。その実態は、画面内に配置する要素の目的とその先にどういう展開が待ち構えているのか指し示すことができるものと理解しました。設計をする上で、理解しておきたいコンポーネントの種類と用法」をお話いただきました。PCとモバイルの違いを例に、アプリ設計の指針となるガイドラインをもとにご紹介いただきました。個人的にもそれぞれのガイドラインの存在は知っているものの、すべてを把握したうえで人に説明することはできないので、とても参考になりました。パターンやナビゲーションパターン、よく使われるコンポーネントについて、それぞれの概要と実例、使用するうえでのメリット・デメリットをご説明いただきました。時間くらいかかったそうで、非常に大作です。イメージしやすくなります。組み合わせることにより、アクションとコンポーネントとを同時に検討でき、より忠実度の高いイメージを共有するのに役立ちます。グループにする)リフレッシュコントロール(垂直の表示リストの更新をする)カルーセルパネル(高さを固定して複数表示する)モーダルメッセージ(強制的に表示する)最後に、次のステップとしてのビジュアルデザインへの取り組みや、プロトタイピングなどのご紹介をしていただきました。例に、実機での検証や試作から改善のスピードアップを重要視する点をお話いただきました。今回の勉強会は、アプリのUIというのが前提にはなりますが、人とシステムとの関わり方のデザインについて改めて考えさせられる機会になりました。個人的にもスマホのデザインパターンは興味がありましたが、それらをどういった目的に適用していくかという点では、今回の内容は非常にフィットしているなと感じました。した勉強会を社内で実施したことで質疑応答にもみられたように、UXとUIとの理解と自分たちの業務との関係性を改めて理解していくことに役立ったと思います。した専門的に掘り下げる勉強会も継続してできればと思います。ブログ「REFRECTION」にも当日のレポートを掲載いただきましたので、詳細はそちらもご覧ください。コメントをキャンセルメールアドレスが公開されることはありません。*サイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。