Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
コーディングがわからない
Search
mikakane
December 29, 2019
Technology
160
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
コーディングがわからない
mikakane
December 29, 2019
More Decks by mikakane
See All by mikakane
NestJS で始める怖くないバックエンド開発
mikakane
1
1.4k
Web制作現場のディレクションを支えるGitHub
mikakane
0
620
nuxt.js で plugins を作る
mikakane
0
830
@ionic/vue で Web アプリを作ってみる
mikakane
0
3k
Laravel Package Development
mikakane
16
7k
Nuxt.js x Firebase で非同期に開発する
mikakane
0
2.2k
フロントエンドで作る理由
mikakane
1
1.3k
Firebase で作る Web アプリケーション
mikakane
1
180
技術顧問の現場から - 制作と教育、学習と生産
mikakane
0
730
Other Decks in Technology
See All in Technology
Alphaモジュール使っていいのかい!?いけないのかい!?どっちなんだいっ!?
watany
1
290
変更し続けられるシステムをどう保つか — AI時代のSSoTという設計原則
kawauso
0
210
AI Driven AI Governance
pict3
0
490
誤解だらけの開発生産性 / Myths and Misconceptions about Developer Productivity
i35_267
2
820
ヘルスケア領域における AI 活用と その安全性担保のための取り組み (Leveraging AI in Healthcare and Our Efforts to Ensure Its Safety) - Google I/O Extended Tokyo 2026, July 11, 2026
zettaittenani
0
430
脱金融のフューチャー・デザイン / Future Design Beyond Finance
ks91
PRO
0
160
企業でAWS Organizationsを動かすための組織設計の考え方
nrinetcom
PRO
1
110
アップデートで何が変わった?デモで学んで使いこなすIBM Bob2.0
muehara
0
170
Genie Ontologyは銀の弾丸かを考える / Is Genie Ontology a Silver Bullet?
nttcom
0
410
個人開発で育てる「大規模設計の苗床」 - AI時代の1人開発から始める業務への知識接続 / The Seedbed for Large-Scale Design - From AI-Era Solo Projects to Professional Knowledge
bitkey
PRO
1
280
LLMやAIエージェントをソフトウェアに組み込むプラクティス
shibuiwilliam
2
430
Making sense of Google’s agentic dev tools
glaforge
1
290
Featured
See All Featured
How People are Using Generative and Agentic AI to Supercharge Their Products, Projects, Services and Value Streams Today
helenjbeal
1
240
Claude Code どこまでも/ Claude Code Everywhere
nwiizo
65
56k
Faster Mobile Websites
deanohume
310
32k
Between Models and Reality
mayunak
4
370
VelocityConf: Rendering Performance Case Studies
addyosmani
333
25k
How STYLIGHT went responsive
nonsquared
100
6.2k
Git: the NoSQL Database
bkeepers
PRO
432
67k
RailsConf 2023
tenderlove
30
1.5k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
25
2k
How GitHub (no longer) Works
holman
316
150k
The untapped power of vector embeddings
frankvandijk
2
1.8k
How to Build an AI Search Optimization Roadmap - Criteria and Steps to Take #SEOIRL
aleyda
1
2.1k
Transcript
chatbox.inc 後藤 知宏 コーディングがわからない
chatbox.inc 後 藤 知 宏 株式会社chatbox 代表取締役 関西フロントエンドUG代表 Twitter :
@_mikakane エンジニア / 技術顧問
chatbox.inc コーディングがわからない コーディングって難しくないですか? カンプシゴトって限界を感じる。
chatbox.inc px サイズ がわからない 画面の各要素、ピクセルピックしていくの、まじ で腱鞘炎になりそう Chrome の検証ツール使って ピクセル違うと か言ってくるデザインレビュー、心折れそうにな
る そこmarginじゃないです、padding です、とか 言われると死にそうになる
chatbox.inc カスケーディングがわからない CSS のカスケーディングがわからない。 「標準」が見えてこない。 こっちで設計しても、デザイン都合でガンガン 画面変わってくる。抽象と具体みたいな仕様変 更の弾力性が皆無。 結局全部ベタで指定するのが一番マシになる けど、コードレビューで怒られる。
chatbox.inc コンポーネントがわからない 共通要素が見えてこない。コンポーネントがわ からない。 見た目は同じ要素が、微妙に違うマージンもっ ていっぱい登場する。 微妙に違う2P カラーみたいなのもいる。 「微妙な違い」は後から作りミスだったことが発 覚したりする。
chatbox.inc アニメーションがわからない 画面の動きが見えない。完全に静。 ここは % なんだけど、ここは 固定なんですよ、 みたいな話が後から出てくる。まじかよ。本気 かよ。 ホバーとかアニメーションとかも伝わらない。カ
ンプが動いて見えないのは、うちの Photoshop のバージョンの問題?
chatbox.inc 属性がわからない href とかまじでわからない。何を書けば良いの か謎。 開発のチームの人が言うには、ローディングが 発生したりしなかったりするらしい。 デザイナーも把握してない、やばい。 そこは h2
じゃなくて h3 だよ、とか言われたり する。まじかよ。
chatbox.inc コミュニケーションは銀の弾丸か? この手の問題は往々にして、 デザイナーと開発のコミュニケーション、で解決されがち 時間がかかるし、調整コストも大きい 課題のほとんどは考えることではなく、デザイン設計の表明 フォーマットさえあれば、解決できるはず UI や美しさだけじゃない、 「伝わる」を意識した
DX 中心のデザイン制作プロセスで デザインに関するコミュニケーションをより本質的に
chatbox.inc Comprehensive なカンプを探して 良いものを作ろうとした時、 コーディング担当の負荷はあまりにも大きすぎる。 負荷の殆どは、考えることではなく、察すること。 基本的に不毛だし、属人化しすぎ。 だれがコーディングすることになっても、 同じような完成度になる Web
カンプの形を求めて… → ワークフロー設計的に当たり前じゃない?
chatbox.inc Scrum Fest Osaka に CfP 提出中です! https:/ /twitter.com/_mikakane/status/1211099681595330560
chatbox.inc Thanks!