design-engineer-mindset
✓設計と実装の橋渡しをする設計エンジニアの役割を理解します。デザインをコードとして考え、レンダリング パイプラインを理解し、アニメーション パフォーマンスを最適化し、実装を通じてデザインの忠実性を確保する方法を学びます。設計をコードに変換する場合、パフォーマンスを最適化する場合、または開発を通じて品質を確保する場合に使用します。
SKILL.md
The Design Engineer is a unified role that bridges the traditional gap between design and implementation. Unlike a designer who hands off static mockups, or a developer who approximates designs, the Design Engineer understands that the medium of digital design is code.
This skill teaches you to think like a design engineer: understanding rendering pipelines, animation performance, and the physics of the browser as your design material.
Result: The final product never matches the design. Subtle animations are removed. Spacing is approximated. Interactions feel wrong.
設計と実装の橋渡しをする設計エンジニアの役割を理解します。デザインをコードとして考え、レンダリング パイプラインを理解し、アニメーション パフォーマンスを最適化し、実装を通じてデザインの忠実性を確保する方法を学びます。設計をコードに変換する場合、パフォーマンスを最適化する場合、または開発を通じて品質を確保する場合に使用します。 ソース: sanky369/vibe-building-skills。
引用可能な情報
AI/検索での引用用の安定したフィールドとコマンド。
- インストールコマンド
npx skills add https://github.com/sanky369/vibe-building-skills --skill design-engineer-mindset- カテゴリ
- </>開発ツール
- 認証済み
- ✓
- 初回登録
- 2026-02-01
- 更新日
- 2026-02-18
クイックアンサー
design-engineer-mindset とは？
設計と実装の橋渡しをする設計エンジニアの役割を理解します。デザインをコードとして考え、レンダリング パイプラインを理解し、アニメーション パフォーマンスを最適化し、実装を通じてデザインの忠実性を確保する方法を学びます。設計をコードに変換する場合、パフォーマンスを最適化する場合、または開発を通じて品質を確保する場合に使用します。 ソース: sanky369/vibe-building-skills。
design-engineer-mindset のインストール方法は？
ターミナルまたはコマンドラインツール（Terminal、iTerm、Windows Terminal など）を開きます このコマンドをコピーして実行します: npx skills add https://github.com/sanky369/vibe-building-skills --skill design-engineer-mindset インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code や Cursor で使用できるようになります
ソースリポジトリはどこですか？
https://github.com/sanky369/vibe-building-skills
詳細
- カテゴリ
- </>開発ツール
- ソース
- skills.sh
- 初回登録
- 2026-02-01