FUJILOG

見た、聴いた、触れたこと。 動かしたもの、書いたもの。 ウェブとリアルの備忘録です。

参加録「デザインのつくり方 - dots. Conference Spring 2016 -」

開催概要

@dots 渋谷
2016/02/26 13:00-
テーマ「デザインの作り方」

1 The Invisible Languages of Graphic Design

2 冒険するデザイン

3 Designing the Creative Process

4 小さなチームでのデザイン


1 The Invisible Languages of Graphic Design

株式会社ライゾマティクス 木村 浩康氏 / 田中 陽氏
モデレーター 株式会社 電通 菅野 薫氏
木村さん アートディレクション
田中さん デザインエンジニア
データドリブンなデザインフロー
ライゾマティクスではだいたいデータドリブン
対象物をデータで扱う
その意図
3Gのライゾマ展のコンセプトに添って(ギンザ・グラフィック・ギャラリー)

グラフィックデザインの死角

3G 346回企画展
統計的なデザイン
田中一光から2000枚から299色を統計抽出してデザインしたポスター
白、黒は必須
どの色にも
→1色だけ使わない色を、死角としてアピール
紙も、書体も膨張体。田中一光さん草案の。
昭和を代表する。3Gの発起人で田中一光さんにした。

配色(色彩の移動)

300個のノード
CMYKをスキャンしてRGBにしてクラスタつくる
150個抽出
各アーティストの代表色をPythonで抽出。
横尾忠則さんVer.、田中一光さんVer.、永井さんVer.とある。
アプリにして展示したり。

構成

全ポスターに
画像解析
人力と機械的解析
顕著性マッピング
顕著7パターン。
そのうちマッチしたものから、20パターン出す。

濃淡

顕著性マップ
見せたい箇所の炙り出し。
グラフィックとタイポグラフィの調和

感性

スクリーン、モニタの解像度ちがう
四季の表現

死角

グラフィックの要素の組み合わせ。
顕著性マップ
個体差うまれないので、特徴部でトリミング
配色
トリミング後の顕著性マップ
さらにそれに近いポスターを選んでタイポ置く

TransLyrics project

世界中のこんにちは
言葉のメタファ
コンテンツの
Perfumeの歌詞を
日本語
意味
解釈
言語の壁を超える TransLyrics
参加型Project
 パラグラフ単位で翻訳が可能
 Share、議論できる
→ファン同士が高め合う

Future Ticket

真鍋大度さんとも思いついた
月曜着想、水曜企画、土曜本番
国立競技場で、改築される前の記録の保持。 全方位からの写真を集める。デジタルで復元する。

NIKEプロジェクト

バスケットボールの練習風景のビジュアライゼーション、練習効率の改善。

TOMODO Project

反射材を塗る
60インチディスプレイくる
カラーパレット
位置でまわす
塗っていてきもちいいか、をテーマとした作品。

北陸新幹線開通の前

丸の内KITTEでコンサート
演奏同期
譜面はもらっていた
譜面上にMIDIをうっておいて
MIDIについて
 BPMを手動ピッチで合わせていく
 指揮者にあわせてピッチをVJ的にやる
音声をMAXで制御、ビジュアルをAF
照明テスト
会場空間を染める
大阪
北加賀屋駅に賃貸リノベーション
8室のアーティスト
うち1部屋がライゾマティクス担当
来月
記憶の記録
自己完結でなく。
データに刺激を受けて。
3Gの企画展、5月末からは京都のDDDで開催予定。

2 冒険するデザイン

SHIFTBRAIN Inc. 鈴木 慶太朗氏 / 安友 裕秋氏
@ktrszk
フリー→シフトブレイン
31歳
@kaminaly
バンドマン→シフトブレイン
32歳
デザイン*アイデア
Making=Adventure
なににアウトプットするかで悩む
3重苦
 Flashなくなった
 Deviceたくさん
 レスポンシブデザイン
空気感をどういれようか考える
空気感の要素4つ
 Brand Image(受け継がれるもの)
 Purpose
 Target
 Competitor
P.I.C.S.さん案件
 レスポンシブ
 WPで更新できる
BrandImage
 感じたこと
 秘密基地みたいだった
Purpose
 営業ツール
 信頼感
Target
Competitor
ルールをつくる
 レスポンシブ
 マルチデバイ
 使いやすい
 Videoは使いたい
 新しいこと
ロゴをリニューアル
最近こんな面白いことしてるよ
新しいこと、先進性
信頼感のある会社
信頼感ありつつ、その中で血液が熱い+WebGL
デベロッパーに相談
エンジニアからみると
 よくわからんオーダーが来る
 擬音がすごい
構造はちゃんと考える
ここはCMSにするとか、スタッフ紹介いれる
レスポンシブしっかりしたかった
こういうふうのいいですよねっと提案
デザインは大変
Choose Your Role
ブランドイメージ
 絵を見るとそっちに気持ち奪われる
 ニュートラルの状態
