「frame」の検索結果

メモや分析資料を、顧客向け提案や技術発表に使えるHTMLスライドへ整理し、テーマ選択から発表者用の台本、PNG出力まで支援するスキル。

• 分析結果を顧客向け提案にしたいとき
• 台本付きの技術発表資料作成
• 製品発表用のスライド作成

病院の患者データ管理について、リスク、管理体制、責任分担、承認事項を整理し、理事会や規制当局への説明に使う発表者ノート付きのHTMLスライドを作成します。

• 患者データのリスクを理事会に説明したいとき
• 規制当局向けに管理体制を整理したいとき
• データ管理方針の承認資料を作りたいとき

既存サイトのソースやブラウザ上の動作を調べ、見た目と操作をローカルで再現する手順を提供。素材収集から実装、元サイトとの比較検証、内容の差し替えまで進めます。

• 既存サイトをローカルで再現して学びたいとき
• WebGLやCanvasの演出を調べたいとき
• 再現したサイトと元サイトを比較したいとき

動画の冒頭で使う短い言葉を、一文字ずつ現れる光の演出付きHTMLにします。光るカーソルや色ずれ、光線を組み合わせ、引用元や章名も添えられます。

• 引用文で動画を始めたいとき
• 光る文字で章の導入画面を作る
• 冒頭の言葉に引用元を添える

GLSLで流体や粒子、手続き的に生成する映像表現を制作するスキル。レイマーチングなどの技法を使い、ページ冒頭のメインビジュアルや動きの一場面の制作に役立ちます。

• ページのメインビジュアル制作
• 流体シミュレーションの表現
• 粒子エフェクトを作りたいとき

Webサイトや業務画面を、用途に合う見た目と動くコードまで仕上げるスキル。文字組み、配色、レイアウトに加え、スマートフォン表示や操作時の状態も整えます。

• 方向性のあるランディングページ制作
• 日常業務向けダッシュボードの設計
• 既存UIの見た目と操作を整えたいとき

文章や参考画像からCodex向けの動くペットを作り、姿の一貫性や背景の透過を確認しながら、アニメーション用画像と設定ファイルをまとめて出力するスキル。

• 文章からCodexペットを作りたいとき
• キャラクター画像をペット化したいとき
• 動きごとの姿の違いを修正したいとき

GSAPで複数のアニメーションの順序や重なりを組み立て、開始位置の指定、まとまりごとの入れ子化、再生・停止・逆再生まで扱うための実装支援スキル。

• 複数の動きを決めた順番で再生したいとき
• 開始時刻を調整して動きを重ねたいとき
• 動きをまとめて再生制御したいとき

心理学と行動科学の考え方を文章やデザインに取り入れ、関心を引く導入、情報の伝え方、価格の見せ方を見直すスキルです。販促表現を検討する際に使えます。

• 関心を引く導入文を整えたいとき
• 情報の伝え方を見直したいとき
• 価格の見せ方を改善したいとき

流体のように揺れる背景に大きな見出しや短いメッセージを重ね、動画の冒頭、ランディングページのメインビジュアル、ポスターに使える単一HTMLを作ります。

• 短いメッセージ付きの動画冒頭を作りたいとき
• ランディングページのメインビジュアル制作
• 流体背景のポスターを作りたいとき

モバイルアプリの画面案や操作の流れを画像で作成。iOS・Androidなどの特徴を踏まえ、文字の読みやすさや配色、複数画面の統一感を整えます。

• アプリ企画を複数画面で可視化したいとき
• 初回利用の案内画面を考えたいとき
• ログインと復旧画面を検討したいとき

金融や戦略の数値を伝える3枚のスライドを、黒・温かみのある紙色・ライム色で作成します。大きな数値カードと規則的な配置を保ち、操作できる単一HTMLにまとめます。

• 金融指標を3枚のスライドで伝える
• 数値が目立つ戦略資料を作りたいとき
• 統一した配置で文章と数値を更新する

