そのデザイン案の 意味を考える

2020/07/17　開催の Webデザイン・Web制作に関する勉強会 #8にて登壇させていただきました。

Transcript

1. Yasui Risa
   そのデザイン案の
   意味を考える
   - 的あてゲームで疲弊しないために -
   2020. 7.12
   https://kfug.connpass.com/event/178470/
   Webデザイン・Web制作に関する勉強会 #8
   chatbox.inc  /  Yasui Risa
   

   View Slide

2. Yasui Risa
   デザイン / UI改善 / イラスト
   chatbox.inc  /  Yasui Risa
   

   View Slide

3. デザインをしてて
   こんなこと
   ありませんか？
   chatbox.inc  /  Yasui Risa
   

   View Slide

4. こんなことってありませんか？
   chatbox.inc  /  Yasui Risa
   多くの案を作ったのに
   なかなかOKがもらえない
   たくさんを作ったものの
   良くなってるわからない
   どこが悪くてどこを改善したら
   良いかわからなくなってしまう
   結局最初の案でOKになり
   多数の案が徒労になる
   
   

   View Slide

5. なぜこういうことが
   起こるのか？
   chatbox.inc  /  Yasui Risa
   

   View Slide

6. 依頼者からの要望を
   ただそのまま受け取って作る
   chatbox.inc  /  Yasui Risa
   なぜ起こる？ その①
   
   クライアント
   かわいくて
   使いやすく！
   

   View Slide

7. chatbox.inc  /  Yasui Risa
   そうするとどうなるか？
   ①作り⼿の中にある情報が
   ⾜りない
   or
   整理できていない
   

   View Slide

8. NGという情報しか
   受け⽌めれていない
   chatbox.inc  /  Yasui Risa
   なぜ起こる？ その②
   
   クライアント
   悪くはないんだけど
   もう少し改善して
   ください！
   

   View Slide

9. chatbox.inc  /  Yasui Risa
   そうするとどうなるか？
   ②NGに対しやみくもに
   「作ること」のみで
   解決するしかなくなる
   

   View Slide

10. 解決⽅法が
    「根性でがんばる」しかない
    chatbox.inc  /  Yasui Risa
    なぜ起こる？ その③
    
    デザイナー
    とにかく
    たくさん作って
    みてもらおう！
    

    View Slide

11. chatbox.inc  /  Yasui Risa
    そうするとどうなるか？
    ③デザイン案の増や⽅が
    当てずっぽうになっていく
    

    View Slide

12. 原因は
    何なのか？
    chatbox.inc  /  Yasui Risa
    

    View Slide

13. chatbox.inc  /  Yasui Risa
    原因
    「⾒た⽬を作る作業」しか
    ⾒えてない
    

    View Slide

14. 「⾒た⽬を作る作業」だけでなく
    「 作り⽅ 」へフォーカスする
    chatbox.inc  /  Yasui Risa
    解決策
    

    View Slide

15. 作り⽅にフォーカスするためには
    まず、コミュニケーションを
    ⾒直す必要がある
    chatbox.inc  /  Yasui Risa
    解決策
    

    View Slide

16. どうすればいいのか？
    コミュニケーション編
    chatbox.inc  /  Yasui Risa
    

    View Slide

17. chatbox.inc  /  Yasui Risa
    作り⼿の中にある情報が少ない時
    
    クライアント
    かわいくて
    使いやすく！
    依頼者から聞き多くの情報を集める
    同じ⾔葉でも互いに同じ想像してることはほぼない
    いろんな⽅向から確認し、すり合わせる
    どんな？
    なぜ？
    どんな時に？
    誰にとって？
    何のために？
    どうなれば使いやすい？
    

    View Slide

18. chatbox.inc  /  Yasui Risa
    情報が整理できていない時
    作る前に整理する
    作る前に仕様を整理し、あっているか確認する
    ここで間違えていると作ってもOKとなりにくい
    どんなものを作ればいいのか？
    そもそもなぜ作るのか？
    ターゲットは誰なのか？
    どんなシーンで使われるもの？ 
    ユーザーにとってどんな価値があるか？etc…
    

    View Slide

