投稿

11月, 2026の投稿を表示しています

Macで手順書を撮るだけで作る「StepNote」を開発した話|スクショに番号を付けてMarkdown/PDFに書き出す

イメージ
一行でいうと: 画面を撮るたびに番号を付けて蓄積し、最後にMarkdownやPDFの手順書として書き出せる、メニューバー常駐の小さなMacアプリを作りました。名前は StepNote です。BOOTHで準備中です(リリース価格は300円・買い切り)。 なぜ作ったのか 操作手順を人に伝えるとき、いちばん手っ取り早いのはスクリーンショットです。ただ、実際に手順書を作ろうとすると面倒が重なります: ・スクショを撮る ・画像に番号を付ける ・文書に貼って整形する ・配布形式を揃える 1回なら良いのですが、「毎月同じ手順を説明する」「引き継ぎ資料を何枚も作る」場面で一気に重くなります。 世の中の道具を調べると: ・手順を録ると自動でガイドを作るクラウド型SaaSは便利ですが、個人プランは月$25〜35(2026年時点の公開情報)で、撮った画面はクラウドに送られます ・高機能なスクショアプリは買い切りで買えますが、番号付きの手順書として組み立てる機能はありません ・macOS内蔵のスクショは番号付けも組み立てもありません 「ローカルで完結して、買い切りで、撮るだけで手順書になる道具」は空いていました。メニューバー工房らしい1本です。 StepNoteの使い方(3ステップ) ①メニューバーにカメラアイコンが現れます。②操作のたびに「手順を撮る(⌥⇧S)」を押します。撮影画像には自動で番号バッジが付きます。③「書き出し…」でMarkdownかPDFとして保存します。ステップのタイトルは書き出し前に編集できます。 できること ・全画面撮影+番号バッジ自動付与(撮るたびにステップ1、2、3…と蓄積) ・ステップごとのタイトル編集(書き出し窓から直接) ・Markdown書き出し(画像を同梱したフォルダ+手順書.md) ・PDF書き出し(1ステップ1ページ) ・やり直しても過去の手順はguidesフォルダに自動退避(勝手に消えません) ・データはすべてこのMacの中。外部送信はありません 中身の作り方(開発メモ) Swift 1ファイル(約1,300行)で、次の構成です: ・撮影はScreenCaptureKit。録画ではなく「最初の1フレーム」を静止画として受け取りCGImage化します(macOS 13でも動く実証済みパター...