webデザインについて.pdf

テーマ：
グラフィックデザイナーが気づいたWEBデザインならではの「違い」と「気をつけること」

Webデザイン・Web制作に関する勉強会 #6　登壇資料
https://kfug.connpass.com/event/135306/

Transcript

1. 2019/06/26 有柚まさき(@m̲msak7)
2. ごあいさつ あゆず まさき 株式会社chatbox 所属デザイナー フリーで、グラフィックデザイナー（広告、チラシ、DMなどの紙メイン） と、イラストレーター、広告漫画家もしています。 お絵かきとお布団が好き。 グラフィックデザイナーとして4年勤務後、chatboxへ。 Webデザイナーとして就業するのは弊社が初めて。
3. 今日のテーマ グラフィックデザイナーが 気づいたWEBデザインならではの 「違い」と「気をつけること」
4. もくじ ① デザインとは？ ② デザイナーなら紙とWeb両方できる？ ③ 紙とWebの違いとは？
5. ① デザインとは？
6. まず「デザイン」ってなに？
7. デザイン（英: design）の直訳は「設計」「図案」
8. なんで「デザイン（設計）」が必要なの？
9. デザイン(設計)の目的は伝えたい情報を受け取ってもら うため。
10. デザイン（設計）の目的は ため。 伝えたい情報を 受け取ってもらう
11. デザインの目的は ため。 伝えたい情報を 受け取ってもらう こっちのほうが伝わりやすい。
12. 他にもよくある例
13. ダイヤ購入 キャンセル
14. ダイヤ購入 キャンセル こうやって我らは課金していくのです。
15. つまり、
16. 情報設計 使用者に 「伝えたい情報を受け取ってもらう」ために を、行うのが「デザイン」。
17. ② デザイナーなら 紙とWeb両方できる？
18. グラフィックデザイナーも Webデザイナーも 同じ「デザイナー」である。
19. じゃあ、 グラフィックデザイナーは Webデザインも 問題なくできるのか？
20. それは難しい
21. 同じ「デザイナー」なのに どうして？？？
22. 媒体が違うから
23. 同じデザイナーでも媒体が違えば などが異なるため、一様にはできない。 ・専門用語 ・使用ソフト ・制作工程 ・制作の考え方
24. ③ 紙とWebの 違いとは？
25. 専門用語と使用ソフトは イメージつきやすいかと思います。
26. 専門用語 ・下版 ・DICカラー ・色校 ・ワイヤーフレーム ・レスポンシブ ・モーダル ・ ・ ・ ・ ・ ・ 紙 WEB
27. 使用ソフト ・イラストレーター ・インデザイン ・フォトショップ ・XD ・Sketch ・Figma ・ ・ ・ ・ ・ ・ 紙 WEB
28. 特に思う相違点3つ
29. 「制作工程」
30. 紙はデザイン→印刷（刷ったら変更不可） デザイン ↓ コーディング（変更可能）
31. 「将来性」
32. 紙は基本、印刷したら終了 Webサイトは 完成した後も変更可能。 更新やメンテナンスが必要。
33. 「異なるデバイス」
34. 紙は他紙面へ展開することがある。が、常ではない。 パソコン、タブレット、 スマホで閲覧できることが 求められる。 （レスポンシブ対応）
35. WEBデザイナーならではで求められること
36. 将来的変更、 多様な使用デバイス表示 に備えた コーディングしやすい デザイン
37. そのために
38. デザイナーはコーディング知識を網羅する 必要は無いかもですが、
39. 自分のデザインはその後 どの様に実装されていくのか。 その配慮をするための 知識が必要
40. だと思いました。