2018-12-21に更新

160日以上書き続けられた作業記録を支える技術

読了目安:25分

こちらはCrieitで開催されている「アドベントカレンダー」19日目の記事です。

昨日はnaichiさんの長期化する個人サービス開発でモチベーションを維持する方法 〜unityroomができるまで〜でした!

unityroom開発中に触れた未経験な技術多すぎですね。。。妥協せずに完成させたの本当にすごい。。。

はじめに

どうも。ぽりんです。

今年の5月から作業過程のログを記録していく、作業記録を書き続けていて早くも現在160日を突破しようとしています。

Porin Room
image.png

今回縁あってCrietのアドベントカレンダーを書こう!となったのですが、せっかくだからこの作業記録のことについて書こうかなと思い、こうして筆を走らせています。

アドベントカレンダーなんて自分みたいなペーには書く機会がないと思っていたのですが、人生何があるかわからないものですねえ🍵

さて、最初は拙かった作業記録も、160日以上書き続けてきたらノウハウが溜まってくるものです。

というわけで160日かけて蓄積していった「作業記録を支える技術」を書いていこうと思いまする🐤

※ 注 Mac使いなのでかなりMacに偏っています。ご注意ください。

作業記録を取り始めたきっかけ

まず、作業記録の紹介として、記録を録り始めたきっかけを書こうと思います。

作業過程がわからないと困ることが多すぎた

「あれ、あのとき参考にした記事ってどれだっけ?」
「数ヶ月前に導入した〇〇(or環境構築した〇〇でも可)、導入手順は記憶のかなたで下手にいじれない...」
「はて、なんでこういう風にやろうと思ったんだっけ?」

こういうことってありませんか?

そして、ググり直すなどして、「なんで前調べたことにまた時間かけてるんだろ」と悲しみに暮れる。はたまた、もういいやなんとかなるやろ!と既存の環境をいじってよくわからないことになる。

はい、数ヶ月前のわたしです。

わたしは変に記録厨なところがあり、「おっ!」となったことや作業メモをツイートすることも多かったのですが、まあ抜け漏れはあるわけで、「ぐぬぬ...!」と歯ぎしりをしていました。

ちょうどそんな頃

ちょうどそんな頃、晴れてニートになったこともあり(???)、一念発起して「ぼくがおもうさいきょうの作業記録」を作り出すべく立ち上がりました。

さらに、普段Slackなどで仲良くしていただいているういろうさんがなんと一年以上毎日ブログを書いていたのに刺激され、「わたしも更新を続けてみよう...!」と決意をみなぎらせました。

ういろうさんのブログ

こうして生まれたのが、タイトルに「〇〇日目」と入っている作業記録たちなのです。(ういろうさんの完全なるパクリ)
image.png

嗚呼、全ての情報が集約されているというのは、なんと素晴らしいのでしょう(記録厨)

作業記録を支える技術

前置きはこれくらいにして、本題である「作業記録を支える技術」を紹介していきますね。

ちなみに、ニート時代に始めたこともあり全て無料で使用できます。

(「技術」とかカッコいい感じに言ってるけどそんな大したものでもなかったらどうしよ...)

エディタ

Scrapbox

Scrapbox

作業記録はScrapboxというWebサービスを使って書いています。

わたしは記録厨な割にはものすごいめんどくさがりで、たいていのブログサービスやメモサービスでは続けられません。

過去Evernoteやnote、Onenoteなどの素晴らしいサービス達がわたしのめんどくさがりの前に砕け散ってゆきました。

そんなめんどくさがりぽりんを拾ってくださったのがこちらのScrapbox。

Scrapboxは人に見せるものとしてはデメリットも色々あるのですが、メモ用としては本当に素晴らしいです。ああ愛おしい。

しかも、なんと個人で使用する分にはどんな使いまくっても無料という優れものです。

この記事でも機能などを説明しますが、一旦使ってみないとわからない気がするのでぜひ触ってみてくださいね!(けっして回し者ではありません。)

以下わたしがScrapboxを愛用している理由上位3位を書いていきます。

1. 書きやすさがぱない

もうこれ。本当にこれに尽きます。

これが他のサービスとの一番の違いなので、堂々たる1位にノミネートしました。

自分用のメモなので、見た目は最低限見れるものならいいのです。自分で書いたから見返しやすいし。

noteとか他のマークダウンブログではなぜか書けないのがScrapboxだとスイスイ書けるので本当に不思議。
実はこの記事も、Scrapboxでささっと書いてから清書しています。

独自記法なので慣れるまでがちょっと大変ですが、スニペットなど用意すれば関係ないですし、慣れたらやみつきになります。

