How do I install the Human Saas UI skill?

Run npx skillmds@latest add oguzakkuss/human-saas-ui in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Human Saas UI safe to use?

This skill has not completed SkillMD's automated safety review yet. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Human Saas UI?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Human Saas UI free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Human Saas UI?

oguzakkuss (@oguzakkuss) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Human Saas UI by oguzakkuss — Agent Skill

Name: Human Saas UI
Author: oguzakkuss

Human Saas UI

Removes AI/vibe-coded UI slop and produces professional, trustworthy SaaS interfaces. Enforces muted palettes, Lucide/Phosphor icons over emojis, consistent hierarchy, dense quiet cards, real-data layouts, progressive onboarding, ethical confirms, and anti-template landing pages. Use when building or refactoring UI, dashboards, settings, or marketing pages, or when the user asks to make an interface look less AI-generated, more expensive, human-crafted, or Stripe/Attio-like.

oguzakkuss Updated Sep 22, 2026

File contents

Human SaaS UI

AI’nin varsayılan “bitmiş görünen” ekranını sök; kullanıcının işini bitiren, sakin ve güvenilir bir SaaS arayüzü kur.

Kaynak sentezi: Olly Rosewell SaaS UI — https://youtu.be/9d5fRVDkzRI (rosewell.dev).

Ne zaman kullan

Yeni UI / dashboard / settings / landing yazarken
“AI gibi duruyor”, “ucuz”, “vibe-coded”, “daha profesyonel” denince
Mevcut arayüzü polish / redesign ederken

İş akışı

Tara — references/anti-slop-checklist.md ile mevcut veya önerilen UI’yi gez.
Ucuz kazançlar — emoji→icon, tutarsız radius/font/verb, mor/glow/gradient gürültüsü, tekrarlayan KPI kart yığını.
Tek intent — Her sayfa bir soruya cevap versin; dekorasyonu ve ikinci niyeti sil.
Kuralları sabitle — Spacing scale, button height, radius, action verb’leri projede tek kaynak yap (markdown veya design tokens); AI’nın sayfalar arası drift’ini engelle.
App vs landing
- App: muted chrome; renk sadece status / birincil aksiyon.
- Landing: references/landing-page.md — ürün screenshot, tek CTA dili, anti-template.
Ürün UX — references/product-ux.md: progressive onboarding, skeleton, confirm/complete, value tracker.
Referans görseller — Kullanıcı beğendiği site screenshot’ı verdiyse onu görsel otorite al; AI’ya “modern dashboard” bırakma.

Sabit kurallar (özet)

Konu	Kural
Emoji	Dekoratif emoji yok → Lucide / Phosphor / Feather
Renk	Restrained base + tek accent; renk = veri durumu veya eylem
Tutarlılık	Aynı radius, type scale, spacing; aynı aksiyon = aynı fiil (`Delete`)
Layout	Sayfa = bir iş; analytics’i teams sayfasına taşıma
Kartlar	Buton sırasını `⋯` menüye; chip→icon; asıl metriği öne al
Veri	Gerçek / çirkin data ile test; truncate, empty, loading, error
Onboarding	Zorla tour yok; progressive; ilk adım belirgin + progress
Hız	Skeleton; >1s işlerde progress; boş beyaz bekleme yok
Güven	Destructive/expensive → confirm (+ gerekirse type-to-confirm) + completion state
Motion	Anlam taşımayan animasyon yok; load-more tercih (footer erişimi)
Landing	Alternating text/image template yok; stok foto yok; crop ürün UI; CTA metinleri aynı

Test sorusu (her öğe için): Bu, kullanıcının geldiği işi bitirmesine yardım ediyor mu? Sadece dekorasyonsa sil.

Çıktı beklentisi

Önce neyin slop olduğunu kısaca söyle, sonra düzelt.
Renk/typografi/spacing için tutarlı token’lar kullan; rastgele hex saçma.
Örnekler için examples/before-after.md.

Progressive disclosure

Anti-slop detay → references/anti-slop-checklist.md
Onboarding / hız / confirm → references/product-ux.md
Landing → references/landing-page.md

