# نظام طراحی سامانه هوشمندی راهبردی دانشگاه اصفهان (Design System Specification)

این سند مرجع رسمی و استانداردهای طراحی دیداری، سلسله‌مراتب تایپوگرافی، پالت رنگ، الگوهای کامپوننت و راهنمای نگارش سامانه **«رادار آینده دانشگاه اصفهان»** است.

---

## ۱. تایپوگرافی (Typography Standard)

### ۱.۱. قلم واحد سازمانی (Universal Font Family)
- تمام متون، اعداد، نشان‌ها، دکمه‌ها و عناصر واسط کاربری باید منحصراً از قلم **Vazirmatn** استفاده کنند.
- استفاده از فونت‌های مونو یا سیستمی (`font-mono`, `Consolas`, `Courier`) برای اعداد و برچسب‌های فارسی **اکیداً ممنوع** است. اعداد فارسی باید با وزن متناسب قلم وزیرمتن نمایش داده شوند.

```css
*, ::before, ::after {
  font-family: 'Vazirmatn', -apple-system, BlinkMacSystemFont, 'Segoe UI', Tahoma, sans-serif !important;
}
```

### ۱.۲. مقیاس و سلسله‌مراتب تیترها (Heading Hierarchy & Contrast)
- **قاعده اساسی**: تیترها و عناوین باید به رنگ **مشکی کامل** (`#0f172a` یا `#000000`)، با وزن **بسیار ضخیم (Bold 800 - Black 900)** و با اندازه چشمگیر نسبت به متن بدنه باشند تا سلسله‌مراتب بصری در یک نگاه درک شود.

| سطح عنصر | نام کلاس | اندازه فونت (rem / px) | وزن قلم | رنگ متن | کاربرد |
|---|---|---|---|---|---|
| **Display / Hero** | `.text-display` | `2.25rem` (36px) | 900 (Black) | `#0f172a` | ارقام کلیدی داشبورد و شاخص‌های آمادگی ۱۴۱۵ |
| **Heading 1** | `.heading-1` / `h1` | `1.75rem` (28px) | 900 (Black) | `#0f172a` | عنوان اصلی هر صفحه |
| **Heading 2** | `.heading-2` / `h2` | `1.25rem` (20px) | 800 (ExtraBold) | `#0f172a` | تیتر بخش‌های اصلی و سرفصل‌ها |
| **Heading 3** | `.heading-3` / `h3` | `1.00rem` (16px) | 800 (ExtraBold) | `#0f172a` | عنوان کارت‌های رادار و پنل‌های تحلیلی |
| **Heading 4** | `.heading-4` / `h4` | `0.875rem` (14px) | 700 (Bold) | `#1e293b` | عناوین فرعی و آیتم‌های لیست |
| **Body Main** | `.body-main` / `p` | `0.8125rem` (13px) | 500 (Medium) | `#334155` | متن توضیحات و خلاصه‌های سیاستی |
| **Caption / Meta**| `.caption` | `0.75rem` (12px) | 600 (SemiBold) | `#64748b` | اطلاعات فراداده، افق زمانی و منابع |
| **Badge / Chip** | `.badge-label` | `0.6875rem` (11px) | 700 (Bold) | متناسب با دسته | برچسب‌های وضعیت و شمارنده‌ها |

---

## ۲. پالت رنگ و کنتراست (Color Palette)

### ۲.۱. بوم و پس‌زمینه‌ها (Canvas & Surfaces)
- **بوم اصلی (Canvas Background)**: `#f4f6fb` (خاکستری سرد و ملایم با مش گرادینت سبک)
- **کارت‌ها (Card Surface)**: `#ffffff` (سفید یکدست با سایه نرم `0 8px 24px -4px rgba(15,23,42,0.04)`)
- **کارت‌های فرعی (Subtle Surface)**: `#f8fafc`
- **خطوط حاشیه (Borders)**: `#e2e8f0` (خطوط تفکیک‌کننده محکم اما چشم‌نواز)

### ۲.۲. رنگ‌های موضوعی پاستلی (Pastel Theme Tints)
برای طبقه‌بندی هوشمندی آینده و ایجاد زیبایی در ساختار جعبه‌های بنتو:
- **روندها (Trends)**: پس‌زمینه `#eaf3fe` | حاشیه `#c8e0fd` | متن `#0284c7`
- **فناوری‌ها (Tech)**: پس‌زمینه `#e6f6f1` | حاشیه `#c4ecdf` | متن `#059669`
- **سیاست‌ها (Policies)**: پس‌زمینه `#fef7e6` | حاشیه `#fde8b8` | متن `#d97706`
- **سیگنال‌های آینده (Signals)**: پس‌زمینه `#fdecf2` | حاشیه `#f9cbd9` | متن `#e11d48`
- **برنامه‌ریزی ۱۴۱۵ / مثلث آینده**: پس‌زمینه `#f3effe` | حاشیه `#ded2fd` | متن `#7c3aed`

