菜单
hira.page リポジトリのブログ記事 (src/blog/ja/{slug}/index.mdx) の本文を、ユーザーの文体・SEO 観点で清書する。Web 調査による出典補強・引用カードの挿入・仮画像パスの提案も行う。「記事を整えて」「記事を仕上げて」「記事清書」などと言われたとき、または対象 mdx を開いた状態で清書依頼をしたときに起動する。frontmatter はdescriptionのみ、あとは本文のみを対象に、チャット内で全文提示 → レビュー → OK 検知で自動反映する。
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
| name | article-polish |
| description | hira.page リポジトリのブログ記事 (src/blog/ja/{slug}/index.mdx) の本文を、ユーザーの文体・SEO 観点で清書する。Web 調査による出典補強・引用カードの挿入・仮画像パスの提案も行う。「記事を整えて」「記事を仕上げて」「記事清書」などと言われたとき、または対象 mdx を開いた状態で清書依頼をしたときに起動する。frontmatter はdescriptionのみ、あとは本文のみを対象に、チャット内で全文提示 → レビュー → OK 検知で自動反映する。 |
hira.page の 日本語ブログ記事 (src/blog/ja/{slug}/index.mdx) の本文を、雑な下書きや音声入力から、ユーザーの文体・SEO 観点で清書する。
frontmatter はdescriptionのみ編集。あとは本文のみが対象。
以下のいずれかで起動する:
ただし「文章を翻訳して」「英訳して」のような翻訳依頼は translation-check スキルの担当。混同しないこと。
清書はファイル単位。対象ファイルが確定するまで清書作業に入らない。
判定順:
<ide_opened_file> タグで src/blog/{ja|en|zh-cn}/{slug}/index.mdx のような MDX が開かれている → それを対象blog/{slug} の形式でパス指定してきた → src/blog/ja/{slug}/index.mdx を対象blog/{slug} の形式で指定してください」と聞く注意: 現状このスキルは ja のみ対応。en / zh-cn の MDX が開かれている場合は「このスキルは ja 版のみ対応です。en / zh-cn は translation-check スキルで翻訳してください」と案内する。
清書のもとになる下書きは、以下のいずれか:
--- 以降) に書かれているファイルが空 (テンプレートのまま) で、チャットにも下書きが無い場合は「下書きをチャットに貼るか、対象ファイルに書いてから再度依頼してください」と案内する。
--- から 2 つめの --- まで はほぼそのまま保持description だけ生成import EmbedCard from '@/components/Blog/EmbedCard.astro'; などの import 文 → そのまま``` で囲まれた範囲) → 中身を変更しない`...` → 中身を変更しない./cover.png 等) → 変更しない<EmbedCard ... /> <details> <small> <iframe> 等はタグ構造を保持title= の中身など) は、原文を尊重しつつ自然な日本語に整える程度/blog/...) は変えない清書の目的の半分は「リファレンス・出典・引用の整備」。雑な下書きにある主張・固有名詞・製品名・技術用語に対して、適切に Web を調べて出典を補強する。
以下の場合に WebSearch / WebFetch を使う:
調査結果は以下のいずれかで本文に組み込む:
[テキスト](URL) — 文中の固有名詞や軽い参照<EmbedCard>: 重要な参照記事・公式ページ・商品ページ。直前・直後に短い説明文を添える詳細な書式は style-guide.md の「リンク・引用・出典」章を参照。
img は OGP 画像を使う: WebFetch で取得したページの <meta property="og:image"> 値を使うのが理想。確実な URL が取れないときは EmbedCard を使わずインラインリンクに留めるユーザーが「出典だけ足して」「リファレンス整備だけして」と言った場合は、本文を大きく書き換えず、リンク・カード・脚注を追加するだけに留める。
下書きに画像指定がなくても、清書時に 「ここに画像があるとよい」箇所を見つけて仮の画像パスを提案 する。src/blog/ja/sample/index.mdx の記法を踏襲する。
./dynamic-color.gif, ./switchbot-air-purifier.jpg画像 のような無意味な alt は禁止){/* TODO: ダッシュボードのスクショ。比較表が見える状態で */}
cover.png, thumbnail.png, 既存記事の画像) は触らない・パスを変えない<video src="/video/{slug}-{name}.mp4" controls /> と書き、TODO コメントで内容説明src/_template/cover.png をコピー&リネームして実ファイルを置くので、ビルドエラーは起きないただし過剰に挿入しない。読み物として図が必要な箇所だけ。1段落おきに画像があるのは多すぎ。
下書きに  のような既存パスが書かれている場合は、そのまま保持して中身を変えない。
詳細は style-guide.md の「画像」「動画・アニメーション」章を参照。
ユーザーの文体は style-guide.md に従う。清書を始める前に必ず style-guide.md を Read する。
# (h1) は使わない (title が自動 h1)。本文の見出しは ## (h2) と ### (h3) を基本に**...**) を要所に。打ちすぎない (1 段落 2 つまで)スキル起動時は以下の順で動く。
<ide_opened_file> タグを確認 → 該当 MDX を対象に.claude/skills/article-polish/style-guide.md を Read。毎回必ず読む (キャッシュに頼らない)。
index.mdx を Read--- から 2 つめの --- まで) を保持しておく--- 以降の本文と、ユーザーのチャット下書きを統合して清書のもとにする./xxx.png 等) を抽出し、実ファイルが存在しないものを src/_template/cover.png からコピー&リネームして即座に配置する (詳細手順は Step 10-1 参照)。これにより、清書中・レビュー中もビルドエラーが起きない状態を保つ。配置したファイル名はメモしておき、最終報告で示す。下書きのジャンルに応じて、style-guide.md 末尾の「参考記事サンプル」から 1〜2 本を Read してリズムを掴む。
tailwind-react-styling-issues2024-best-buymaterial-design-3sample下書きに調査価値のある製品名・サービス名・技術名・統計・引用源が含まれていれば WebSearch / WebFetch で調べる。
<EmbedCard>) に使う場合は OGP 画像 URL も取得 (<meta property="og:image">)調査結果は本文に組み込む際、何を / どこから引用したかをユーザーが追えるよう、清書版に明示する。
調査が 不要だと判断した場合、あるいは スキップした場合 は、提示時にその旨を 1 行添える (「Web 調査は今回不要と判断しました」など)。
style-guide.md を踏まえて本文を清書する。frontmatter は含めず、import 文以降の本文全体を作る。Step 5 で調査した出典・カード・引用も自然に組み込む。画像が必要そうな箇所には仮パス + TODO コメントを入れる。
清書版を以下のフォーマットで提示する:
📝 対象: `src/blog/ja/{slug}/index.mdx`
清書版です。
```mdx
import EmbedCard from '@/components/Blog/EmbedCard.astro';
## ...
...本文...
```
この内容で書き込んでよければ「OK」「反映して」などと言ってください。修正したい箇所があれば指示をどうぞ。
```mdx で囲むユーザーから修正指示が来たら:
ユーザーから以下のいずれかの言葉を検知したら、書き込みフェーズに入る:
紛らわしい場合 (例:「ここだけ OK だけど他は要修正」) は確認を取り、勝手に書き込まない。
清書版の本文中に書かれた相対パス画像 (    [](URL) など) について、実ファイルが存在しないものは src/_template/cover.png をコピー&リネームして配置する。これをやらないと npm start / astro build で「画像が見つからない」エラーになる。
このロジックは Step 3 でも呼ばれている (既存ファイル本文の仮画像を即配置するため)。Step 10-1 では Step 3 と Step 6 で増えた 清書版に追加された新規仮画像 も含めて、再度実行する。既に配置済みのファイルはスキップされるので二重実行しても安全。
手順:
\(\.\/[^)]+\.(png|jpe?g|gif|webp|svg)\) (Markdown 画像 / リンク)<img src="./..."> のような HTML タグ内も対象src/blog/ja/{slug}/{filename} を ls で確認cp src/_template/cover.png src/blog/ja/{slug}/{filename} でコピーcover.png, thumbnail.png, 既に置かれている画像) は絶対に上書きしないBash 実装例:
# 拡張子をそのまま保ち、テンプレートPNGをコピーする (中身はPNGだが拡張子だけ変更)
TEMPLATE="/Users/a-hirata/projects/hira.page/src/_template/cover.png"
TARGET_DIR="/Users/a-hirata/projects/hira.page/src/blog/ja/{slug}"
for filename in "dashboard-comparison.png" "switchbot-air-purifier.jpg" "..."; do
if [ ! -f "$TARGET_DIR/$filename" ]; then
cp "$TEMPLATE" "$TARGET_DIR/$filename"
echo " placeholder: $filename"
fi
done
注意:
public/video/... などの /video/ から始まる絶対パスは 対象外 (動画はテンプレートにないため。書き込み後に手動で用意する旨を報告で添える)https://...) は対象外cover.png thumbnail.png は frontmatter から参照されるが既存なのでコピー不要_template/cover.png を流用しにくい形式は、.png などにリネームを提案するか、コピーをスキップして報告で「SVG はテンプレートからコピーできないので手動配置してください」と注意喚起--- から 2 つめの --- までを保持--- 以降を清書版で置き換え✅ src/blog/ja/{slug}/index.mdx を更新しました
📷 仮画像を配置: dashboard-comparison.png, switchbot-air-purifier.jpg, ...
仮画像を配置していない場合は 2 行目を省略。差分や統計は表示しない (見たければユーザーが git diff する)。
清書版を提示する直前に、以下を自分でチェック:
文体・構造:
style-guide.md を読んだdescription以外を含めていない# (h1) を使っていないWeb 調査・引用:
img は OGP 画像 URL か、確実な画像 URL を入れている画像・メディア:
{/* TODO: ... */} で必要な画像を説明cover.png thumbnail.png 等) のパスを変えていない書き込みフェーズに入る直前に:
対象ファイル Read 時 (Step 3):
src/_template/cover.png からコピーした (ビルドエラー回避)書き込みフェーズ (Step 10) 中:
src/_template/cover.png からコピーした (既存画像は上書きしていない)translation-check の責任範囲。