---name: human-saas-uidescription: Removes AI/vibe-coded UI slop and produces professional, trustworthy SaaS interfaces. Enforces muted palettes, Lucide/Phosphor icons over emojis, consistent hierarchy, dense quiet cards, real-data layouts, progressive onboarding, ethical confirms, and anti-template landing pages. Use when building or refactoring UI, dashboards, settings, or marketing pages, or when the user asks to make an interface look less AI-generated, more expensive, human-crafted, or Stripe/Attio-like.---# Human SaaS UIAI’nin varsayılan “bitmiş görünen” ekranını sök; kullanıcının işini bitiren, sakin ve güvenilir bir SaaS arayüzü kur.Kaynak sentezi: Olly Rosewell SaaS UI — https://youtu.be/9d5fRVDkzRI ([rosewell.dev](https://www.rosewell.dev/)).## Ne zaman kullan- Yeni UI / dashboard / settings / landing yazarken- “AI gibi duruyor”, “ucuz”, “vibe-coded”, “daha profesyonel” denince- Mevcut arayüzü polish / redesign ederken## İş akışı1. **Tara** — [references/anti-slop-checklist.md](references/anti-slop-checklist.md) ile mevcut veya önerilen UI’yi gez.2. **Ucuz kazançlar** — emoji→icon, tutarsız radius/font/verb, mor/glow/gradient gürültüsü, tekrarlayan KPI kart yığını.3. **Tek intent** — Her sayfa bir soruya cevap versin; dekorasyonu ve ikinci niyeti sil.4. **Kuralları sabitle** — Spacing scale, button height, radius, action verb’leri projede tek kaynak yap (markdown veya design tokens); AI’nın sayfalar arası drift’ini engelle.5. **App vs landing** - App: muted chrome; renk sadece status / birincil aksiyon. - Landing: [references/landing-page.md](references/landing-page.md) — ürün screenshot, tek CTA dili, anti-template.6. **Ürün UX** — [references/product-ux.md](references/product-ux.md): progressive onboarding, skeleton, confirm/complete, value tracker.7. **Referans görseller** — Kullanıcı beğendiği site screenshot’ı verdiyse onu görsel otorite al; AI’ya “modern dashboard” bırakma.## Sabit kurallar (özet)| Konu | Kural ||------|--------|| Emoji | Dekoratif emoji yok → Lucide / Phosphor / Feather || Renk | Restrained base + tek accent; renk = veri durumu veya eylem || Tutarlılık | Aynı radius, type scale, spacing; aynı aksiyon = aynı fiil (`Delete`) || Layout | Sayfa = bir iş; analytics’i teams sayfasına taşıma || Kartlar | Buton sırasını `⋯` menüye; chip→icon; asıl metriği öne al || Veri | Gerçek / çirkin data ile test; truncate, empty, loading, error || Onboarding | Zorla tour yok; progressive; ilk adım belirgin + progress || Hız | Skeleton; >1s işlerde progress; boş beyaz bekleme yok || Güven | Destructive/expensive → confirm (+ gerekirse type-to-confirm) + completion state || Motion | Anlam taşımayan animasyon yok; load-more tercih (footer erişimi) || Landing | Alternating text/image template yok; stok foto yok; crop ürün UI; CTA metinleri aynı |**Test sorusu (her öğe için):** Bu, kullanıcının geldiği işi bitirmesine yardım ediyor mu? Sadece dekorasyonsa sil.## Çıktı beklentisi- Önce neyin slop olduğunu kısaca söyle, sonra düzelt.- Renk/typografi/spacing için tutarlı token’lar kullan; rastgele hex saçma.- Örnekler için [examples/before-after.md](examples/before-after.md).## Progressive disclosure- Anti-slop detay → [references/anti-slop-checklist.md](references/anti-slop-checklist.md)- Onboarding / hız / confirm → [references/product-ux.md](references/product-ux.md)- Landing → [references/landing-page.md](references/landing-page.md)

Frequently asked questions