AI時代の私の技術インプットとアウトプット術

by tonkotsuboy_com

Embed

Start on current slide

Slide 1

Slide 1 text

No content

Slide 2

Slide 2 text

CSSと猫が大好きです @tonkotsuboy_com 鹿野壮

Slide 3

Slide 3 text

イヤイヤ期の2歳半の子ども 17:00からは夕食・お風呂・寝かしつけ土日は家族でお出かけかわいすぎるフルタイムで社員をしながら子どもを育てています

Slide 4

Slide 4 text

去年〜今年にかけて技術イベントで19回登壇（単独15回）集客は最大1,400人 13本の技術記事執筆 1冊の書籍出版アウトプットを精力的にしている https://kano.codes

Slide 5

Slide 5 text

多くのアウトプットをするには多くのインプットが必要

Slide 6

Slide 6 text

AI時代における私のインプット・アウトプット術をシェア

Slide 7

Slide 7 text

あふれる情報とどう向き合うか 01 インプット編

Slide 8

Slide 8 text

01 受け取る情報を取捨選択する

Slide 9

Slide 9 text

SNSを開けば、いろいろな情報が溢れている「あれをやるべき」「これをしないと時代遅れ」という煽り AI時代においては更に速度が増している情報があふれかえる現代

Slide 10

Slide 10 text

「やらなくては」ではなく「やると決める」「どれも大事」ではなく「大事なものはめったにない」「全部できる」ではなく「何でもできるが、全部はやらない」グレッグ・マキューン「エッセンシャル思考」より https://www.amazon.co.jp/dp/4761270438

Slide 11

Slide 11 text

自分がこの先何を目指したいのか主体的な意識その目的を元に、今自分が必要な情報を取捨選択する全部は追わない情報を取捨選択する

Slide 12

Slide 12 text

02 私がインプットのためにやっていること

Slide 13

Slide 13 text

自動化ツールn8nで興味のあるサイトのRSSを取得海外サイトは日本語訳私が興味のありそうなネタをGeminiがフィルタリング Nano Bananaインフォグラフィックで見やすく毎朝8:00にSlackに流す興味のある技術情報だけをn8nでRSS化 https://n8n.io/

Slide 14

Slide 14 text

Slackに流れる朝のニュース

Slide 15

Slide 15 text

Nano Bananaでインフォグラフィック化して読みやすく

Slide 16

Slide 16 text

Claude Codeと対話形式で作成した n8nのワークフロー https://zenn.dev/ubie_dev/articles/6b23a74187766b

Slide 17

Slide 17 text

Xは情報のキャッチアップにやはり強力追いたい人だけを集めたXのリストを見ている Xのリスト

Slide 18

Slide 18 text

ツイートを見逃したくない人のポスト通知ポスト通知

Slide 19

Slide 19 text

Xの標準ブックマークよりも私には使いやすかった Obsidianのブックマーク機能で貯める

Slide 20

Slide 20 text

英語+日本語訳同時表示ができる日本語訳だけだと訳が正確かわからない無料も可能、DeepL ProやDeepSeekを使えば格安で高品質に英語情報はImmersive Translateで翻訳

Slide 21

Slide 21 text

英語+日本語訳同時表示の様子

Slide 22

Slide 22 text

GitHubに上がっていない情報、ブログ化されていない情報を取得したい「実際みんなはどう課題を解決しているのか？」を知りたい Grokで世界の生の声を聞く Slackbotでチームの生の声を聞く Grokで生の声を聞く

Slide 23

Slide 23 text

GrokでCCのトークンについて聞いている例

Slide 24

Slide 24 text

何を、どう発信するか 02 アウトプット編

Slide 25

Slide 25 text

01 AIに全部任せるな、魂を込めろ

Slide 26

Slide 26 text

AIで技術記事・スライド・動画のアウトプットは格段にラクになった AIにアウトプットを任せる時代

Slide 27

Slide 27 text

たしかに文体は表現できたが、魂がこもってなかった自分が自分で記事を読んでつまらなかったとくに技術記事はプログラムと違い「人が読む文章」がそのままアウトプットになる魂を込めないと人は読まない、響かない AIが全部書いた技術記事はつまらなかった

Slide 28

Slide 28 text

AIが出す文章はあくまで下書きそれを元に、基本的には全部書き換えるくらいの気持ちで文章を校正・更新していくどうやって技術記事に魂を込めるか？

Slide 29

Slide 29 text

02 私が実践しているアウトプットテクニック

Slide 30

Slide 30 text

下書き作成文章校正 markdownファイルやスライドファイルの作成スライドのレイアウト崩れがないかチェックアウトプットにおいて私がAIを使っているところ

Slide 31

Slide 31 text

アウトプットで一番エネルギーがいるのが最初のアウトプット一番最初の「下書き」をAIに作ってもらうことで、それをもとに人間が更新しやすくなる技術記事の下書き、スライド資料の元ネタ等いつか公開する技術記事の下書きをとりあえずたくさん生成 AIに下書きをつくってもらう

Slide 32

Slide 32 text

/grill-me 〇〇というテーマで発表する。登壇時間は20分。 # 構成 ## ◯◯ - ◯◯ - ◯◯ 一旦ここまでの内容をもとに、スライド資料・話す内容を手伝ってほしい２０分しかないので、あまり文章を多くしすぎず、要点だけをまとめて、キャプチャー多めで見せたい実際に話すネタとかは、talk.mdにまとめる感じ。下書き作成依頼例

Slide 33

Slide 33 text

「Marp」を使うと、マークダウンとCSSでスライドを作成可能操作対象はただの文書ファイルなので、 AIエージェントが原稿修正やスタイル修正しやすい「Marp」を使ってAIでのスライド作成

Slide 34

Slide 34 text

Marp

Slide 35

Slide 35 text

Chrome DevTools MCPを使ってレイアウト崩れを修正

Slide 36

Slide 36 text

過剰な書き込み・無意味な画像は追加しないスライドは喋る内容の補足資料過剰なスライドの読み上げに終始すると本末転倒スライド作成においてやってないこと

Slide 37

Slide 37 text

No content

Slide 38

Slide 38 text

03 まとめ

Slide 39

Slide 39 text

量は、AIで無限に増やせる。だからこそ、人間が決めることは2つだけ。何を捨てるか、選ぶ（インプット）何に魂を込めるか（アウトプット） AI時代、人間がやる仕事は2つ

Slide 40

Slide 40 text

それが、AI時代に心を平穏に保つコツです全部を追わない

Slide 41

Slide 41 text

書籍『TypeScriptコードレシピ集』が本日発売されました宣伝 https://gihyo.jp/book/2026/978-4-297-15628-2

Slide 42

Slide 42 text

XでフロントエンドとAIの情報を発信しています @tonkotsuboy_com