人工知能と商業デザイン

[非公開ページ]

人工知能と商業デザイン


はじめに

ITの世界は日進月歩である。次から次へと新しい技術が登場し、デジタル製品やサービスに取り込まれていく。この業界で働く人たちは、仕事をしながら学習し続けなくてはいけない。引退するまで勉強が続く。特に、テクノロジーに依存しているWeb(ウェブ)開発やデザインなどは、複雑・高度化が進み、やるべきことが増えているのだ。私は、専業である「電子出版」を実践しながら「読書階層構造」を持つデジタル教科書のテストを続けていた。デジタル本によって教育コストを飛躍的に下げることが可能だと考えていたからだ。

読書は「階層構造」を持つ。例えば、基礎知識がないと内容が理解できない「専門書」などは、下位にその本を読むために必要な複数の初心者向けの本が連なる。基礎知識がないまま、わかる部分だけをつまみながら読むこともできるが、「誤読」してしまう可能性が高いため、私は可能なかぎり避けている。「読書階層構造」は、政治や経済、歴史、科学、医療など、あらゆる分野に存在する。

この構造を理解している図書館員や書店員などは、本を探している人たちに「こちらの本も見ておくと、より理解しやすいですよ」などと教えてくれる。「専門書Aの「入門」に適した本は、この参考書Bです」、「この著者の最新作は10年前のデビュー作を先に読むことで2倍楽しめます」等々。私はロボティクスの取材活動を開始する際、事前学習を兼ねて、ロボット技術に関する専門書を手に入れた。ただ、初めての分野だったので、専門書は一旦保留にして、まず、子ども向けのロボット図鑑からスタートし、小学生向け、中学生向け、とレベルを上げながら、1カ月くらいの時間をかけて、専門書や論文が読める環境に近づけていったのである。


これを「読書階層構造」で見ると、下位に子ども向けの図鑑や学生向けの読み物、教科書、参考書などがあり、上位に基礎知識がないと理解しにくい専門書が配置されている。そして最上位には学術論文などを置く構造になっている。わからない箇所を調べながら、難解な専門書を読み進める方法は一見効率がよさそうに思えるが、高い確率で「誤読」する。なぜなら、知識の欠損部分を想像や思い込みで補ってしまうからだ。

この「読書階層構造」は、私がイメージしていた「新しいデジタル本」の重要な機能の一つだった。ディスプレイに表示されている本の表紙をタップすると、ぞろぞろと、その下に別の本が出てくる。第2階層、第3階層と下方向に伸びていくイメージだ。表紙をプレスすると、「この本には技術に関する解説がありませんが、こちらの本の第2章で補完することができます」といったポップアップを表示する。このシステムを利用すれば「埋れている良書」を浮上させ、再評価のきっかけを与えることも可能だ。

このようなシステムは、図書館員や書店員の暗黙知を形式知化した仕組みであり、デジタル本ならAI(人工知能)のテクノロジーによって、実現できるのではないかと考えていた。夢物語だったAIも2014年以降、急速に発展。私たちにとって身近な技術になりつつある。本書は「ある特定の分野に絞った読書階層構造のアプリケーション化」を「デザイン」の領域でトライアルした試行錯誤のアーカイブである。

100枚の知識カード

知識カード

知識カードの相互関係

カード番号[1]の相互関係

カード番号[8]の相互関係

知識カード作成のための構造化ノート(ビデオ)」「カード(※テスト)」



第1章 デザインの要素

クリエイティブ業界と呼ばれる「商業デザイン」の世界でも、AI(人工知能)の遍在化は間違いなく進む。第1章ではデザインの要素を取り出し、非デザイナーでも日常生活の中でさまざまなデザイン行為があることを提示する。


  1. レイアウト
  2. 空間レイアウト
  3. 回覧性
  4. 動線
  5. 秩序
  6. 主見出し
  7. 脇見出し
  8. 整列
  9. 整理
  10. 整頓
  11. 整理整頓
  12. ヨゼフ・ミューラー=ブルックマン
  13. ブロック
  14. カラム
  15. モジュール
  16. 錯視
  17. 規則性
  18. SN比
  19. ノイズ
  20. 地と図
  21. 重量
  22. ポスター
  23. 挿し絵
  24. 飾り罫線
  25. デザイン構成力
  26. 比較広告
  27. 写植
  28. メタモルフォーゼ


第2章 構造と視覚表現の分離

1980年代半ば、デザインのデジタル化が急速に進展し「手作業によるデザイン」が消滅した。ロットリングがマウスに変わり、写植がデジタルフォントに代替されてしまった。第2章では印刷媒体の領域に近づくWeb媒体を説く。


  1. マークアップ
  2. 物理レイアウト
  3. 論理レイアウト
  4. リニアライズ
  5. リフロー
  6. スタイリング
  7. CSSによる視覚表現
  8. 浮動化
  9. リキッドレイアウト
  10. フィックスドレイアウト
  11. デスクトップ
  12. ディスプレイの方向
  13. メインコンテンツ
  14. サブコンテンツ
  15. ナビゲーション
  16. モバイルファースト
  17. ファーストスクリーン
  18. 伸縮可能なデザイン
  19. Responsive Web Design
  20. スキュアモーフィックデザイン(Skeuomorphism)
  21. フラットデザイン(Flat design)
  22. サムネイル
  23. ガイドライン
  24. 吸着
  25. ページテンプレート
  26. フォールバック
  27. スワイプ
  28. 拡張技術

第3章 思考と記憶

デザイン作業を効率化・自動化するためのAI活用はすでに進められており、代替できる作業は多い。では、情緒的価値を生み出すようなデザインワークはどうだろう? 直感やインスピレーションが源泉となる事柄を見ていきたい。


  1. Rough consensus and running code
  2. SFプロトタイピング
  3. デザインフィクション
  4. レスポンシブ・アーキテクチャ
  5. 枯れた技術の水平思考
  6. Tech Box
  7. 臨場感と記憶
  8. ケータイ小説
  9. 魅力的なプロダクト
  10. メンタルモデル
  11. ローレン・エンバーソンの実験
  12. システム思考
  13. U理論
  14. デザイン思考
  15. 統合思考
  16. セオリー
  17. 万人向け
  18. 新奇性
  19. 垢抜けない感じ
  20. ”トンがった”雑誌
  21. 情緒的価値
  22. TPO
  23. コンテキスト


第4章 クリエイティブAI

AIは「創作が苦手」と言われているが、AIによる絵の描画や作曲など創作分野におけるさまざまな実験が世界中でおこなわれている。AI単独ではなく「人間との協業」であれば、すでに事例がある。第4章はクリエイティブAIの本質に斬り込む。


  1. 人工知能
  2. 人口無能
  3. 問題特化型AI
  4. クラウドAI
  5. 機械学習
  6. 深層学習(ディープラーニング)
  7. GPU(Graphics Processing Unit)
  8. ビッグデータ
  9. ニューラル・ネットワーク
  10. セマンティックWeb
  11. シンギュラリティ
  12. クリエイティビティ
  13. Adobe Creative Cloud
  14. Adobe Sensei
  15. コンテンツ・インテリジェンス
  16. Wix ADI
  17. チャットボット
  18. サブボット
  19. ユニバーサルボット
  20. ダークソーシャル
  21. グレートデカップリング