企業文化や行動指針を伝える3枚構成のHTMLスライドを作成します。バーガンディと淡いピンク、控えめな金色を使い、大きな文字とタグ、カードで要点を整理します。

• 企業文化を紹介したいとき
• 8つの行動指針を共有したいとき
• スタジオの特徴をタグで示したいとき

iOS・Androidなどのアプリ画面や一連の操作フローを画像で作成し、読みやすさと画面間の統一感を保ちながら、スマートフォンの端末枠付きで提示するスキル。

• 複数画面でアプリの企画を可視化したいとき
• 初回案内やログインのフロー画像の作成
• モバイルアプリの改修案を比較したいとき

ReactやNext.jsの画面を、構図・動き・情報密度の設定に沿って実装し、配色や書体から読み込み・空・エラー状態まで整える、旧版互換用のスキル。

• 従来のv1の挙動を維持したいとき
• Reactで非対称な画面を作りたいとき
• 読み込み・空・エラー状態の設計

既存のWebサイトやアプリを点検し、文字・配色・レイアウト・操作時の表示を改善します。現在の技術構成と機能を保ちながら、画一的な見た目や不足している状態表示を整えます。

• AI生成の画一的な見た目を直したいとき
• 文字・配色・余白を整えたいとき
• 読み込み・空データ・エラー表示の追加

ライブラリやAPIの使い方を公式資料で確かめ、対象バージョンに合う回答や実装につなげます。確認できた事実と推測を区別し、コード変更後の検証まで進めるスキルです。

• APIやオプションの仕様確認
• 特定バージョンに合わせた実装
• 公式資料を既存プロジェクトへ反映

Storybook本体やアドオンの変更後に、対象パッケージを再ビルドして内部UIを再起動し、希望に応じて関連するストーリーのレビューを表示するスキル。

• Storybook内部コード変更後の再ビルド
• 内部Storybook UIの再起動
• UI変更に関係するストーリーのレビュー

Storybookの起動から最初のストーリー表示までを計測し、サーバー応答と画面描画の所要時間を分けて、繰り返し実行やバージョン比較に使うスキル。

• 最初のストーリー表示まで測りたいとき
• バージョンや機能フラグの比較
• 起動時間の反復計測と集計

Webページの本文や指定箇所を抽出し、Markdownなどで保存するスキル。JavaScriptで表示されるページの取得や、Pythonでの巡回処理作成にも対応。

• 記事本文をMarkdownで保存したいとき
• JavaScriptで表示される情報の抽出
• ボット対策のあるページを取得したいとき

アプリやWebサイトをVercelへデプロイし、公開ページの確認用URLとアカウント移管用リンクを取得します。フレームワークの自動判別や静的HTMLにも対応します。

• プロジェクトを公開してURLを共有したいとき
• 静的HTMLページの公開
• Vercelアカウントへの移管

市場・競合・消費者・財務などの調査について、章立てと必要データを設計し、収集済みの情報を図表・出典・戦略上の示唆を含むレポートにまとめるスキル。

• 調査の章立てと収集データを設計したいとき
• 市場・競合の調査結果を報告書にしたいとき
• 消費者理解やブランド戦略を整理したいとき

Slackのメッセージや絵文字に使うアニメーションGIFを作成します。揺れ・回転・跳ねる動きを組み合わせ、用途に合わせて容量や画像サイズを検証・調整するスキルです。

• リアクション用の動く絵文字を作成
• Slackのメッセージ用GIFを作成
• 用途に合わせてGIFを軽量化したいとき

リアルタイム音声の評価を始めるために、目的に合う実行基盤を選び、プロンプトやデータ、READMEのひな形を作成して評価とテストで検証するスキル。

• 単一ターンの音声評価を始めたいとき
• 保存音声を使った評価の準備
• 模擬ツールを含む複数ターン評価