---

## ۳. نوار کناری ناوبری (Sidebar Standard)

- **بدنه نوار کناری**: پس‌زمینه سفید خالص (`#ffffff`)، مرز چپ با صفحه `#e2e8f0`، عرض ۲۷۰ پیکسل.
- **عناوین بخش‌ها**: خاکستری ملایم `#94a3b8`، فونت ۱۰.۵ پیکسل، وزن ۸۰۰، حروف کوچک، با فاصله مناسب از گروه قبلی.
- **دکمه‌های ناوبری**:
  - *حالت عادی*: متن `#475569`، آیکون ۲۰ پیکسل با رنگ `#64748b`، گوشه‌های گرد ۱۲ پیکسل (`rounded-xl`).
  - *حالت شناور (Hover)*: پس‌زمینه `#f1f5f9`، متن مشکی `#0f172a`.
  - *حالت فعال (Active)*: پس‌زمینه سرمه‌ای تیره لوکس `#0f172a`، متن سفید خالص `#ffffff`، آیکون روشن، سایه ملایم.
- **شمارنده‌ها و برچسب‌ها**:
  - نشان‌های عددی باید در سمت چپ آیتم قرار گیرند (`align-self: flex-start` در ساختار راست‌به‌چپ).
  - متن شمارنده کاملاً با قلم وزیرمتن فارسی و بدون فونت مونو یا فاصله بی‌مورد درج شود.
- **حذف متون دوزبانه زاید**:
  - تمامی پرانتزهای انگلیسی غیرضروری مانند `(Overview)`، `(Trends)`، `(Tech)`، `(Policies)`، `(Signals)`، `(Spider Gap)`، `(PULL/PUSH)` و `(CRUD)` در نوار کناری **ممنوع** بوده و با واژگان حرفه‌ای و فاخر فارسی جایگزین می‌شوند.

---

## ۴. استانداردهای هندسی نمودارها و مدل‌های بصری

### ۴.۱. مثلث هوشمندی آینده (Futures Triangle Geometry)
- **تناسب ابعادی استاندارد**:
  - از ترسیم مثلث‌های عریض، پخ و تخت (نسبت عرض به ارتفاع ۲ به ۱) اکیداً پرهیز شود.
  - نسبت ارتفاع به قاعده مثلث باید بین **۰.۸۵ تا ۰.۹۰** باشد (شبیه به مثلث متساوی‌الاضلاع کشیده و متوازن).
  - اضلاع مثلث باید با خطوط رنگی ضخیم (حداقل ۴ پیکسل) و گرادینت‌های جهت‌دار متصل شوند.
  - گره مرکزی (هوشمندی دانشگاه اصفهان) دقیقاً در گرانیگاه هندسی $(x_c, y_c)$ قرار گیرد.

### ۴.۲. رادار دایره‌ای آینده‌پژوهی (Futures Radar)
- دایره مرکزی سفید مرواریدی، پره‌های رنگی ملایم برای ۴ ربع، نقاط سیگنال با حاشیه سفید تمیز و عدد شدت اثر درون نقطه.

### ۴.۳. نمودار عنکبوتی ۱۰ بعدی (Spider Gap Chart)
- چندضلعی هدف دانشگاه اصفهان ۱۴۱۵ به رنگ سبز زمردی (`#00b894`) و چندضلعی وضع موجود به رنگ کهربایی (`#f59e0b`).

---

## ۵. راهنمای زبان و لحن سازمانی (Content & Tone Standards)

1. **حذف واژگان تکراری و عبارات توخالی (Zero AI-Slop)**:
   - حذف برچسب‌های آکادمیک گل‌درشت مانند `نظریه سوهیل عنایت‌الله (Sohail Inayatullah)` از هدر صفحات و استفاده از برچسب‌های راهبردی خلاصه (`چارچوب آینده‌پژوهی`).
   - حذف توضیحات شعاری و کش‌دار؛ محتوا باید مستقیماً پیامد دانشگاهی، عدد شاخص یا اقدام فوری را گزارش دهد.
2. **نگارش فارسی معیار و روان**:
   - به کارگیری اصطلاحات دقیق آینده‌پژوهی و مدیریت دانشگاهی (مانند: *سیگنال‌های ضعیف، افق زمانی، شکاف بلوغ، شایستگی‌های نوظهور، آمایش آموزشی*).