Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.

実践して学ぶデザインの要素 by Life is Tech !

実践して学ぶデザインの要素 by Life is Tech !
2015/4/20 @ TECH LAB PAAK
http://techlabpaak.com/events/480

  • Identifiez-vous pour voir les commentaires

実践して学ぶデザインの要素 by Life is Tech !

  1. 1. 金澤直毅 Naoki Kanazawa 1982 WEB & GRAPHIC Rikkyo Univ. > Design Company > Instructor > Freelance > Life is Tech ! life-is-tech.com DESIGNER designless.net
  2. 2. SUMMER CAMP 2015 中高生向け IT & プログラミングキャンプ
  3. 3. TECH LAUNCH AUDITION 中学生・高校生・学生のための起業・開発支援オーディション
  4. 4. HATSUNE MIKU ONEDAY クリプトン・フューチャーメディア × Life is Tech ! illustration by iXima © Crypton Future Media, INC. www.piapro.net
  5. 5. Be Startup Be Startup 中学生・高校生のための起業体験プログラム
  6. 6. Code Girls 女子中学生・高校生のための IT ワークショップ
  7. 7. TECH for TEACHERS 先生に、最先端の「情報」の授業を。
  8. 8. Life is Tech ! Singapore シンガポール支社
  9. 9. どんなデザインも 要 素 の 組 み合 わ せ
  10. 10. 組 み合 わ せ 方      デザインの 原 則 http://lit.sh/design20150318
  11. 11. 1. デザインの要素 2. フォントと色 3. アイコン実践 Menu
  12. 12. 1.デザインの要素
  13. 13. 要 素を知る Step1
  14. 14. 成り立たせているもの 「全体」の中の「部分」 要 素
  15. 15. 代 表 的 な デ ザ イン の 要 素 形 文字 空 間 色線 質感
  16. 16. 形 S H A P E
  17. 17. 形 の 役 割 物体 領域
  18. 18. 線 L I N E
  19. 19. 線 の 役 割 分割 方向 輪郭
  20. 20. 空 間 S P A C E
  21. 21. 空 間 の 役 割 2次元 3次元 図と地
  22. 22. 文 字 A あ 亜 T Y P O G R A P H Y
  23. 23. 文 字 の 役 割 言語 情報
  24. 24. 質 感 T E X T U R E
  25. 25. 質 感 の 役 割 素材 模様
  26. 26. 色 C O L O R
  27. 27. 色 の 役 割 光 印象 文化
  28. 28. Step2 要 素に分 解 する
  29. 29. lit.sh/design0420 Materials
  30. 30. 要 素 に分 解 せよ WORKSHOP
  31. 31. 形 空 間 色
  32. 32. Step3 必 要な要 素を見 極める
  33. 33. 大きさ・配置はそのままでデザインせよ WORKSHOP 世界で一番、ココロ躍る夏を。 さあ、一緒に始めよう。 冒険的で、刺激的で、ちょっぴり切ない夏を。 全力で、疾走する数日間を。 Life is Tech ! SUMMER CAMP が もうまもなく始まります。 PRE ENTRY SUMMER CAMP 2015 500pt プレゼント!
  34. 34. 世界で一番、ココロ躍る夏を。 さあ、一緒に始めよう。 冒険的で、刺激的で、ちょっぴり切ない夏を。 全力で、疾走する数日間を。 Life is Tech ! SUMMER CAMP が もうまもなく始まります。 PRE ENTRY SUMMER CAMP 2015 500pt プレゼント!
  35. 35. 世界で一番、ココロ躍る夏を。 さあ、一緒に始めよう。 冒険的で、刺激的で、ちょっぴり切ない夏を。 全力で、疾走する数日間を。 Life is Tech ! SUMMER CAMP が もうまもなく始まります。 PRE ENTRY SUMMER CAMP 2015 500pt プレゼント!
  36. 36. 世界で一番、ココロ躍る夏を。 さあ、一緒に始めよう。 冒険的で、刺激的で、ちょっぴり切ない夏を。 全力で、疾走する数日間を。 Life is Tech ! SUMMER CAMP が もうまもなく始まります。 PRE ENTRY SUMMER CAMP 2015 500pt プレゼント!
  37. 37. 全 体は 部 分の 総 和より 大きい Point
  38. 38. Google ゲシュタルト心理学
  39. 39. 2.フォントと色
  40. 40. フォント 書 体+ファミリー+背 景 = に お い
  41. 41. フォントファミリー Avenir Next Ultra Light Avenir Next Regular Avenir Next Medium Avenir Next Demi Bold Avenir Next Bold Avenir Next Heavy
  42. 42. 小塚ゴシック Pro EL 小塚ゴシック Pro L 小塚ゴシック Pro R 小塚ゴシック Pro M 小塚ゴシック Pro B 小塚ゴシック Pro H フォントファミリー
  43. 43. フォント の 背 景 歴史 コーポレート・ロゴ ユニバーサル・デザイン
  44. 44. うす いフォント Helvetica Neue Ultra Light Avenir Next Regular ヒラギノ角ゴ Pro W3 Times
  45. 45. か お るフォント Futura Gill Sans Didot DIN Condensed Bold 游ゴシック Bold
  46. 46. つ よ いフォント TrajanIMPACT Copperplate ���fino勘亭流
  47. 47. 色 相+ 彩 度+明 度 = トーン 色
  48. 48. ライトト ーン
  49. 49. ダ ルト ーン
  50. 50. ビ ビッドト ーン
  51. 51. ビ ビッドト ーン rgb(255, 0, 0) rgb(0, 255, 0) rgb(0, 0, 255)
  52. 52. 3.アイコン実践
  53. 53. 正 円の みを使って 「チャットアプリ」の アイコンをデザインせよ WORKSHOP
  54. 54. Example
  55. 55. 線・円・C(文字 ) を使って 「時計アプリ」の アイコンをデザインせよ WORKSHOP
  56. 56. Example C
  57. 57. 円・矩形・O(文字 ) を使って 「食」をテーマとするアプリの アイコンをデザインせよ WORKSHOP
  58. 58. Example O
  59. 59. Design?
  60. 60. Books
  61. 61. Books ポール・ランド、デザインの授業 ポール・ランドのデザイン思想 教育スケッチブックby パウル・クレー
  62. 62. RELATIONSHIPBETWEEN FORM & CONTENT by Paul Rand Design?
  63. 63. 洞 察 力 要 素を知り、 分 解し、 見 極める
  64. 64. Thankyou!
  65. 65. 19:00 - 21:3019:00 - 21:30 SHIBUYASHIBUYA presented bypresented by T E C H L A B PA A K デザインの 要 素 実 践して 学 ぶ 0420

×