肩書をわけた
 フロントエンド(マークアップCSS
 インタラクティブデザイン(アニメーション、モーション)
人生設計
 人生のデザイン

3 Designing the Creative Process

PARTY 中村 大祐氏 / 阿久津 達彦氏
Tokyo, NY
Creative Labする
代理店出身者と製作者のレイヤー
日進月歩
社訓:知らない人と知らないものをつくる
2015年
サンスター
GUM Play
歯磨きを楽しくする
成田空港の第3ターミナル
陸上トラック
GREEN
電通とCDC局
4 CreativeDirector
25人くらいのPM, Designer, Enginner
中村大祐さん テクニカルディレクター
阿久津達彦さん Information Architect
課題
→アイデア
→エグゼキューション
課題、すごい、大事。
今回はエグゼキューションのはなし。
仕事の最終形、エグゼキューションしか見ない。
似たエグゼキューションでも、おなじクリエイティブプロセスは存在しない
工夫
時間、予算は限定
最高のエグゼキューションのための全体ルートを設計すること
誰がデザインするか?
エグゼキューションに関わるすべてのプロフェッショルたち

CaseStudy

ハルヒハンティング

パチンコ
ムービーの切り出し、それを集めてムービーができる(616枚)
課題抽出を徹底
 スマホ撮影状態
 707枚のすべて異なる入稿物
 完成映像とメディアの割り付け(Musicムービーとして、どうやったら見応えが出るか)
→これらは3つ絡み合っている
例:
100枚目までは屋外
200枚目は雑誌で。
企画:
サビは残しておきたいとか
Design
 Kaibutsu
Front
 Bascule
Back
 FishGrove(マーカーレスのAR)
連携取りながらやる
まず、QRコードはつかわない
スマホでアップするだけ
マーカーレスの認識
FishGroveさんからアイデアもらいつつ
天候の色み、角度ごとの
マーカレス+4隅のマーカー。
Kaibutsuデザインもらう&AR
画像変換(消失点で曲げる)
707枚
 正方形も、横長もある
 フレームのずれ
 画像、映像のアスペクト比
 正確な入稿物
 人力、デザイナー廃人?入稿ミスの可能性。
イラストレーターにて自動化
画像707枚
マーカー707枚
フレーム数タイプ
アスペクト比CSV(.aiファイル)
自動化
 画像の4隅のマーカー配置
で、入稿用ファイルを作成
大量入稿物対策OK

完成映像とメディア割り付け

 バスキュール社製のWeb確認ツール
 どのように見れるか707枚チェック
 問題なければ入稿データ策背
 アスペクト比 97*60で特殊
折り込みチラシ等はSpreadsheetでチェックした
入稿から配布までフロー
「方法」や「道具」をつくる
 新しいアルゴリズムつくる
 落とし穴を避けるための
 最終版が見れるようにする

TOYOTA FCVカー

子どもたちブース体験の提供。
ドーム型のブース。
2つのタイムマシン
 化石燃料から水素燃料。
 2030年のタイムスリップ。
 家族連れが多い。
子どもたち2030年
おとなたち、子どもたちの成長を見れる。
水素社会ってなんか良い。のイメージを見てもらう。
 こども=演者、おとな=観客
のプレゼンテーション

課題の発見

①360ド古ドーム型インタラクティブ体験
②シナリオ&インタラクションの組み立て
③シュアな運用設計
Degin
 PARTY(CG)
CG
 白組 ※前回モーターショー時以来
Development
 1-10 design
紗膜
透過膜
遮光膜 ←採用
消防法
明るさ
設計
悩んでいたら解決?
大量のメッセージ
を3分のインタラクションで表現
絵コンテ
 +アクション
新しいことをやる
DemoDayを4月にやります
 ものづくりにフォーカスにする

4 小さなチームでのデザイン

TYMOTE(ティモテ) 村井 智氏
2008年学生卒業後に起業
グラフィック
プロヂュース
村井さん
 アニメーション
 3DCG、モーション、手書きアニメーション
 音楽もつくる
幼い
馬かぶる
年齢を見せない
9人うち5人役員
根拠ない自信、ソフトあれば平気という
「ワークフロー」をデザインする
チームのおもしろさ
担当:
 Movie
 Graphics
 Music
 Art
 Produce
ワークフロー①
イッセイミヤケのデザイン
商品画像をつかったタイポグラフィ
ワークフロー②
TV企画
 音楽を汲んでMovieでやる
 Graphicsもそこに乗る
ぶつかり合いながらの葛藤、
予期しない動き、良い化学反応が生まれる
モーションだけでなくグラフィックが乗る
日に日にチカラをつける
文字をきれいになる
イージングの有無
すべての領域を近いメンバーと一緒にこなすと、自身の力が増幅される。
 Movie
 Graphics
 Music
 Art
 Produce

以上です。 刺激的で学び多い内容でした。