# [UI UX Pro Max](https://uupm.cc)
🇦🇿 Azərbaycanca | 🇮🇩 Bahasa Indonesia | 🇰🇷 한국어 | 🇻🇳 Tiếng Việt | 🇨🇳 简体中文 | 🇺🇸 English
Müxtəlif platforma və framework-lər üçün peşəkar UI/UX qurmağa kömək edən dizayn intellekti təqdim edən süni intellekt skill-i.
Faydalı hesab edirsinizsə, layihəyə dəstək olmağı düşünün:
Digər layihələr
NextLevelBuilder.io | GoClaw.sh | AgentKit.best | TOSE.sh
İdeyanı kəşf etməyə dəyər 3D səhnəyə çevirin.
Vizual ilham, benchmark deyil. Müəllif tərəfindən təqdim olunmuş, bu skill mövcud olmamışdan əvvəl çəkilmiş layihə; interfeysində Vyetnam dili var. Bu, tarixi görüntüdür, ingilis dilində demo və ya skill-in iş zamanı testi deyil — bax: media mənşəyi.
🤌 Vebsayt: https://3dviz.dev/
--- ## v2.0-da yeniliklər ### Ağıllı dizayn sistemi yaradılması v2.0-ın əsas xüsusiyyəti **Design System Generator**-dur — layihə tələblərinizi təhlil edən və saniyələr içində sizə uyğunlaşdırılmış tam dizayn sistemi yaradan süni intellektli əsaslandırma mühərriki. ``` +----------------------------------------------------------------------------------------+ | TARGET: Serenity Spa - RECOMMENDED DESIGN SYSTEM | +----------------------------------------------------------------------------------------+ | | | PATTERN: Hero-Centric + Social Proof | | Conversion: Emotion-driven with trust elements | | CTA: Above fold, repeated after testimonials | | Sections: | | 1. Hero | | 2. Services | | 3. Testimonials | | 4. Booking | | 5. Contact | | | | STYLE: Soft UI Evolution | | Keywords: Soft shadows, subtle depth, calming, premium feel, organic shapes | | Best For: Wellness, beauty, lifestyle brands, premium services | | Performance: cost:low | Accessibility: risk:conditional; verify requirements | | | | COLORS: | | Primary: #E8B4B8 (Soft Pink) | | Secondary: #A8D5BA (Sage Green) | | CTA: #D4AF37 (Gold) | | Background: #FFF5F5 (Warm White) | | Text: #2D3436 (Charcoal) | | Notes: Calming palette with gold accents for luxury feel | | | | TYPOGRAPHY: Cormorant Garamond / Montserrat | | Mood: Elegant, calming, sophisticated | | Best For: Luxury brands, wellness, beauty, editorial | | Google Fonts: https://fonts.google.com/share?selection.family=... | | | | KEY EFFECTS: | | Soft shadows + Context-appropriate transitions + Gentle hover states | | | | AVOID (Anti-patterns): | | Bright neon colors + Harsh animations + Dark mode + AI purple/pink gradients | | | | PRE-DELIVERY CHECKLIST: | | [ ] No emojis as icons (use SVG: Heroicons/Lucide) | | [ ] cursor-pointer on all clickable elements | | [ ] Interaction timing follows the platform, component, and user preference | | [ ] Light mode: text contrast 4.5:1 minimum | | [ ] Focus states visible for keyboard nav | | [ ] prefers-reduced-motion respected | | [ ] Text, chips, and badges reflow without clipping or broken labels | | [ ] Responsive: 375px, 768px, 1024px, 1440px | | | +----------------------------------------------------------------------------------------+ ``` ### Dizayn sisteminin yaradılması necə işləyir ``` ┌─────────────────────────────────────────────────────────────────┐ │ 1. USER REQUEST │ │ "Build a landing page for my beauty spa" │ └─────────────────────────────────────────────────────────────────┘ │ ▼ ┌─────────────────────────────────────────────────────────────────┐ │ 2. MULTI-DOMAIN SEARCH (5 parallel searches) │ │ • Product type matching (192 categories) │ │ • Style recommendations (79 searchable; 50 active) │ │ • Color palette selection (192 palettes) │ │ • Landing page patterns (34 patterns) │ │ • Typography pairing (74 font combinations) │ └─────────────────────────────────────────────────────────────────┘ │ ▼ ┌─────────────────────────────────────────────────────────────────┐ │ 3. REASONING ENGINE │ │ • Match product → UI category rules │ │ • Apply style priorities (BM25 ranking) │ │ • Filter anti-patterns for industry │ │ • Process decision rules (JSON conditions) │ └─────────────────────────────────────────────────────────────────┘ │ ▼ ┌─────────────────────────────────────────────────────────────────┐ │ 4. COMPLETE DESIGN SYSTEM OUTPUT │ │ Pattern + Style + Colors + Typography + Effects │ │ + Anti-patterns to avoid + Pre-delivery checklist │ └─────────────────────────────────────────────────────────────────┘ ``` ### 192 sahəyə xas əsaslandırma qaydası Əsaslandırma mühərriki aşağıdakı sahələr üçün ixtisaslaşmış qaydaları ehtiva edir: | Kateqoriya | Nümunələr | |------------|-----------| | **Tech & SaaS** | SaaS, Micro SaaS, B2B Service, Developer Tool / IDE, AI/Chatbot Platform, Cybersecurity Platform | | **Maliyyə** | Fintech/Crypto, Banking, Insurance, Personal Finance Tracker, Invoice & Billing Tool | | **Səhiyyə** | Medical Clinic, Pharmacy, Dental, Veterinary, Mental Health, Medication Reminder | | **E-ticarət** | General, Luxury, Marketplace (P2P), Subscription Box, Food Delivery | | **Xidmətlər** | Beauty/Spa, Restaurant, Hotel, Legal, Home Services, Booking & Appointment | | **Yaradıcı sahələr** | Portfolio, Agency, Photography, Gaming, Music Streaming, Photo/Video Editor | | **Həyat tərzi** | Habit Tracker, Recipe & Cooking, Meditation, Weather, Diary, Mood Tracker | | **Yeni texnologiyalar** | Web3/NFT, Spatial Computing, Quantum Computing, Autonomous Drone Fleet | Hər qaydaya bunlar daxildir: - **Tövsiyə olunan pattern** - Landing page strukturu - **Üslub prioriteti** - Ən uyğun UI üslubları - **Rəng əhval-ruhiyyəsi** - Sahəyə uyğun palitralar - **Tipoqrafiya əhval-ruhiyyəsi** - Şriftin xarakterinə uyğunluq - **Əsas effektlər** - Animasiyalar və interaksiyalar - **Anti-pattern-lər** - Nəyi ETMƏMƏK lazımdır (məsələn, bankçılıq üçün "AI bənövşəyi/çəhrayı gradient-lər") ## Xüsusiyyətlər - **79 axtarıla bilən UI üslubu (50-si aktiv)** - Glassmorphism, Claymorphism, Minimalism, Brutalism, Neumorphism, Bento Grid, Dark Mode, AI-Native UI və s. - **192 rəng palitrası** - 192 məhsul növü ilə 1:1 uyğunlaşdırılmış sahəyə xas palitralar - **74 şrift cütü** - Google Fonts import-ları ilə seçilmiş tipoqrafiya kombinasiyaları - **25 qrafik növü** - Dashboard və analitika üçün tövsiyələr - **22 texnologiya stack-i** - React, Next.js, Astro, Vue, Nuxt.js, Nuxt UI, Svelte, SwiftUI, React Native, Flutter, HTML+Tailwind, shadcn/ui, Jetpack Compose, Angular, Laravel, Three.js, JavaFX, WPF, WinUI 3, UWP, Avalonia, Uno Platform - **119 UX qaydası** - Ən yaxşı təcrübələr, anti-pattern-lər, əlçatanlıq qaydaları, davamlı mətn düzülüşü, yığcam etiketlər və ləğv edilə bilən interaksiyalar - **192 əsaslandırma qaydası** - Sahəyə xas dizayn sistemi yaradılması (v2.0-da YENİ) ### Davamlı mətn və yığcam UI Təlimat başlıqlar, uzun tokenlər, chip-lər, badge-lər və yarımçıq qalan mikro-interaksiyalarla bağlı tez-tez rast gəlinən istehsalat problemlərini əhatə edir: - Balanslaşdırılmış başlıq sətir keçidi mütərəqqi təkmilləşdirmədir, konkret sözün son sətirdə qalacağına zəmanət deyil. Dizaynlar müxtəlif en, şrift və lokallarda təbii sətir keçidi ilə də işləməlidir. - Vacib mətn dar enlərdə, brauzer zoom-unda, mətn miqyaslanmasında və istifadəçinin məsafə tənzimləmələrində kəsilmədən yenidən düzülməlidir. Uzun URL və identifikatorlar təhlükəsiz şəkildə sətirə bölünə bilər. - Chip və tag toplusu sətirə düzülməli və ya idarə oluna bilən `+n` açılışından istifadə etməlidir. Yığcam etiket mümkün olduqda bütöv qalmalıdır; qaçılmaz kəsilmə üçün klaviatura, kursor və toxunma istifadəçilərinə tam dəyərə əlçatan yol verilməlidir. - Badge-in mənası yalnız rəngə əsaslanmamalıdır. İnteraktiv chip-lər native semantikaya, görünən fokusa və proqramla oxuna bilən vəziyyətə malik olmalıdır; canlı sayğaclar mənalı kontekst daşımalıdır. - Sürətli interaksiyalar animasiyanı ləğv edə bilər, lakin son semantik vəziyyət, fokus və məzmun düzgün qalmalıdır. Vaxtlama platforma və komponentə görə seçilir, reduced-motion seçimlərinə hörmət edilir. ### Üslub taksonomiyası Kataloq sabit ID və alias-larla dəstəklənən **79 axtarıla bilən üslub** ehtiva edir: | Status | Say | Axtarış davranışı | |--------|----:|-------------------| | Active | 50 | Normal tövsiyələrə daxildir və qalereyada standart olaraq göstərilir | | Supplemental | 29 | Dəqiq və ya açıq variant/sistem niyyəti olduqda qaytarılır; qalereyanın status filtri ilə əlçatandır | | Deprecated | 9 | Normal sıralamadan çıxarılıb; köhnə adlar kanonik üslub və ya landing pattern-ə yönləndirilir | Aktiv dəstə 43 ümumi vizual ailə, 2 mobil üslub, 3 rəsmi platforma/dizayn sistemi, 1 platforma materialı və 1 əsas analitika üslubunu əhatə edir. Hazırkı rəsmi sistemlər Fluent 2, Shopify Polaris və Adobe Spectrum-dur; Liquid Glass Apple platforma materialı kimi, Material 3 Expressive mobil Material variantı kimi saxlanılır, Spectrum 2 isə supplemental-dır. Landing page strukturları BM25 sıralamasında vizual üslublarla rəqabət aparmasın deyə ayrıca 34 pattern-lik landing dataset-də yerləşir. Tam taksonomiya və mənşə məlumatlı metadata üçün [`styles.csv`](src/ui-ux-pro-max/data/styles.csv) faylına baxın. ## 💎 Basic və Premium versiya müqayisəsi Çox istifadəçi açıq mənbəli və premium versiyalar arasındakı fərqi soruşur. İş axınınıza uyğun olanı seçməyə kömək edəcək ətraflı müqayisə: ### 🟢 Basic versiya (bu repozitoriya) * **Tam açıq mənbə:** Fərdi developer-lər, hobbi layihələri və standart layihələr üçün idealdır. * **Əsas UI/UX intellekti:** 79 axtarıla bilən UI üslubuna (50-si aktiv), 192 məhsul növünə, rəng palitralarına və seçilmiş şrift cütlərinə tam çıxış. * **Ağıllı tövsiyələr:** Dəqiq dizayn uyğunluğu üçün daxili BM25 axtarış mühərriki. * **Çoxplatformalı dəstək:** 22 əsas framework üçün stack-ə xas təlimatlar (React, Vue, Tailwind, iOS, Android və s.). * **Dizayn sisteminin yaradılması:** CLI vasitəsilə uyğunlaşdırılmış UI qaydalarını, pattern-ləri və məntiqi dərhal yaradın. ### 🟡 Premium versiya * **Genişləndirilmiş brend dizayn skill-ləri:** UI/UX-dən kənara çıxaraq Brend kimliyi yaradılması, Loqo dizaynı, Korporativ kimlik proqramları (CIP), Bannerlər, Təqdimat slaydları və xüsusi ikonoqrafiyanı əhatə edir. * **Qabaqcıl aktiv yaradılması:** Sadəcə placeholder deyil, real vizual aktivlər yaratmaq üçün süni intellektli şəkil generasiyası ilə dərin inteqrasiya. * **Korporativ arxitektura:** Geniş miqyaslı komanda tətbiqləri üçün qurulmuş daha əhatəli və miqyaslana bilən Design Token arxitekturası. * **Prioritet dəstək:** Fasiləsiz tam dizayn iş axınına ehtiyacı olan komandalar və peşəkarlar üçün xüsusi texniki yardım. 👉 *Premium səviyyəyə keçid haqqında ətraflı məlumat üçün [uupm.cc](https://uupm.cc) saytına baxın.* ## Quraşdırma ### Claude Marketplace vasitəsilə (Claude Code) Claude Code-da iki əmrlə birbaşa quraşdırın: ``` /plugin marketplace add nextlevelbuilder/ui-ux-pro-max-skill /plugin install ui-ux-pro-max@ui-ux-pro-max-skill ``` ### CLI vasitəsilə (Tövsiyə olunur) ```bash # CLI-ı qlobal olaraq quraşdırın npm install -g ui-ux-pro-max-cli # Layihənizə keçin cd /path/to/your/project # AI köməkçiniz üçün quraşdırın uipro init --ai claude # Claude Code uipro init --ai cursor # Cursor uipro init --ai windsurf # Windsurf uipro init --ai antigravity # Antigravity uipro init --ai copilot # GitHub Copilot uipro init --ai kiro # Kiro uipro init --ai codex # Codex CLI uipro init --ai qoder # Qoder uipro init --ai roocode # Roo Code uipro init --ai gemini # Gemini CLI uipro init --ai trae # Trae uipro init --ai opencode # OpenCode uipro init --ai continue # Continue uipro init --ai codebuddy # CodeBuddy uipro init --ai droid # Droid (Factory) uipro init --ai kilocode # KiloCode uipro init --ai warp # Warp uipro init --ai augment # Augment uipro init --ai codewhale # CodeWhale uipro init --ai zcode # ZCode uipro init --ai kimi # Kimi Code uipro init --ai amazonq # Amazon Q Developer uipro init --ai openclaw # OpenClaw (.agents/skills/) uipro init --ai universal # Universal / Agent Standard (.agents/skills/) uipro init --ai all # Bütün köməkçilər ``` npm paketi `ui-ux-pro-max-cli`-dır; o hələ də `uipro` əmrini quraşdırır. Köhnə `uipro-cli` buraxılışları köhnəlib və cari asset-lər üçün istifadə edilməməlidir. ### Qlobal quraşdırma (bütün layihələr üçün əlçatan) ```bash uipro init --ai claude --global # ~/.claude/skills/ qovluğuna quraşdırır uipro init --ai cursor --global # ~/.cursor/skills/ qovluğuna quraşdırır uipro init --ai zcode --global # ~/.zcode/skills/ qovluğuna quraşdırır uipro init --ai kimi --global # ~/.kimi-code/skills/ qovluğuna quraşdırır uipro init --ai universal --global # ~/.agents/skills/ qovluğuna quraşdırır ``` ### Digər CLI əmrləri ```bash uipro versions # Mövcud versiyaların siyahısı uipro update # Skill fayllarını quraşdırılmış CLI paketindən yeniləyir uipro update --global # Qlobal skill fayllarını quraşdırılmış CLI paketindən yeniləyir uipro init --offline # Uyğunluq flag-ı; daxil edilmiş şablonları quraşdırır uipro init --dry-run # Fayl yazmadan quraşdırma addımlarına önbaxış uipro uninstall # Skill-i silir (platforma avtomatik təyin olunur) uipro uninstall --ai claude # Konkret platformanı silir uipro uninstall --global # Qlobal quraşdırmanı silir ``` ## İlkin tələblər Axtarış skripti üçün Python 3.x tələb olunur (yalnız standart kitabxana — skriptlər heç nə quraşdırmır və şəbəkə sorğusu göndərmir). Python-un quraşdırılıb-quraşdırılmadığını yoxlayın: ```bash python3 --version ``` Əgər yoxdursa, onu özünüz [python.org](https://www.python.org/downloads/) saytından və ya əməliyyat sisteminizin paket menecerindən (Homebrew, apt, winget) quraşdırın. Bu quraşdırma addımları **sizin — insan istifadəçinin** üçündür; bu skill-dən istifadə edən AI agent-lər maşınınıza heç bir proqram quraşdırmamalıdır, onlara bunun əvəzinə sizdən soruşmaq tapşırılıb. ## İstifadə ### Skill rejimi (avtomatik aktivləşir) **Dəstəklənənlər:** Claude Code, Cursor, Windsurf, Antigravity, Codex CLI, Continue, Gemini CLI, OpenCode, Qoder, CodeBuddy, Droid (Factory), KiloCode, Warp, Augment, CodeWhale, ZCode, Kimi Code, Amazon Q Developer, OpenClaw, GitHub Copilot Skill UI/UX işi istədiyiniz zaman avtomatik aktivləşir. Sadəcə təbii şəkildə yazın: ``` Build a landing page for my SaaS product ``` > **Trae**: Əvvəlcə **SOLO** rejiminə keçin. Skill UI/UX sorğuları üçün aktivləşəcək. ### İş axını rejimi (slash əmri) **Dəstəklənənlər:** Kiro, Roo Code, KiloCode Skill-i çağırmaq üçün slash əmrindən istifadə edin: ``` /ui-ux-pro-max Build a landing page for my SaaS product ``` ### Nümunə sorğular ``` Build a landing page for my SaaS product Create a dashboard for healthcare analytics Design a portfolio website with dark mode Make a mobile app UI for e-commerce Build a fintech banking app with dark theme ``` ### Mövcud tətbiqə tema tətbiq etmək [Skill-i quraşdırdıqdan](#quraşdırma) sonra tətbiqinizi AI köməkçinizdə açın və buna oxşar prompt istifadə edin. İş axını rejimində (Workflow Mode) əvvəlinə `/ui-ux-pro-max` əlavə edin. ```text Use the ui-ux-pro-max skill to retheme my existing React app. Target style: Minimalism & Swiss Style. First inspect the framework and styling-library versions, routes, components, styles, and existing theme tokens. Keep the current component structure, behavior, and business logic. Reuse and update the existing semantic tokens for colors, typography, spacing, radii, shadows, and interaction states; add missing tokens rather than creating a parallel theme system. Replace hard-coded styles one component at a time. Verify contrast, keyboard focus, responsive layouts, and all supported light/dark modes. Summarize changed files and any remaining hard-coded styles. ``` `Minimalism & Swiss Style` ifadəsini istədiyiniz [kataloq üslubu](src/ui-ux-pro-max/data/styles.csv) və ya vizual istiqamətlə əvəz edin. Axtarış nəticələri dizayn təlimatı verir; onlar tətbiqinizi avtomatik olaraq yenidən yazmır. **Tema miqrasiyası üçün yoxlama siyahısı:** - **Audit:** Üslub cədvəllərində, inline üslublarda və `bg-blue-600` və ya `text-[#1e293b]` kimi utility-lərdə temaya aid sərt kodlanmış dəyərləri tapın. - **Uyğunlaşdırma:** Tətbiqin mövcud üslub sistemində `background`, `surface`, `foreground`, `primary`, `border` və `ring` kimi semantik rolları təkrar istifadə edin. Çatışmayan rolları quraşdırılmış kitabxana versiyasının qaydalarına uyğun əlavə edin. - **Miqrasiya:** Sərt kodlanmış dəyərləri token istinadları ilə kiçik komponent qrupları ilə əvəz edin. Yalnız token-ləri dəyişmək onlardan istifadə etməyən üslublara təsir etməyəcək. - **Yoxlama:** Hər qrupdan sonra mətn/UI kontrastını, hover/focus/disabled vəziyyətlərini, responsiv düzülüşləri və dəstəklənən hər temanı yoxlayın. ### Necə işləyir 1. **Siz soruşursunuz** - İstənilən UI/UX tapşırığını verin (qurmaq, dizayn etmək, yaratmaq, implementasiya etmək, nəzərdən keçirmək, düzəltmək, yaxşılaşdırmaq) 2. **Dizayn sistemi yaradılır** - AI əsaslandırma mühərrikindən istifadə edərək avtomatik tam dizayn sistemi yaradır 3. **Ağıllı tövsiyələr** - Məhsul növünüzə və tələblərinizə əsasən ən uyğun üslubları, rəngləri və tipoqrafiyanı tapır 4. **Kod yaradılması** - UI-ı düzgün rənglər, şriftlər, məsafələr və ən yaxşı təcrübələrlə implementasiya edir 5. **Təhvildən əvvəl yoxlamalar** - Tez-tez rast gəlinən UI/UX anti-pattern-lərə qarşı yoxlayır ### Dəstəklənən stack-lər Skill aşağıdakılar üçün stack-ə xas təlimatlar təqdim edir: | Kateqoriya | Stack-lər | |------------|-----------| | **Web (HTML)** | HTML + Tailwind (standart) | | **React ekosistemi** | React, Next.js, shadcn/ui | | **Vue ekosistemi** | Vue, Nuxt.js, Nuxt UI | | **Angular** | Angular | | **PHP** | Laravel (Blade, Livewire, Inertia.js) | | **Digər web** | Svelte, Astro, Three.js | | **Desktop** | JavaFX, WPF, WinUI 3, Avalonia, Uno Platform, UWP | | **iOS** | SwiftUI | | **Android** | Jetpack Compose | | **Çoxplatformalı** | React Native, Flutter | Sorğunuzda istədiyiniz stack-i qeyd edin, yoxsa standart olaraq HTML + Tailwind istifadə olunacaq. ## Nümunələr ### Əvvəl/sonra: əməliyyat dashboard-u Sadə bir əməliyyat dashboard-u ([əvvəl](https://skill-fixture-before.theroost.dev)) yalnız UI UX Pro Max-ın onun üçün yaratdığı dizayn sistemindən istifadə edilərək yenidən üslublaşdırılıb ([sonra](https://ui-ux-pro-max-after.theroost.dev)). Əmr: `search.py "internal operations dashboard" --design-system --density 8 --motion 3 --variance 4`. *İllüstrativ, icma tərəfindən təqdim olunmuş nümunə; rəsmi demo, benchmark və ya skill-in iş zamanı testi deyil.* ## Dizayn sistemi əmri (qabaqcıl) Dizayn sistemi generatoruna birbaşa çıxış üçün: > Qeyd: Continue vasitəsilə quraşdırmısınızsa, aşağıdakı əmrlərdə `.claude/skills/` yolunu `.continue/skills/` ilə əvəz edin. Droid (Factory) üçün `.factory/skills/`, ZCode üçün `.zcode/skills/`, Amazon Q Developer üçün `.amazonq/skills/` istifadə edin (Amazon Q qaydanı yalnız `.amazonq/rules/ui-ux-pro-max.md` yolundan avtomatik yükləyir; `.amazonq/skills/` altındakı data və skriptlər qaydanın istinad etdiyi fayllardır). ```bash # ASCII çıxışı ilə dizayn sistemi yaradın python3 .claude/skills/ui-ux-pro-max/scripts/search.py "beauty spa wellness" --design-system -p "Serenity Spa" # Markdown çıxışı ilə yaradın python3 .claude/skills/ui-ux-pro-max/scripts/search.py "fintech banking" --design-system -f markdown # Domen üzrə axtarış python3 .claude/skills/ui-ux-pro-max/scripts/search.py "glassmorphism" --domain style python3 .claude/skills/ui-ux-pro-max/scripts/search.py "elegant serif" --domain typography python3 .claude/skills/ui-ux-pro-max/scripts/search.py "dashboard" --domain chart python3 .claude/skills/ui-ux-pro-max/scripts/search.py "error summary validation" --domain ux python3 .claude/skills/ui-ux-pro-max/scripts/search.py "decorative icon aria hidden" --domain icons python3 .claude/skills/ui-ux-pro-max/scripts/search.py "icon button accessible label" --domain icons python3 .claude/skills/ui-ux-pro-max/scripts/search.py "orphan heading line balance" --domain ux python3 .claude/skills/ui-ux-pro-max/scripts/search.py "badge chip label wraps to second line" --domain ux python3 .claude/skills/ui-ux-pro-max/scripts/search.py "rapid chip animation interrupted" --domain ux # Stack-ə xas təlimatlar python3 .claude/skills/ui-ux-pro-max/scripts/search.py "form validation" --stack react python3 .claude/skills/ui-ux-pro-max/scripts/search.py "responsive layout" --stack html-tailwind python3 .claude/skills/ui-ux-pro-max/scripts/search.py "chip badge overflow nowrap" --stack html-tailwind python3 .claude/skills/ui-ux-pro-max/scripts/search.py "tableview binding" --stack javafx python3 .claude/skills/ui-ux-pro-max/scripts/search.py "atlantafx primer enterprise theme" --stack javafx python3 .claude/skills/ui-ux-pro-max/scripts/search.py "enterprise tableview density permission" --stack javafx ``` Web-stack axtarışı versiyaya həssasdır. Köhnə major göstərilməyən sorğular cari, aktiv təlimatları qaytarır. Açıq köhnə terminlər və ya köhnə major-lar (məsələn, `Svelte 4` və ya `Next.js 15`) yalnız seçilmiş köhnə sətirləri qaytarır; onlar `Status` və `Applies To` ilə qeyd olunur. Uyğun köhnə təlimat seçilməyibsə, axtarış framework nəsillərini qarışdırmaq əvəzinə nəticə qaytarmır. ### Dizayn sistemini saxlamaq (Master + Overrides pattern-i) Dizayn sisteminizi sessiyalar arasında **iyerarxik əldə etmə** üçün fayllara saxlayın: ```bash # Yaradın və design-system/myapp/MASTER.md faylına saxlayın python3 .claude/skills/ui-ux-pro-max/scripts/search.py "SaaS dashboard" --design-system --persist -p "MyApp" # Həmçinin səhifəyə xas override faylı yaradın python3 .claude/skills/ui-ux-pro-max/scripts/search.py "SaaS dashboard" --design-system --persist -p "MyApp" --page "dashboard" ``` Bu, `design-system/` qovluq strukturunu yaradır: ``` design-system/ └── myapp/ # Hər layihə üçün bir qovluq (-p "MyApp" dəyərinin slug-ı) ├── MASTER.md # Qlobal əsas mənbə (rənglər, tipoqrafiya, məsafələr, komponentlər) └── pages/ └── dashboard.md # Səhifəyə xas override-lar (yalnız Master-dən fərqlər) ``` **İyerarxik əldə etmə necə işləyir:** 1. Konkret səhifə qurarkən (məsələn, "Checkout") əvvəlcə `design-system/[project-slug]/pages/checkout.md` faylını yoxlayın 2. Səhifə faylı varsa, onun qaydaları Master faylını **əvəz edir** 3. Yoxdursa, yalnız `design-system/[project-slug]/MASTER.md` istifadə olunur **Kontekstə həssas əldə etmə prompt-u:** ``` I am building the [Page Name] page. Please read design-system/[project-slug]/MASTER.md. Also check if design-system/[project-slug]/pages/[page-name].md exists. If the page file exists, prioritize its rules. If not, use the Master rules exclusively. Now, generate the code... ``` ## Arxitektura və töhfə vermək ### İstifadəçilər üçün Kod bazası **şablon əsaslı yaratma sisteminə** keçirilib. Bütün platformaya xas fayllar (`.cursor/`, `.windsurf/`, `.kiro/`, `.factory/` və s.) indi CLI tərəfindən dinamik olaraq yaradılır. **Quraşdırmaq üçün həmişə CLI-dan istifadə edin:** ```bash npm install -g ui-ux-pro-max-cli uipro init --ai