具体的に書きやすくて好きな機能は以下
* 編集画面という概念がなく、書いたら即反映される
* 箇条書きが鬼書きやすい。Tabキー押せばどんどん箇条書きできる
* 箇条書きというのは徒然なるままに文章を書くときにもっとも書きやすいと思っている
* 独自記法ではあるが、見出しからテーブル、引用文、コードがささっと書ける
* コピペやドラッグ&ドロップで画像や動画を貼り付けられ、Gyazoのリンクが発行されるので使いまわせる
* Scrapbox内の他のページを参照するのが「ページ内リンク」という機能でものすごく簡単。やりようによって同じページの該当部分に飛ぶこともできる

書いたら即反映の様子
scrap.gif

2. 全文検索できる

これも本当に本当に大事。
作業記録の目的に一番貢献するものです。

「あれってなんだっけ?」とか検索したら、参照した記事やらそのときのメモやらがすぐ見つかります。

検索窓でキーワードを検索すると、そのキーワードを含むページがずらっと並ぶ↓
image.png

3. カスタマイズできる

CSSやJavascriptを独自に追加するが可能なので、より自分の好みの見た目にしてある程度読みやすさを上げられます。

Scrapboxのカスタマイズ(=自分の作業記録をより良いものにしたいという執念)でわたしのCSS知識は育ったと言っても過言ではありません。

吹き出しを作ったり
image.png

見出しをいい感じに装飾したり
image.png

テキストを強調したり
image.png

コードブロックの背景や文字色好みのものに変えるのも思いのまま!
image.png

