【勉強会レポート】WebデザインとUX について考える

2016年5月19日

こんにちは。エンジニアのショウノです。
相変わらず文章を書くのは苦手ですが、やらなきゃ克服できないので書きます。

UI・UXめっちゃ人気みたい

5/14に開催された今回の勉強会はサイボウズさんの大阪梅田オフィスで開催されました。
そして参加者枠は25人のところに52人と応募多数。

気になる登壇内容

おっぱいから見るUI/UXとPELSONA

  • UI(見せ方)をよく理解している女性・UX(利用者)側の男性として考える
  • UI・UX・ペルソナの3つを始点につくったものを出し合って、みんなで話し合うこと
  • 同業のものをとにかくあつめる
  • テストは大きな問題が発生しない程度でためす

「男性側の友達との会話でも使用する(?)ところまでがUX」
男性陣はそんなことをしているのか(笑)という発見と同時にうまくUXを説明してらっしゃるなーと。
3つを始点として作り、あとで話し合って決めるという考え方はUI・UXを考えるときだけでなく頭にいれておこうと思いました。
段階やパーツに区切って試しながら進める方が圧倒的にいい成果が得られるし、複数の可能性を比較することで本当に優先するべきことが見えてくるなぁと思うからです。

イラスト制作とデザインに共通する表現技法

  • ちょっと意識するだけで伝わり方が変わる

うちのデザイナーのセッションです。
自分が実践するなら気をつけないといけないなーと思ったのは、その手間のかけ方とタイミング。
以前既存のホームページを模写して、デザインも少し変えてみたことがありました。
作業しているといろいろと欲が出てきてしまい、「ここをもう少し大きくしてみよう」「ここの色も変えてみよう」と模写作業と同時並行でアレンジしたため、ぐちゃぐちゃになってしまい全体を整えるのが大変でした。(笑)
私自身は「ちょっとした手間」は最後にしたほうがよさそうです。

初期導入と記憶の利用(plum_shigaさん)

  • 基本記憶はマジすぐ忘れる
  • 覚えるにはまとまりごとにすればおぼえやすい

”まとまり”にすれば覚えやすいというのは言われるとなるほどなーと。
「JXY AMK KQP」だと厳しいけど「JAL BOY KICK」だと見覚えのある単語だから全部のアルファベットを覚えられる。ふむふむ。

UI記述言語としてのHTML

リンク先はこちら

  • htmlのbuttonとかもちゃんと使うといいよ

htmlを書くときについついdivなんかを使っちゃうけど、buttonとかだと「押せる感じ」とかいろんなオプションを勝手につけてくれるしいいんじゃないか、というようなお話。
なんでもかんでもdivを使いがちだったんですが、divって無駄な要素がついていないぶん好き勝手カスタムしちゃって「このdivってどう設定したっけ?」「同類の要素なのになんか微妙に違う!」って私はよくなります。
なので最近はそれぞれの要素の使い道を考えて”適材適所”を意識するようにしています。
pタグなんかも勝手にmarginがつくのが鬱陶しいなーと前は思っていたんですが、ルールを決めてプロパティを解除すれば同じ要素の変更箇所は同じになるのでメンテナンスしやすいコードになるんじゃないかと今は思っています。

UXを損ねる静的コンテンツ配信アンチパターン

  • ちょっとしたことでユーザーの満足度を下げるのはもったいない
  • ちょっとしたことに気を配ってるサービスってなんかイケてる
  • ちょっとだけ手間をかけて、良いUXを提供しましょう!

私は細かいことを気にし始めるとドツボにはまり終わらなくなるのでとにかく形にすることを常々心がけるようにしています(笑)
でもこの3つは絶対に大事なんですよね。
だって自分がユーザーだったら同じ内容のサービスなら絶対使いやすい方を選びますもん。
なのでサービスを作るときには「ちょっとした手間」をかける時間も制作時間内に組み込んで考えないとな、と。

正解のないデザインについて、それでも正解について考えてみる

  • UI・UXは正解(に限りなく近い)ことがある、がデザインにはない
  • デザインに正解がない理由は「結局好み」「結果の計測が難しい」
  • デザインを作る上で大事なのは「目的を明確にする」「ユーザーの視点に立つ」「理由を持つ」

自分でしっかりと考えること、他者にきちんと説明できること、他の正解の可能性も考えること。
どんな職務の人でもこれができる人はすごく強いし、この3つがあれば何でも解決できるんじゃないか。
そんなことを考えました。もちろん内容も素晴らしかったです。

制作側とユーザーの温度差、そしてペルソナのズレ-プロゲーマーと高校生から学んだ例-
(コソバマイさん)

  • ゲームを作るときにはページ遷移が嫌われる
  • 太宰メソッド

ゲームの製作ではわりとなんでもhoverが好まれる、というのを聞いて確かに!と。
あと「独りよがりになっていない?」と自分に問いかけるようとも思いました。
太宰メソッドという言葉は初めて知りましたが、これも気をつけないとなぁ。
気になる方は調べてみてください。

人類の進化とデザイン

  • 人類は200万年前から何も変わってない
  • 考えることを続けよう

ほんわかしたスライドで軽めの内容、ということでしたがすごく良い視点だなと思いました。
同じ人間でも「20年前に生まれた人の感覚」と「今日生まれた人の感覚」にも違いはあるはず。
このことを仕事でも、日常生活や人との関わりの中でも忘れたくないです。

WebアプリケーションとWebサイトのデザインの違いからみるCSS設計

  • いろんなCSS設計のノウハウがあるけどそのコーディングに必要なのかを考えてみよう

様々なCSS設計のノウハウがありますが、あまり意識したことがなかった私。
(体系的に書くようには心がけていますが)
こんな人が々なCSS設計を試してみるのは大事かなと思うのと同時に何でもかんでも覚えたCSS設計を使うのではなく、”適材適所”で使えるようにならなきゃ意味ないな、と思いました。

感想

今回の勉強会で私が大切にしようと思ったのは次の4つです。

  • 適切なペルソナの設定(方向性がぶれなくなる、期待する成果が得られやすくなる)
  • ちょっとした手間って結構重要(この差がユーザーの体験にわりと大きな影響を与える)
  • 取捨選択をすること(素晴らしい技術も場合によっては悪となりうる)
  • よくよく考えること(必要なものは何か、と頭の中をシンプルにしていくような感じ)

登壇者のみなさま、ありがとうございました!