Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
Significance and application of engineers learn...
Search
takanorip
July 06, 2019
Design
3.8k
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Significance and application of engineers learning design
takanorip
July 06, 2019
More Decks by takanorip
See All by takanorip
今さら理解するウェブフォントver.2026
takanorip
3
1k
AI-Slopなデザインを生まないためのデザインプロセス戦略
takanorip
10
6.4k
「見せる」登壇資料デザインの極意
takanorip
7
1.9k
Design System Documentation Tooling 2025
takanorip
3
3.2k
デザインエンジニアの延長にデザインマネージャーとしての可能性を探る
takanorip
1
1.4k
Tools for Design Engineers other than LLM in the LLM era
takanorip
1
930
Bulletproof Design System with TypeScript
takanorip
7
5.5k
Eleventy3.0 で始める爆速個人ブログ開発!
takanorip
0
330
Webフォント選定の極意!フォントの基本から最新トレンドまで徹底解説
takanorip
6
1.2k
Other Decks in Design
See All in Design
【CEDEC2026】アートとゲームデザインをつなぐVFX設計『GRANBLUE FANTASY: Relink - Endless Ragnarok』における表現と可読性の両立
cygames
PRO
2
1.6k
【2026】ポートフォリオ_大坪明日香
tsubo52
0
130
1000人規模の組織でデザインハーネスを導入するための第一歩
pkshadeck
PRO
5
4.4k
【Designship2026】「社内受託中心部署」から、事業とカルチャーを動かすデザイン組織へ
sugiyama_sukedachi
0
200
ポートフォリオ_あやの
ngyenmazt1412
0
2k
RawrXD: The Sword
seanvraj_arts
0
210
「おすすめ」はなぜ信用されないのか - 信頼を築くUI/UX設計
ryu1013
0
340
【CEDEC2026】派手さと見やすさは両立できる!『Shadowverse: Worlds Beyond』エフェクト・3D背景の超進化したビジュアル設計
cygames
PRO
2
2.3k
Basket_of_love.pdf
terencebasart
0
360
HeartLanguage - DesignProcess
heartlanguage
0
280
分裂するデザイン、取り残される空間—インクルーシブデザインスタジオが建築をやる理由
culumu
0
170
デザイナーがいない部署にハーネスを設計する
kenichiota0711
5
5.7k
Featured
See All Featured
GraphQLとの向き合い方2022年版
quramy
50
15k
Leveraging Curiosity to Care for An Aging Population
cassininazir
1
540
Impact Scores and Hybrid Strategies: The future of link building
tamaranovitovic
0
470
Imperfection Machines: The Place of Print at Facebook
scottboms
270
14k
Designing Powerful Visuals for Engaging Learning
tmiket
1
620
16th Malabo Montpellier Forum Presentation
akademiya2063
PRO
0
420
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
techseoconnect
PRO
0
500
エンジニアに許された特別な時間の終わり
watany
109
250k
Reality Check: Gamification 10 Years Later
codingconduct
0
2.3k
The Pragmatic Product Professional
lauravandoore
37
7.5k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.9k
My Coaching Mixtape
mlcsv
0
360
Transcript
1 エンジニアがデザインを学ぶことの意義とその応用 Takanori Oki @BCU30 2019/07/06 Copyright © 2019 FOLIO,
Ltd. All Rights Reserved.
自己紹介 @2 • 大木尊紀 / takanorip • 株式会社FOLIO フロントエンドエンジニア •
オンライン証券会社 • https://corp.folio-sec.com/ • フロントエンドエンジニア・デザイナー絶賛募集中! • React / Web Componets / Figma / ウェブフォント / etc...
デザイン? @3
デザインの定義 @4 「デザインとは、ものづくりやコミュニケーションを通して 自分たちの生きる世界をいきいきと認識することであり、 優れた認識や発見は、生きて生活を営む人間としての喜びや誇りを もたらしてくれるはずだ」 原研哉 「デザインのデザイン」
デザインの定義 @5
デザインの定義 @6 語源はラテン語の「Designare(設計)」
デザインの定義 @7 デザイン ≠ グラフィックデザイン
デザインの定義 @8 グラフィックデザイン 建築デザイン サービスデザイン ウェブデザイン モーションデザイン DTPデザイン デザイン インターフェースデザイン
デザインの定義 @9 インターフェースデザイン
インターフェースデザイン @10 コンピュータの性質を どのように人間の活動に 結びつけるか
インターフェースデザイン @11 インターフェースデザイン UIデザイン ユーザビリティ その他
認知科学 心理学 人間工学 @12 学術的視点
インターフェースデザインは 至極論理的であり 感性の世界ではない @13 インターフェースデザイン
なぜエンジニアが デザインを学ぶのか? @14
作ってるものが「良いもの」なのかどうか 判断するための基準を持つため @15 デザインを学ぶ理由 自分が作ってるものが「良い」って自信持って言える?
制作会社のフロントエンドエンジニア時代 @16 takanoripの話① ディレクターとデザイナーの立場が強い会社だった。 僕は何もわからないままデザイナーが作ったデザインを実装し再現した。 「これは本当に使う人にとって良いものなのか?」 何もわからなくて何も言えなかったのが悔しかった。
「何を作るべきか」を 考えるため @17 デザインを学ぶ理由 良いプロダクトを作るためには必要なものを見極めることが必要
FOLIOでのto Cサービス開発 @18 takanoripの話② 投資初心者向けのサービスという 前例のないサービスなので、みんな手探り状態。 「何を作るべきか」「今何が必要なのか」という議論を繰り返してる。 エンジニアとしての意見にデザイン的な視点を加えると、説得力が増す (頭でっかちになってはいけないけど)
デザイナーやビジネスサイドの人との コミュニケーションを円滑にするため @19 デザインを学ぶ理由 スムーズなコミュニケーションには共通言語が必要
@20
前職でto Cのサービスを立ち上げたとき @21 takanoripの話③ サービス立ち上げ時は人数が少ないし仕様なども流動的になりがち。 そういうときにデザイナーの意図を汲み取れると 無駄なコミュニケーションが減り、関係が良くなる。
デザインを 成長・キャリアにつなげる @22
どんなキャリアがありそう? @23 キャリア・成長につなげるために
そのままエンジニアとして プロダクト開発に貢献 エンジニア デザイナーとエンジニアの つなぎ目、土台整備 デザインエンジニア よりマネジメントに注力 弊社ではこのパターンが多い PdM @24
キャリアの例
でも… @25 キャリア・成長につなげるために
@26 キャリア・成長につなげるために • デザイナーじゃないから仕事で使う機会がない… • デザインはデザイナーの仕事だしエンジニアが口を挟むなんて… • どうやって勉強すれば良いかわからない…
機会は自分で作る! @27 キャリア・成長につなげるために
機会は自分で作る! @28 • プライベートでなにか作る • 仕事で作っているもののUI改善を提案してみる • ミーティングで発言してみる • デザイナーと話してみる
• etc...
デザインはチーム全員の仕事! @29 キャリア・成長につなげるために
「融けるデザイン」 「スペキュラティブデザイン」 「なるほどデザイン」 本を読む 僕は個人サイトとか 雑誌とか 名刺とかを作ってます 個人で何かつくる 既存のデザインに対して 批評してみる
(文句言うのとは違うよ) デザイン批評する @30 How to study Design
THANK YOU!