mirror of
https://github.com/affaan-m/everything-claude-code.git
synced 2026-05-19 07:13:07 +08:00
ec9ace9c54
Translate everything-claude-code repository to Japanese including: - 17 root documentation files - 60 agent documentation files - 80 command documentation files - 99 rule files across 18 language directories (common, angular, arkts, cpp, csharp, dart, fsharp, golang, java, kotlin, perl, php, python, ruby, rust, swift, typescript, web) - 199 skill documentation files Total: 455 files translated to Japanese with: - Consistent terminology glossary applied throughout - YAML field names preserved in English (name, description, etc.) - Code blocks and examples untouched (comments translated) - Markdown structure and relative links preserved - Professional translation maintaining technical accuracy This translation expands ECC accessibility to Japanese-speaking developers and teams. Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
64 lines
3.6 KiB
Markdown
64 lines
3.6 KiB
Markdown
> このファイルは [common/patterns.md](../common/patterns.md) を Web 固有のデザイン品質ガイダンスで拡張します。
|
|
|
|
# Web デザイン品質基準
|
|
|
|
## アンチテンプレートポリシー
|
|
|
|
汎用的なテンプレートに見える UI をリリースしない。フロントエンドの出力は意図的で、主張があり、プロダクトに固有であるべきである。
|
|
|
|
### 禁止パターン
|
|
|
|
- 均一なスペーシングで階層のないデフォルトのカードグリッド
|
|
- 中央揃えの見出し、グラデーションブロブ、汎用 CTA の定番ヒーローセクション
|
|
- 完成したデザインとして出す未変更のライブラリデフォルト
|
|
- レイヤリング、深度、モーションのないフラットレイアウト
|
|
- すべてのコンポーネントで均一な角丸、スペーシング、シャドウ
|
|
- 1つのアクセントカラーだけの安全なグレー・オン・ホワイトのスタイリング
|
|
- サイドバー + カード + チャートで視点のないダッシュボード量産レイアウト
|
|
- 意図的な理由なしに使用されるデフォルトフォントスタック
|
|
|
|
### 必要な品質
|
|
|
|
すべての意味のあるフロントエンドサーフェスは、以下のうち少なくとも4つを示すべきである:
|
|
|
|
1. スケールコントラストによる明確な階層
|
|
2. 均一なパディングではなく、スペーシングの意図的なリズム
|
|
3. オーバーラップ、シャドウ、サーフェス、またはモーションによる深度やレイヤリング
|
|
4. 個性と実際のペアリング戦略を持つタイポグラフィ
|
|
5. 装飾的ではなく、セマンティックに使用される色
|
|
6. デザインされたと感じるホバー、フォーカス、アクティブ状態
|
|
7. 必要に応じたグリッドを打ち破るエディトリアルまたはベントーレイアウト
|
|
8. ビジュアルの方向性に合ったテクスチャ、グレイン、または雰囲気
|
|
9. 注意をそらすのではなく、フローを明確にするモーション
|
|
10. 後付けではなく、デザインシステムの一部として扱われるデータビジュアライゼーション
|
|
|
|
## フロントエンドコードを書く前に
|
|
|
|
1. 具体的なスタイルの方向性を選ぶ。「クリーンミニマル」のような曖昧なデフォルトを避ける。
|
|
2. パレットを意図的に定義する。
|
|
3. タイポグラフィを意図的に選択する。
|
|
4. 少なくとも少数の実際のリファレンスを集める。
|
|
5. 関連する ECC のデザイン/フロントエンドスキルを使用する。
|
|
|
|
## 価値あるスタイルの方向性
|
|
|
|
- エディトリアル / マガジン
|
|
- ネオブルータリズム
|
|
- 実際の深度を持つグラスモーフィズム
|
|
- 規律あるコントラストのダークラグジュアリーまたはライトラグジュアリー
|
|
- ベントーレイアウト
|
|
- スクローリーテリング
|
|
- 3D 統合
|
|
- スイス / インターナショナル
|
|
- レトロフューチャリズム
|
|
|
|
自動的にダークモードをデフォルトにしない。プロダクトが実際に求めるビジュアルの方向性を選択する。
|
|
|
|
## コンポーネントチェックリスト
|
|
|
|
- [ ] デフォルトの Tailwind や shadcn テンプレートに見えないか？
|
|
- [ ] 意図的なホバー/フォーカス/アクティブ状態があるか？
|
|
- [ ] 均一な強調ではなく階層を使用しているか？
|
|
- [ ] 実際のプロダクトのスクリーンショットで信憑性があるか？
|
|
- [ ] 両テーマをサポートする場合、ライトとダークの両方が意図的に感じられるか？
|