⚡️初めてのLT会 Vol.10で登壇しました！！
⚡️初めてのLT会 Vol.10に参加しました！
昨日FJORD BOOT CAMPで開催された、ライトニングトーク初心者のための発表会、「⚡️初めてのLT会 Vol.10」に参加しました！
今回のテーマは「一年間で得た学びと気づき」ということで、私は「作業するときにログを書いていくと、進捗が捗るよ〜」という話をさせていただきました。
この記事では、主に発表した内容の補足と今回のスライド作成で使ったツールなどを説明したいと思います。
- ⚡️初めてのLT会 Vol.10に参加しました！
- 参加の経緯
- テーマ：ログ駆動開発
- 自分の作業の進め方（内容補足）
- 資料の作成方法（Figma）
- 練習のために使ったツール：CleanShot X
- 感想
参加の経緯
初めてのLT会自体は、以前にも登壇者として参加したことがありました。
その時の記事はこちら↓
前回登壇した時から1年以上経っていたので「そろそろ登壇しておかなければ」と思い、今回手を上げさせていただきました。主催者のparuさん、ありがとうございます！
テーマ：ログ駆動開発
「ログ駆動開発」ってちょっと言葉としては大袈裟ですね笑。ビジネス本として出したら叩かれそうですが、LTという短い尺だったので、コンパクトにタイトルつけさせていただきました。
もともとは「寄り道レトロスペクティブ」というタイトルで、今年はRailsとかGemのソースにいろいろと寄り道してきた話をしようと思ったのですが、ボリュームが大きすぎたので、その話の中で「どうやって難しい内容に対しても安定して進捗を出していくか」というセクションだけ切り出した内容が今回の話になります。
話している内容的には、以下の記事と多少オーバーラップするところがあるので、気になる方はこちらも読んでいただければ
ここからツールの話多めです
自分の作業の進め方（内容補足）
LT会での質問で
- どこにログを書いているか
- どんな内容を書いているかみてみたい
という内容がありました。LT会中も話した部分はありますが、このブログで一連の作業ルーティンを補足として説明させてもらればと思います。
どこにログを書いているか
ログはすべてScrapboxに書いています。やり方としては1日ごとにページを作成して、その中に書いていくようなイメージです。
この記事で書いた内容と変わっていないのですが、次のように日報作成ボタンをJavaScriptでカスタムしているので、それを使って今日のページを作成します。
←[2021/12/17]：[2021/12/19]→
[{ 日報]
[*** 👍やったこと]
[_]
[*** 🎓学習したこと]
[** 【わかったこと】]
[** 【わからなかったこと】]
[*** 🥷次にやること]
[*** 🍘感想・余談]
[{ ライフログ]
チェックボックスや「日報」の見た目はCSSで拡張してわかりやすいように表示しています。 （長くなるのでコードは割愛します。どっか別の記事で書くと思います）。
「日報」のセクションは、そのままFJORD BOOT CAMPで提出するための日報テンプレートになっています。
で、「ライフログ」のセクションが今回のLT会でお話ししたログを書く場所です。ここにログを記載していきます。
どういう風にログを書いているか（ルール）
ルールはあまりありませんが、
- 日付と時刻を入力する
- 内容が後から参照できそうなら別のページに切り出す
- あとでページになりそうな内容は、とりあえずリンクにしておく
という感じでやっています。
日付と時刻の入力
Scrapboxでは⌃ + Tで日付を入力することができます。3つのフォーマットがあるのですが、3回押した際に出てくる時刻入りのフォーマットを使って、ログの入力を開始します。
時刻を入力するタイミングは厳密には決めていませんが、時間が経っていたり、内容が変わるときには大体日付を入力し直すようにしています。
別のページへの切り出し
ログを書いている中で、「これまた見返しそうだな」と思ったり、独立した内容になっていたら、その部分を選択して「New Page」を選択することで別ページに切り出しています。
こうすることで後から参照しやすくなります。
とりあえずリンクにしておく
ログを書いていると、「この単語後からまとめたいけど、今は時間ないな」「こういう概念でまとめておいたら、自分の考えがまとまりそう」みたいな要素に出会うことが多々あります。
そういう時は文中で、積極的にリンク（[リンクにしたい単語]）を利用していきます。たとえその時点でメモを作らなくても、あとでメモを見返したときに「あ、ここ追記しておこう」という感じで、過去のログから知識が進化する余地を残せます。
タグの機能も使えますが、基本的にはコンテキストの中で自然に残せる内容はリンクとして雑に定義する方針を取っています（こうしておくと自分のメモ見返すの楽しいんですよ）。
どういう風にログを書いているか（実例）
ライフログの中に個人的な内容も書いているので、ある時からScrapboxをprivateにしてしまいました。なので抜粋してお届けします。
気持ちの整理
本来であればタスクを整理→作業開始、くらいの感じだと思うんですが、やる気が出なかったようなのでタスク整理する前に気持ちを整理しているメモです。
自分で自分を鼓舞していること、今自分の身に起きていることをとにかく書き出していることがポイントです。
レビューしてもらった内容があまりいいものではなくて、気持ちが落ち込んでしまった時のログです。 なんだかモヤモヤしてしまって、「明日作業するのだるいな〜」と思っていたので、その日のうちに頭の中にあることをとにかく書き出しました（この後めちゃくちゃ寝て、翌日朝から快調に作業ができました）。
「悔しい！劣等感だ！いつだって上がり調子でいたい」「でもこの劣等感はずっと味わっていなかった感情だ！！！うれしくもあるぞ」
見返すと恥ずかしいですが、当時の自分はこうやって吐き出せたことで、悩んでいた時間は5分くらいだった模様です。
普通のログ
普通のログは結構やった作業を全部書いていることが多いです。
一番最後に「気になることを書き出してみよう」と書いていますが、このパターンは結構使っていて、実装中もできるだけ頭の中は空っぽにして、今やっていることだけにフォーカスするのに役立っています。
だいたいこのパターンの後に「よしじゃあひとつずつ見ていこうか」「全然わからんな」「本当？今自分が知っていることは何？」みたいな常套句が続きます。
これはリファクタされたメモの例で、ログを振り返ると全然書いていないように見えるんですが、例えば「国民健康保険・国民年金・住民税の計算方法」は次のように別のページとして成立した内容になっています。
これは技術全然関係ないですが、例えば「PostgreSQLでエラーになった」とか「Railsで例外発生」みたいな事象にあったときには、とことんログを書きながら調べていって、後から別ページに切り出すと、検索性も高くなってとても良きです。
その他のScrapboxの使い方（Scrapbox用のクライアント、各種スクリプト）については別の記事で紹介したいと思います（長いんで）。
資料の作成方法（Figma）
発表中、資料内のイラスト等にも質問をいただきましたのでここに書いていければと思います。
資料はFigma
今回の資料はFigmaで作成しました。結局Keynote使ったの前回の一回だけだった笑
Figmaを使う理由は
- 色やフォントをストックしておける
- コンポーネントを使える
- スライドを一覧しやすい
という理由です。
今回のテーマと色選定用ツール
今回は「ログ」についてのお話でした。ログの語源って「ログブック」つまりは「航海日誌」なんですよね。なので、スライドのテーマになっているのは船です。
季節的には冬だったので、冬の夜の暗い海とそこに灯る赤い船のライトをイメージしたカラーにしたらいいかな〜と思っていました。
以前ブログで紹介したPalettableも利用しているのですが、今回はAIで色を提案してくれるHueMintというサービスを使って配色のベースを選択しました（結構ライト目な内容だと最近よくこのサービス使っています）。
ここでベースの黒と文字のグレーを決めて、あとは感覚で合いそうな色をパレットとして作成し、スライドを作成しました。
画像の引用元
漫画風デザイン
この画像はどこから？という質問があったのですが、これはOpen Peepsという素材を使っています。
素材の中にこういう漫画っぽいイラストがあったので、コマ割りと中に出てくるキャラクターをFigmaで編集しました。
それだけでもよかったんですが、漫画といえば集中線とかスクリーントーン、吹き出しがあった方がいいでしょ、ということでマンガパーツSTOCKというサイトから素材を拾ってきて合成し、今回のスライドの完成です。
正直今回のスライドで一番時間がかかった部分でした笑
表紙のイラスト
表紙にはログ→航海日誌→船の連想から、船の画像をのせています。これはLoose Drawingというサイトから拾ってきたものです。何かイラストが必要な時は、ソコストかLoose Drawingで拾ってくることが多いです。
アニメの画像
これは私が持っているSHIROBAKOのBluray-Diskをスクショしただけです。
絵文字っぽいの
FigmaではFontAwesomeを利用することができるので、図解にピクトグラムを使いたい時はFontAwesomeを使っています。
練習のために使ったツール：CleanShot X
今回はFigmaでスライドをつくったのですが、そうすると録画機能がないために練習をどうしようか迷いました（録音するので）。
で、最近購入したCleanShot Xはスクリーンショットだけではなく、GIFや動画も撮影できることがわかったので、今回はこれを使って録画練習をしました。
しかも録画するときにワイプで自分の画像もうつせることに気がついたので、もっぱらこのスタイルで録画をしての練習でした。
ここらへんも長くなるので、CleanShot Xについては別記事で書きます（と思います）。
感想
登壇をやるのはそれなりに大変だけど、その分自分の考えをいろんな人に知ってもらえて、やってよかったな〜と改めて思いました！
今回はFJORD BOOT CAMP内でしたが、来年は今作っているGemの内容で外部のLT会にも登壇しにいきたいと思っています！
ではでは〜！