Scrapboxのページ内にカスタマイズ用のCSSを書けば反映されるようになっています(参考までに、わたしが使ってるカスタマイズ用のCSSはこちら:settings - Porin's Room

わたしの涙ぐましい努力が垣間見られるので、ぜひScrapboxのデフォルトと見比べて欲しいです。

※ 自分用なので自分のPCとスマホで正常に表示されて満足してるくらいしかレスポンシブ対応してない&JSはかつてのわたしにとって未知の世界すぎていじっていないです

その他

詳しい使い方などはこちらにありますので興味がある方はどうぞ。
Scrapbox ヘルプ

文章編集

Dash

Dash

ドキュメント検索ツールなのですが、わたしはスニペット機能のみを愛用しています。

これがないと作業記録は書けないくらいにヘビロテしてます。

作業記録で毎回使うテンプレ部分は全部Dashのスニペットに登録してホットキーで呼び出しています。

登録したホットキーを押すと検索窓にフォーカスされた状態でDashのウィンドウが呼び出されEnterを押すだけで、それまで書いていたエディタ上に貼り付けられます。

ホットキーで呼び出し→スニペットを検索→貼り付けの流れ
title.gif

※ Dashのスニペットの使い方についてはこの記事をかなり参考にしました
Dashのスニペット機能をちゃんと使う - Qiita

Clipy

Clipy

クリップボード拡張ツール。

クリップボードの履歴を参照して、何個も前にクリップボードに登録したものを貼り付けられます。

これもDash同様、呼び出し用のキーを登録できるので、PC上のいつでもどこでも呼び出すことができます。
image.png

実は作業記録の目次を作るのにわりと非効率なことをしているので、複数の項目を一気にコピーして呼び出すのに重宝してたりします。

LICEcap

Cockos Incorporated | LICEcap

PC画面の動きを録画してGIFアニメを簡単に作れます。

Unityで作ったゲーム画面の動きを記録するときにスクショだとわかりにくいので最近よく使います。

この記事にちょいちょい載っているGIFアニメも、LICEcapで録りました。

Chrome拡張:Copy Url Title to clipboard

Copy Url Title to clipboard

閲覧してるサイトのリンクをいろんな形式でクリップボードに貼れるChrome拡張。

Scrapboxのリンク記法にちょうどいい感じでタイトル+URLをコピペできます。

また、作業記録とは関係ないけれどマークダウン用のリンクもコピペできるのも地味に重宝してます。
image.png

Macのスクショ用ショートカットCommand + Shift + 4

クリップボードに欲しい範囲のスクショを登録できるショートカット。

Command + Shift + 4で該当範囲を撮ったらすぐにScrapbox上でCommand+Cで貼り付けられるのでヘビロテです。

Macのキーバインド

これを使いこなせるようになると、常にホームポジションで爆速タイピングできます。

これを使う前と後では、タイピングスピードが全く違います。

よく使うキーバインド

キー 機能
Ctrl + F 1文字右にカーソルを動かす
Ctrl + B 1文字左にカーソルを動かす
Ctrl + P 1行上にカーソルを動かす
Ctrl + N 1行下にカーソルを動かす
Ctrl + A 行の先頭にカーソルを動かす
Ctrl + E 行の末尾にカーソルを動かす
Ctrl + H 1文字前を削除する
Ctrl + K カーソルの位置から行の末尾までをカットする
Ctrl + Y Ctrl + Kでカットしたものを貼り付ける
以下文字の編集中にのみ有効なもの
Ctrl + K 文字の編集中に押すと全角カナ変換する
Ctrl + ; 文字の編集中に押すと半角カナ変換する

Karabiner

Karabiner

MacはEnterキーがホームポジションから届かないのが嫌なので、Karabinerで場所を変えています。

サムネイル

Canva

Canva

サムネイル画像を手抜きするために使用しています。
無料でいい感じのテンプレートを用意してくれてるので、毎日書く作業記録のサムネイル画像など、手抜きしたいときにとても良いです。

なにもないのも見栄えがよくないので以下のようなテンプレを用意し日数だけ変えて使い回しています。

今思えば、日付くらいは入れてもよかったかなあと思いますが、めんどくさいからまあいっか。
faf580e9022d9210e2008157e1e02909-png.png

時間計測

Toggl

Toggl

時間を計測できるアプリ。

デスクトップアプリをダウンロードするとさっと時間を計測できて便利です
image.png

どの作業も変に間延びしないようにMacのメニューバーに経過時間を表示しています。
image.png

作業記録では、冒頭にその日どの作業にどれくらいかけたのかがわかるグラフのスクショを貼っています。その日の作業の振り返りになって非常に良いです。

image.png
image.png

おまけ:作業ログを取ってよかったこと

「あれなんだっけ?」と思ったら全てはここにある

ググり直すよりも圧倒的に素早く欲しい記憶を探せます。

テキストに書くことで思考が整理される

さくさく書けるので、思考と同じスピードでざっと書く→見返してならべかえるとかができます。

振り返りに使える

何をやったかがすぐにわかるので、日ごと、月ごとの振り返りの際に役立ちます。

わたしは毎日の朝の習慣として、前日の作業記録を見返す→前日の作業の振り返りをする、というようなことをしています。一歩引いた目で自分がやったことを思い返せるので非常に良いです。

また、わたしは見返しやすいようにタイトルにその日行った主要なことを書くようにしており、バッとタイトルを見返せば記憶がだいたい蘇るので、1ヶ月の振り返りなどもやりやすいです。

見返すと自分の成長が見えて嬉しい

子供の成長を見守っている気分になれます。(子供というか自分なんですけどね...)
5月に書いた一番最初のページを見てみると、「ProgateでHTMLとCSSを学ぶ」とかあってヤバいエモいです。

自分の思考回路や今やっていることを周囲に知ってもらえる

Scrapboxに徒然なるままに書いた内容がシャチョーの目に止まり、今の会社に拾ってもらい脱ニートできたので、作業記録就職をしたと言っても過言ではありません。

また、現在は業務中にやったことや考えたことを書いているので、それ見たシャチョーが参考になる情報を教えてくれたり、意見をくれたりします。(そもそも雑多に書いた記録をチェックしてくれてるのがすごいと思うので最近シャチョーのことを心の中でゴッドと呼んでいます。嘘です盛りました。でも感謝しているのは事実です。)

ツイート量が減る

ツイッターに書いてたような考え事とか作業過程などのほとんどが作業記録に吸い込まれていきました。

さようならわたしのツイ廃ライフ。

これはもしかしたらよかったことではなく、ツイッタラーとしては嘆かわしいことかもしれませんね...

最後に

以上、「作業記録を支える技術」をテーマに書かせてもらいました。

「160日以上のノウハウ」とか豪語しながら当たり前なことばかり紹介してたらどうしようとか、普段記事を書くなんて全然しないのでちゃんと文章書けてるのだろうかとか色々不安が...

ですが、もしこの記事を読んで、新たな便利ツールや作業中のログを録る素晴らしさとの出会いがあれば嬉しいです。

ここまで読んでくださってありがとうございました!

明日のCrieitアドベントカレンダーはhammhikoさんです!


Porin🐤

お風呂代理店(@ofuro_agency)運営者|株式会社カラメルカラム|数学始めた| Unity入門|Python|作業記録: https://t.co/p6O7Jqd95j |読んだ本(マンガばっか):https://t.co/VJ12ayHcBn

Crieitは個人で開発中です。 興味がある方は是非記事の投稿をお願いします! どんな軽い内容でも嬉しいです。
なぜCrieitを作ろうと思ったか

また、「こんな記事が読みたいけど見つからない!」という方は是非記事投稿リクエストボードへ!

こじんまりと作業ログやメモ、進捗を書き残しておきたい方はボード機能をご利用ください!

ボードとは?

関連記事

コメント