Open3

Zennのスクラップを作成して、スクラップを作成する流れをAIにテキスト化させてみる

ふじしろふじしろ

macの画面収録で画面操作を録画し、その動画をAIに渡してドキュメント化してもらうことで、記事作成時に必要となる作業手順などの作成をもれなくミスなく、かつ正確に素早く行うことができるのではないかと考えた。

ふじしろふじしろ

結論

うまくいかなかった。(Gemini 2.5 flashで検証)
このスクラップを作成するまでの過程を画面収録し、Geminiに動画を渡した上でプロンプトでマニュアル化を指示。
二回やったがどちらもイマイチな結果となった。

参考:渡した動画の詳細な内容
  1. (収録開始)Zennのtop画面
  2. 右上の「投稿する」ボタンを押下
  3. プルダウンで表示される「スクラップを作成」を押下
  4. 「New Scraps」画面でタイトル入力
  5. 上記の一つ目のスクラップを投稿
  6. タグに「AI」を設定
  7. 二つ目のスクラップの入力欄にフォーカスして収録終了

ざっくり手順の叩き台としても、後の工程になればなるほど怪しくなってくるので初回のセクション立ての参考に使い、詳細は人が直していくのが良さそうに感じた。

1回目

以下のプロンプトで実施

Zennにおけるスクラップの作成手順をマニュアル化したい。

スクラップを作成した際の画面の録画を提供するので、スクラップの作成手順を整理し、md形式でマニュアル化して。

結果、序盤はわりといい線いってる。
ボタンのテキストの認識ミスが多々あるが、テキストエリアへの記入内容は割と正確。
ただ3.2あたりから推測が混ざり始め、4は事実確認をサボってよくあるUIの内容と推測して、回答を出力したように感じる。
あとタグ設定操作は無かったことにされた。

承知いたしました。
Zennのスクラップ作成手順を、ご提供いただいた動画をもとにMarkdown形式でマニュアル化します。

-----

## Zennでスクラップを作成する方法

Zennでは、自身の作業ログやナレッジを気軽に記録・公開できる「スクラップ」機能を提供しています。ここでは、スクラップを新規作成する手順を説明します。

### 1\. Zennのトップページから「スクラップ」の作成画面を開く

1.  Zennのサイトにアクセスし、ログインします。
2.  画面右上のヘッダーにある「投稿」ボタンをクリックします。
3.  表示されるメニューから「スクラップ」をクリックします。

### 2\. スクラップの基本情報を入力する

「New scraps」という画面に移動します。

1.  **タイトル**を入力します。動画の例では`Zennのスクラップを作成して、スクラップを作成する流れをAIにテキスト化させてみる。`と入力しています。
2.  「スクラップを作成」ボタンをクリックします。

### 3\. スクラップのコンテンツを編集する

作成したスクラップの編集画面に移動します。

1.  中央の入力欄にスクラップの内容を記述します。
2.  `+`ボタンをクリックすると、画像やコードブロックなどを追加できます。
3.  「編集」モードと「プレビュー」モードを切り替えることで、リアルタイムに表示を確認できます。

### 4\. スクラップを公開する

編集が完了したら、スクラップを公開します。

1.  画面右下の「公開する」ボタンをクリックします。
2.  確認画面が表示されるので、内容を確認して再度「公開する」をクリックすると、スクラップが公開されます。

-----

この手順で、Zennに新しいスクラップを作成・公開できます。

二回目

一回目のあと色々と問答して、結局のところは「つい文脈を理解しようと頑張った上で推測を加えた結果を返しちゃったよ。ごめんね!」という感じだったので、それを封じるようなプロンプトにしてみた。
ただ、結果としてはさっきよりもひどくなった。否定の命令はやっぱ良くなさそう。

Zennにおけるスクラップの作成手順をマニュアル化したい。
スクラップを作成した際の画面の録画を提供するので、スクラップの作成手順を整理し、md形式でマニュアル化してください。

なお以下の条件に従うこと
- 手順を再現するためのドキュメント化にこだわり、操作に込められた意図や背景を推測せずに事実を淡々と記載すること

- 画像から認識できずにやむを得ず推測をした箇所についてはそのことがわかるようにマーキングすること

結果は以下。
手順7あたりから怪しくなり、8以降はほぼ想像の産物(AI的には推論したことになる?)に近い。
また、推測した箇所にマーキングしてといったがマーキングされていないことについて突っ込むと、一箇所だけは推測と認めたがそれ以外は推測ではなく、動画を確認した上での完全な事実と判断していた。

AI本人が気づいていない領域なので改善が難しいと判断し、ここで一旦諦めることとした。

Zennのスクラップ作成手順を以下に整理します。

1.  Zennのホーム画面にアクセスします。
2.  画面右上の「スクラップ」と書かれたボタンをクリックします。
3.  「New scraps」という画面に遷移します。
4.  「タイトル」と書かれた入力欄に任意のタイトルを入力します。
    -   今回の動画では「Zennスクラップにより、AIテキストを生成させるフロー」と入力されていました。
5.  「スクラップを作成」と書かれた青いボタンをクリックします。
6.  「スクラップを作成、編集し、スクラップを作成する流れをAIにテキスト化させてみる。」という画面に遷移します。
7.  画面中央の「プレビュー」の下にある入力欄にスクラップの内容を記述します。
    -   動画では、最初に「macの画面録画で動画を提供し、その動画をAIにテキスト化してもらうことで、記録と共有を両立させながら編集の手間をなく、かつAIに深く書くことすらできるのではないかと考えた。」と入力していました。
8.  入力欄の下にある「+」ボタンをクリックすると、画像などのファイルを追加することができます。
    -   動画では、Macの画面録画の画像を追加していました。
9.  入力欄の下にある「更新」という青いボタンをクリックします。
10. 入力内容がZennのスクラップとして保存されます。
11. 画面上部にある「トピックを追加」と書かれた入力欄に、任意のトピックを入力します。
    -   動画では「AI」と入力していました。
12. 画面右側にある「スクラップをクローズ」と書かれたボタンをクリックします。
    -   今回の動画では、最後にこのボタンをクリックしており、スクラップをクローズする操作を行っていました。
13. 画面中央の入力欄の下にある「質問」と書かれた入力欄に、AIに質問したい内容を入力します。
    -   動画では「この文章をAIが書いたテイストでリライトして」と入力していました。
14. 入力欄の横にある「生成」と書かれた青いボタンをクリックします。
15. AIによってリライトされた文章が生成されます。
    -   今回の動画では生成された文章は表示されていませんでした。