Link
Embed
Share
Beginning
This slide
Copy link URL
Copy link URL
Copy iframe embed code
Copy iframe embed code
Copy javascript embed code
Copy javascript embed code
Share
Tweet
Share
Tweet
Slide 1
Slide 1 text
1 エンジニアがデザインを学ぶことの意義とその応用 Takanori Oki @BCU30 2019/07/06 Copyright © 2019 FOLIO, Ltd. All Rights Reserved.
Slide 2
Slide 2 text
自己紹介 @2 • 大木尊紀 / takanorip • 株式会社FOLIO フロントエンドエンジニア • オンライン証券会社 • https://corp.folio-sec.com/ • フロントエンドエンジニア・デザイナー絶賛募集中! • React / Web Componets / Figma / ウェブフォント / etc...
Slide 3
Slide 3 text
デザイン? @3
Slide 4
Slide 4 text
デザインの定義 @4 「デザインとは、ものづくりやコミュニケーションを通して 自分たちの生きる世界をいきいきと認識することであり、 優れた認識や発見は、生きて生活を営む人間としての喜びや誇りを もたらしてくれるはずだ」 原研哉 「デザインのデザイン」
Slide 5
Slide 5 text
デザインの定義 @5
Slide 6
Slide 6 text
デザインの定義 @6 語源はラテン語の「Designare(設計)」
Slide 7
Slide 7 text
デザインの定義 @7 デザイン ≠ グラフィックデザイン
Slide 8
Slide 8 text
デザインの定義 @8 グラフィックデザイン 建築デザイン サービスデザイン ウェブデザイン モーションデザイン DTPデザイン デザイン インターフェースデザイン
Slide 9
Slide 9 text
デザインの定義 @9 インターフェースデザイン
Slide 10
Slide 10 text
インターフェースデザイン @10 コンピュータの性質を どのように人間の活動に 結びつけるか
Slide 11
Slide 11 text
インターフェースデザイン @11 インターフェースデザイン UIデザイン ユーザビリティ その他
Slide 12
Slide 12 text
認知科学 心理学 人間工学 @12 学術的視点
Slide 13
Slide 13 text
インターフェースデザインは 至極論理的であり 感性の世界ではない @13 インターフェースデザイン
Slide 14
Slide 14 text
なぜエンジニアが デザインを学ぶのか? @14
Slide 15
Slide 15 text
作ってるものが「良いもの」なのかどうか 判断するための基準を持つため @15 デザインを学ぶ理由 自分が作ってるものが「良い」って自信持って言える?
Slide 16
Slide 16 text
制作会社のフロントエンドエンジニア時代 @16 takanoripの話① ディレクターとデザイナーの立場が強い会社だった。 僕は何もわからないままデザイナーが作ったデザインを実装し再現した。 「これは本当に使う人にとって良いものなのか?」 何もわからなくて何も言えなかったのが悔しかった。
Slide 17
Slide 17 text
「何を作るべきか」を 考えるため @17 デザインを学ぶ理由 良いプロダクトを作るためには必要なものを見極めることが必要
Slide 18
Slide 18 text
FOLIOでのto Cサービス開発 @18 takanoripの話② 投資初心者向けのサービスという 前例のないサービスなので、みんな手探り状態。 「何を作るべきか」「今何が必要なのか」という議論を繰り返してる。 エンジニアとしての意見にデザイン的な視点を加えると、説得力が増す (頭でっかちになってはいけないけど)
Slide 19
Slide 19 text
デザイナーやビジネスサイドの人との コミュニケーションを円滑にするため @19 デザインを学ぶ理由 スムーズなコミュニケーションには共通言語が必要
Slide 20
Slide 20 text
@20
Slide 21
Slide 21 text
前職でto Cのサービスを立ち上げたとき @21 takanoripの話③ サービス立ち上げ時は人数が少ないし仕様なども流動的になりがち。 そういうときにデザイナーの意図を汲み取れると 無駄なコミュニケーションが減り、関係が良くなる。
Slide 22
Slide 22 text
デザインを 成長・キャリアにつなげる @22
Slide 23
Slide 23 text
どんなキャリアがありそう? @23 キャリア・成長につなげるために
Slide 24
Slide 24 text
そのままエンジニアとして プロダクト開発に貢献 エンジニア デザイナーとエンジニアの つなぎ目、土台整備 デザインエンジニア よりマネジメントに注力 弊社ではこのパターンが多い PdM @24 キャリアの例
Slide 25
Slide 25 text
でも… @25 キャリア・成長につなげるために
Slide 26
Slide 26 text
@26 キャリア・成長につなげるために • デザイナーじゃないから仕事で使う機会がない… • デザインはデザイナーの仕事だしエンジニアが口を挟むなんて… • どうやって勉強すれば良いかわからない…
Slide 27
Slide 27 text
機会は自分で作る! @27 キャリア・成長につなげるために
Slide 28
Slide 28 text
機会は自分で作る! @28 • プライベートでなにか作る • 仕事で作っているもののUI改善を提案してみる • ミーティングで発言してみる • デザイナーと話してみる • etc...
Slide 29
Slide 29 text
デザインはチーム全員の仕事! @29 キャリア・成長につなげるために
Slide 30
Slide 30 text
「融けるデザイン」 「スペキュラティブデザイン」 「なるほどデザイン」 本を読む 僕は個人サイトとか 雑誌とか 名刺とかを作ってます 個人で何かつくる 既存のデザインに対して 批評してみる (文句言うのとは違うよ) デザイン批評する @30 How to study Design
Slide 31
Slide 31 text
THANK YOU!