19. chatbox.inc  /  Yasui Risa
    作る以外の解決⽅法を知る
    NGの内容を聞き、課題を明確にする
    NGの理由をしっかり聞いて
    どこがどう変わったらOKなのかはっきりさせる
    
    クライアント
    悪くはないんだけど
    もう少し改善して
    ください！
    改善しないといけない
    理由や良く思っていない
    箇所をはっきりさせる
    

    View Slide

20. chatbox.inc  /  Yasui Risa
    当てずっぽうをやめゴールを⾒据える⽅法を探す
    聞き⽅を⼯夫しながら意⾒を引き出す
    複数案が必要な場合でも
    ある程度まで的を絞れる質問をする
    にぎやか
    単⾊
    シンプル
    カラフル
    

    View Slide

21. どうすればいいのか？
    作り⽅の⼯夫編
    chatbox.inc  /  Yasui Risa
    

    View Slide

22. chatbox.inc  /  Yasui Risa
    理由を考えながら⼿を動かす
    情報をもとに課題やなぜこのデザインなのか？
    ⾃問しながら⼿を動かす
    ⾃⾝の想像や憶測ではなく
    聞き出した情報をもとに考える
    ・・・
    

    View Slide

23. chatbox.inc  /  Yasui Risa
    デザインに意図を添える
    デザインだけパッとみせられると⾒る側の好みでの判断になりがち…
    意図・コンセプト
    何を解決しているか
    メリット / デメリット
    etc
    きちんとデザインごとの意図や
    ほか案とどう違うかなど添えて伝える
    

    View Slide

24. chatbox.inc  /  Yasui Risa
    絞った的のなかでOK基準に近づける
    かっこいい
    かわいいより
    使いやすさ重視
    かわいい シンプル
    使いやすさより
    ⾒た⽬重視
    にぎやか
    当てずっぽう的にむやみやたらで提案せず
    絞った的の中で少しづつ精度をあげる
    

    View Slide

25. ⾃分の場合は
    こんな感じで
    実践してきました
    chatbox.inc  /  Yasui Risa
    

    View Slide

26. chatbox.inc  /  Yasui Risa
    例1：情報整理
    Who
    どんな⼈に
    
    What
    何を
    
    Why
    なぜ
    
    Other
    いつ/どこで/
    etc…
    
    わかっていることであっても書き出して整理
    実際に使われてるシーンをイメージしたり
    埋めれないところは確認漏れとして
    早めに聞いておく
    

    View Slide

27. chatbox.inc  /  Yasui Risa
    例2：⽬的・課題の整理
    上位下位関係分析法という⼿法を⽤いながら、
    要望の分類分けや重要度、本質的なニーズの洗い出し
    

    View Slide

28. chatbox.inc  /  Yasui Risa
    例3：イメージをできるだけしぼる
    PHPが好きな⼈々 みんな
    Kaigi トーク / 集う / PHP ゾウ /
    楽しい お祭り ⾮⽇常 / にぎやか /
    

    View Slide

29. chatbox.inc  /  Yasui Risa
    例4：意図を添えて伝える
    

    View Slide

30. まとめ
    chatbox.inc  /  Yasui Risa
    

    View Slide

31. まとめ
    chatbox.inc  /  Yasui Risa
    依頼者と⼗分な情報のやりとり
    が⾏えているか
    作るものが戦略のないあてずっ
    ぽになってないか
    お互いのイメージをすり合わせ
    できているか
    作る時にそのデザインである理
    由を考えれているか
    作り出す前に仕様や課題が考え
    がまとめれているか
    制作物の伝え⽅に⼯夫の余地が
    ないか
    多くのデザイン案を作ったのにうまくいかないときは
    作る作業だけでなく他にも⽬を向ける
    

    View Slide

32. 今⽇の話が少しでも
    制作のお役に⽴てたら幸いです
    ご清聴ありがとうございました！
    chatbox.inc  /  Yasui Risa
    

    View Slide