.md
Skill.mdサーチャーJP
Skill.md一覧に戻る
T
v1.0.0

iPhoneのVoiceOver対応で誰もが使えるアプリに改善できる

by takapom

0
85
2026-02-04

説明

できること

  • VoiceOverで正しく読み上げられるようにする:ボタンやアイコン、テキスト、画像に適切なaccessibilityRole・accessibilityLabelを自動で付与し、スクリーンリーダー利用者が迷わず操作できるようにします。
  • ガラスデザイン上のテキストのコントラストを自動で確保する:Liquid Glassのブラー背景でテキストが見えにくくなるのを防ぎ、WCAG AA基準(コントラスト比4.5:1以上)を満たすよう自動調整します。
  • 「透明度を下げる」設定に対応させる:ユーザーが視認性を高めるためにOS設定で透明度を下げた場合、ガラスエフェクトを自動で無効化し、不透明背景にフォールバックさせます。
  • 入力フィールドやトグルなど全UI要素をアクセシブルにできる:TextInput、Switch、画像など各要素に対して、アクセシビリティ属性の適用ルール表に従い、正しく設定できます。
  • 複数画面を一括でアクセシビリティ監査できる:引数で指定した画面、または全画面を対象にアクセシビリティ属性の有無を自動検査し、問題のある要素を一覧表示します。

こんな人におすすめ

  • iOSアプリを開発しており、VoiceOver対応を求められている開発者
  • Liquid Glassデザインを使用しており、視認性とアクセシビリティを両立させたい人
  • WCAGガイドラインに準拠したアプリを作りたい人
  • 視覚障害者も含むすべてのユーザーが使えるアプリを目指している開発チーム
SKILL.md の内容
# アクセシビリティ改善スキル

iPhoneの VoiceOver を中心に、アクセシビリティ対応を実装する。

## デザイン前提: Liquid Glass

本プロジェクトは `@callstack/liquid-glass` による Liquid Glass デザインを前提とする。
Liquid Glass はアクセシビリティ上の注意点が多い:

### ガラス上テキストのコントラスト確保

Skill.md 情報

バージョン
v1.0.0
カテゴリ
media
作成日
2026-01-29

インストール

ワンコマンドで導入
1

下の「Skill.mdをダウンロード」ボタンを押す

2

お使いのAIツール(Claude Code・Cursor・Copilot など)にファイルをアップロードして「このスキルを追加して」と入力する

ターミナルから追加する場合
$ mkdir -p ~/.claude/skills/ && curl -sL "https://github.com/takapom/trip-app" -o ~/.claude/skills/SKILL.md

関連 Skill.md

K

アプリストアのメタデータと画像を自動更新

by K9i-0

iOS / Android のストアスクリーンショットを自動撮影・合成し、最新のUI状態をアップロード用に準備できます。 最新の CHANGELOG を分析して、App Store・Google Play 向けのリリースノートや説明文を自動生成・更新できます。 UI変更があったかどうかを判定し、更新対象(スクリーンショット、リリースノート、説明文等)をユーザーに提案できます。 Simulator × モック画面 × Marionette MCP を組み合わせることで、手作業のスクショ撮影・編集をほぼ自動化できます。 iOS・Android アプリのリリース時にストアメタデータを何度も手で更新しているエンジニア ストアスクリーンショットの撮影・編集に毎回時間をかけているプロダクトマネージャー CHANGELOG 更新後、App Store・Google Play・fastlane メタデータを同期更新したい開発チーム モバイルアプリの多言語対応(英語、日本語など)で、各言語のメタデータ更新に手間がかかっている人 ワークフロー三段階: Step 1 - バージョン確認・変更分析(git tag、pubspec.yaml、CHANGELOG確認)。Step 2 - 更新対象選択(8スクリーンショットシナリオ + 9メタデータテキストファイル)。Step 3 - メタデータテキスト更新(CHANGELOG ベースに release_notes・description・promotional_text を自動生成)。 スクリーンショット 8 シナリオ: Session List(ライト)、Approval List、Multi-Question Approval、Markdown Input、Image Attach、Git Diff、New Session、Session List(ダークモード)。各シナリオ用に ccpocket.navigateToStoreScenario カスタムエクステンション実行後、Simulator からスクショ撮影。 メタデータファイル: fastlane/metadata/en-US/release_notes.txt(iOS EN)、ja/release_notes.txt(iOS JA)、en-US/description.txt(App Store EN)、ja/description.txt(App Store JA)、promotional_text.txt、android/en-US/full_description.txt(Play Store EN)、ja-JP/full_description.txt(Play Store JA)、android/en-US/changelogs/default.txt(Play Store リリースノート EN)、ja-JP/changelogs/default.txt(Play Store リリースノート JA)。ファイルパスは apps/mobile/ からの相対パス。

