shape
81構築前にUXを計画する
チームは、ユーザーの目標、状態、制約を明確にする前にインターフェースを構築してしまうことがよくあります。このスキルはディスカバリーをガイドし、実装のためのデザインブリーフを作成します。
高インパクトなフロントエンド効果を構築する
高度なインターフェイス効果は、デザイン文脈やパフォーマンス確認なしでは期待どおりに機能しないことがあります。Overdrive は、エージェントが洗練されたフロントエンド強化を提案、構築、検証できるように導きます。
このリクエストをエージェントにコピーしてください。正規の Skill ページとマニフェストが含まれています。
Review the Skillstore skill "overdrive" from https://skillstore.io/skills/pbakaus-overdrive.md and its manifest at https://skillstore.io/api/skills/pbakaus-overdrive/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.エージェントは引き続き計画を提示し、セキュリティポリシーで必要な確認を求める必要があります。
AI エージェント、クローラー、スクリプトがページ全体ではなく整理されたコンテキストを必要とする場合は、これらのリンクを使ってください。
「overdrive」を使用しています。 Use overdrive on a settings dialog.
期待される結果:
トレードオフを含む 3 つのインタラクション方針、その後に選択されたモーフィングダイアログ実装と低モーション向けフォールバックのメモ。
「overdrive」を使用しています。 Use overdrive on a large analytics table.
期待される結果:
仮想スクロール、アニメーション付き状態変更、ワーカー支援のフィルタリング、ブラウザー検証、デバイステストを含むパフォーマンス計画。
「overdrive」を使用しています。 Use overdrive on a portfolio hero.
期待される結果:
フォールバック動作、モバイルパフォーマンスのメモ、最終調整のためのガイダンスを含む、ブラウザー検証済みのインタラクティブな視覚コンセプト。
All external command findings are false positives from Markdown fences, inline code terms, and illustrative CSS or JavaScript examples in SKILL.md. The system reconnaissance finding is also a false positive; the description covers ambitious frontend implementation and does not request host enumeration or data collection. No prompt injection, exfiltration intent, or malicious behavior was found.
バージョン付き評価レポート、中立的なバッジ、埋め込みカード、引用を共有できます。Skillstore は証拠を報告しますが、この Skill が安全かどうかは判断しません。
https://skillstore.io/skills/pbakaus-overdrive/audits/4?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report[](https://skillstore.io/skills/pbakaus-overdrive?utm_source=security_passport_badge)<a href="https://skillstore.io/skills/pbakaus-overdrive?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/pbakaus-overdrive/security.svg" alt="Skillstore security assessment" loading="lazy"></a><iframe src="https://skillstore.io/embed/skills/pbakaus-overdrive.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>pbakaus. (2026). overdrive security audit report (audit version 4) [Author version unspecified]. Skillstore. https://skillstore.io/skills/pbakaus-overdrive/audits/4@techreport{pbakaus-pbakaus-overdrive-2026,
author = {pbakaus},
title = {overdrive security audit report (audit version 4)},
institution = {Skillstore},
year = {2026},
number = {4},
url = {https://skillstore.io/skills/pbakaus-overdrive/audits/4},
note = {Author version unspecified}
}cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "overdrive security audit report (audit version 4)"
version: "unspecified"
type: report
authors:
- name: "pbakaus"
date-released: "2026-07-06"
url: "https://skillstore.io/skills/pbakaus-overdrive/audits/4"
identifiers:
- type: other
value: "skillstore:pbakaus-overdrive:audit:4"
description: "Skillstore immutable audit report identifier"
使いやすさとパフォーマンスを維持しながら、既存ページにモーション、インタラクション、レンダリングの洗練を追加します。
実装前に、複雑さ、ブラウザー対応、視覚的な適合性を含めて、複数の意欲的なアプローチを比較します。
リリース前に高度な効果を磨き込むため、ブラウザープレビュー、低モーション確認、デバイステストを使用します。
現在のページで overdrive を使用してください。2~3 個の遷移方針を提案し、トレードオフを説明して、コーディング前に私の選択を待ってください。
TARGET=<dashboard table> に overdrive を使用してください。フォールバックと低モーション時の挙動を含め、大規模データ向けの高性能なアニメーション計画を提案してください。
TARGET=<hero section> に overdrive を使用してください。WebGL、Canvas、CSS のアプローチを比較し、選択した方針をブラウザー検証付きで実装してください。
TARGET=<multi-step workflow> に overdrive を使用してください。高度なインタラクション計画を作成し、パフォーマンスリスクを検証し、反復的に実装して、デスクトップとモバイルで確認してください。
作成者
pbakausライセンス
MIT
Skillstore リビジョン
r1
バージョンに関する注意
作者はバージョンを宣言していません。
参照
e397ce5a135369cd6def89cb6400d013e2f68f2f
メンテナンスの新しさ
2026/7/18
利用状況
11 ダウンロード · 113 閲覧
ファイル構成
📄 SKILL.md
構築前にUXを計画する
チームは、ユーザーの目標、状態、制約を明確にする前にインターフェースを構築してしまうことがよくあります。このスキルはディスカバリーをガイドし、実装のためのデザインブリーフを作成します。
プロジェクトのデザインコンテキストを取得
AIによるデザイン作業では、セッションをまたぐとプロジェクトのコンテキストが失われがちです。このスキルは根拠を収集し、Claude、Codex、Claude Code向けに再利用可能なガイダンスを保存します。
ユーザーインターフェースに心地よさを加える
機能的なインターフェースは、重要な場面で平板で印象に残らなかったり、ストレスを感じさせたりすることがあります。このスキルは、Claude、Codex、Claude Code が、コピー、アニメーション、フィードバック、達成を祝うパターンを通じて、適切な仕上げを加えるのに役立ちます。
より優れたオンボーディング体験を設計する
新規ユーザーは、プロダクトの価値がすばやく伝わらないと離脱しがちです。このスキルは、ユーザーを最初の成功へ導くオンボーディング、空状態、ガイド付きヘルプの設計を支援します。
インターフェースデザインを簡素化する
複雑なインターフェースは意思決定を遅らせ、主要なユーザー目標を見えにくくします。このスキルは Claude、Codex、Claude Code が不要な要素を取り除き、階層を明確にし、必要な機能を維持できるように導きます。
UIレイアウトと視覚的リズムを改善する
混雑したインターフェイスや反復的なグリッドは、プロダクトの見やすさと信頼性を損ないます。このスキルは、Claude、Codex、Claude Codeがより優れた余白、階層、レスポンシブな構成を実現できるよう導きます。
個性的なフロントエンドインターフェイスを設計する
作成者 Atman36
一般的な生成インターフェイスは、予測可能で弱い印象になりがちです。このスキルは、Claude、Codex、Claude Code が個性的で本番品質のフロントエンドデザインへ向かうよう導きます。
React View Transitions を実装する
作成者 vercel-labs
React view transitions は配置を誤りやすく、意図しない静かなアニメーションや目立つアニメーションを引き起こします。このスキルは、route、Suspense、list、shared element のアニメーション選択を導きます。
本番環境対応のフロントエンド機能を構築
作成者 davila7
フロントエンドチームには、プロジェクト間で一貫したReactおよびNext.jsのガイダンスが必要です。このスキルは、フロントエンド分析のためのリファレンスワークフロー、品質プラクティス、ヘルパースクリプトを提供します。
React と Next.js のパフォーマンス最適化
作成者 vercel-labs
React と Next.js アプリは、ウォーターフォール、大きなバンドル、回避可能な再レンダリングによって速度が低下しがちです。このスキルは、エージェントがより安全にパフォーマンス重視の変更を行うための具体的なルールを提供します。
セキュリティと品質のためのコードレビュー
作成者 AutumnsGrove
手作業のコードレビューでは、セキュリティ、パフォーマンス、テストに関する問題を見落とすことがあります。このスキルは、Claude、Codex、Claude Code に、チェックリストと補助的なスキャンガイダンスを備えた構造化されたレビュー手順を提供します。
Vue 3 のコード品質を向上
作成者 vuejs-ai
Vue プロジェクトでは、時間の経過とともに reactivity、component、performance に関するミスが蓄積しがちです。このスキルは、より安全なパターンと明確なコードのために、Vue 3 に特化したガイダンスを提供します。