ドキュメント自動化コミット
5817.1k2026-04-12
R

MulmoScriptの動画台本からZenn記事を自動生成できる

by receptron

MulmoScript で作成した動画台本(JSON形式)から Markdown形式の Zenn記事を自動生成でき、手作業での変換作業を削減できます。 過去の Zenn記事テンプレートを参照して、フロントマター、:::message ブロック、見出し構成、動画リンク配置を自動で統一できます。 動画から生成された markdown をルール(div タグ除去、クレジット画像削除、画像パス変更、:::message 注釈追加)に基づいて自動編集し、Zenn記事として公開可能な形に整形できます。 YouTube URL が未登録の場合はプレースホルダーを記載してひとまず公開準備を進め、URL 受け取り後に記事ファイルと YouTube メタデータファイルの両方を一括更新できます。 /release-script 完了後のワンステップで、リリースノート用 Zenn記事を ZENN_CONTENT_DIR に自動出力できます。 動画コンテンツとテキストコンテンツを同時生成して公開したいコンテンツクリエイターやプロダクトチーム MulmoScript で台本管理をしており、Zenn への記事公開を自動化したいテクノロジー企業 リリースノートを動画と記事で同時配信するプロダクトマーケティング担当者 画像パスや リンク配置などの細かい編集ルールを統一して管理したいドキュメント編集チーム このスキルは MulmoScript(動画台本JSON)から Zenn 記事を自動生成・編集するワークフローです。 前提条件:docs/release_notes/v$ARGUMENTS/release_v_script.json が作成済み、YouTube URL が youtube_v_ja.md と _en.md に記録済み、環境変数 ZENN_CONTENT_DIR が設定済み(zenn-content リポジトリパス)。 Step 1: 環境変数確認:.env ファイルから ZENN_CONTENT_DIR を確認、未設定なら STOP してユーザーに設定依頼。 Step 2: mulmo markdown で原文生成:mulmo markdown docs/release_notes/v/release_v_script.json -o docs/release_notes/v/output/ を実行、release_v_script.md を生成。 Step 3: 過去記事をテンプレート参照:ls $ZENN_CONTENT_DIR/articles/*mulmocast-release*.md で最新記事を取得、フロントマター・:::message・見出し構成・動画リンク配置を参照。 Step 4: YouTube URL 取得:youtube_v_ja.md と _en.md から URL を抽出、未登録なら「(YouTube アップロード後に URL を追記)」をプレースホルダー。 Step 5: 記事編集ルール:(1)div タグ除去(タイトルスライドの # 見出しは残す、クロージングとその他は削除)、(2)mulmo_credit.png 参照行削除、(3)画像パス変更(/images/release_v_script/ファイル名.png)、(4):::message 注釈追加(フロントマター直後)。

レビュードキュメント記事
385442026-04-11
S

マスコット・TTS関連リソースを一括クリーンアップ

by sawarae

実行中のマスコットアプリやFlutter開発プロセスを検出して安全に停止できます。 残留したシグナルファイル(mascot_speaking、mascot_listening)を自動削除して、アプリの状態を初期化できます。 ビルド成果物やダウンロード済みアセット(モデルファイル、フォールバック画像)を一括削除でき、クリーンな開発環境を再構築できます。 グローバルフック(~/.claude/hooks/)やスキルのコピーを削除して、システム全体の設定を整理できます。 プラットフォーム(Windows / macOS / Linux)を自動判定し、OS別のコマンドを正しく実行します。 つくよみちゃんマスコットアプリの開発・テストを行うエンジニア TTS(音声合成)機能を使った開発で、一時ファイルやプロセスの残留にトラブルが多い人 開発環境をリセットして、クリーンな状態から始めたい人 Windows / macOS / Linux 複数環境で開発している人 マスコットアプリやTTS関連のプロセス・シグナルファイル・ビルド成果物・グローバルフックをクリーンアップする。実行時にプラットフォーム(Windows/macOS/Linux)を判定し、以降のコマンドを分岐して実行する。引数でall(全項目)、process(プロセスのみ)、signal(シグナルファイルのみ)、build(ビルド成果物のみ)、hooks(グローバルフックのみ)を指定可能。マスコットプロセス(utsutsu_code)とflutter runの動作を確認し、ユーザーに停止確認をしたうえでpkillで終了。シグナルファイル(~/.claude/utsutsu-code/mascot_speaking等)の残留を検出し、ユーザー確認後に削除。ビルド成果物(mascot/build)やダウンロード済みアセット(model.inp、*.png)の削除前にユーザー確認を求める。グローバルフック(~/.claude/hooks/mascot_tts.py等)やスキルコピーを削除。

195242026-02-26