App UI Slopless

Visual design and UX for native app screens in SwiftUI (iOS and macOS), Jetpack Compose and Compose Multiplatform (KMP). Use whenever the user wants to design, build, restyle, redesign, theme or audit how an iOS, Android or Mac screen, window, flow, component or design system looks and feels — e.g. a screen that looks generic, boring, stock Material or "AI-made"; picking a type scale, colour palette or theme code; giving an app a style (warm premium, neo-brutalist, playful, editorial); or a UX critique of a mobile or Mac screen or screenshot (hierarchy, tap targets, thumb reach, sidebar and to

10 starsFrontend & Design

Install

skills CLI (Claude Code, Cursor, Codex and more)

npx skills add massipetro/app-ui-slopless --skill app-ui-slopless

Manual install

git clone --depth 1 https://github.com/massipetro/app-ui-slopless.git /tmp/app-ui-slopless
mkdir -p ~/.claude/skills
cp -r /tmp/app-ui-slopless/. ~/.claude/skills/app-ui-slopless

Personal skills live in ~/.claude/skills. Use .claude/skills in a project folder to share a skill with your team.

From the SKILL.md

# app-ui-slopless

Make native app UI (iPhone, Android, Mac) that people remember, on top of interaction design that holds up to the research.

**Platform first.** Decide which platform(s) the screen ships on before anything else, from the project (`Package.swift` platforms, the `.xcodeproj`'s deployment targets, `import AppKit`) or the request, and state it in your reply. The study-backed bones and the directions' brand layer are shared; the mechanics and the window composition are not. On a Mac, deal with `--platform macos` (step 2), read `references/platform-macos.md` and apply the **macOS** variants of the rules marked that way below (pointer and keyboard instead of thumb, windows and sidebars instead of one screen, fixed 13 pt text instead of Dynamic Type). Never ship an iPhone layout in a bigger window.

Two failure modes to avoid, equally:
- **Slop**: the generic look an AI produces by default. Grey-on-white cards with soft shadows, a purple-blue gradient, one sans everywhere at timid sizes, emoji as icons, everything rounded the same. It's forgettable, and the research says it costs you: people judge visual appeal in ~50 ms (Lindgaard 2006), rate attractive interfaces as more usable (Kurosu & Kashimura 1995; Tractinsky 2000), and flat, signifier-poor screens take ~22% longer to use (NN/g, Moran 2017).

Read the full skill on GitHub

Details

Skill name: app-ui-slopless
Repository: massipetro/app-ui-slopless
License: MIT
Repo updated: 26 October 2026

FAQ

What does the App UI Slopless skill do?

How do I install the App UI Slopless skill?

skills CLI (Claude Code, Cursor, Codex and more): npx skills add massipetro/app-ui-slopless --skill app-ui-slopless. Skills go in ~/.claude/skills (personal) or .claude/skills (project), and Claude loads them automatically when a task matches the description.

Is App UI Slopless popular?

It lives in massipetro/app-ui-slopless, which has 10 GitHub stars and 0 forks.

Related skills

Justskill Design

justskill-ai/justskill-design

Design and edit web pages as a validated HTML file with inline CSS, then fine-tune them on a local canvas. Use this skill whenever the user wants to design, mock up, wireframe, redesign or restyle a web page, app screen, or mobile screen — a landing page, dashboard, settings page, pricing page, empty state, onboarding flow, or any layout built from frames, text, images and icons — or wants to change the spacing, colour, typography or layout of an existing design, turn a design into deliverables, or bring in a `.pen` file. Also use it when the user asks for a visual editor for pages, a design f

Frontend & Design

Web Card Game

mars-tw/web-card-game-skill

維護「阿軒卡牌對戰」時使用。這是一款原生 HTML/CSS/JS 網頁 TCG，包含對戰、卡包、收藏、牌組工作台、每日任務、收藏里程碑與週任務。

Frontend & Design

UX Audit

paulunemoon/ux-audit-skill

Evidence-based UX audit of a product that already exists — marketing website, web app, mobile app, or desktop app. LOAD WHEN the request is to evaluate, review, critique, or diagnose an existing interface: "audit the UX of this app", "review this flow", "review this screen", "what's wrong with this onboarding", "why do users drop off here", "audit our current workflow", "is this accessible", "critique this product", "heuristic review", "a11y audit" — and the same intents in French ("audite l'UX", "revois ce parcours / cet écran", "qu'est-ce qui cloche dans cet onboarding", "pourquoi les utilis

Frontend & Design

Wcag Accessibility

mrKanoh/wcag-accessibility-audit-skill

WCAG 2.1/2.2 AA accessibility skill: audits, remediation, ARIA roles and patterns, keyboard navigation, focus management, screen reader behavior (NVDA, JAWS, VoiceOver, TalkBack), color contrast, accessible components (modals, menus, tabs, forms, tables, comboboxes), React, Vue, Angular, Svelte and Next.js, mobile a11y (React Native, SwiftUI, Compose), cognitive accessibility, legal compliance (ADA, EAA, Section 508, EN 301 549, VPAT/ACR) and CI testing (axe-core, pa11y, Playwright). Use when the user asks whether UI is accessible or passes WCAG, asks about ARIA, focus traps, live regions, ski

Frontend & Design

Designgate

sukenik-collab/claude-designgate

Mandatory human-in-the-loop UI design checkpoint. Use automatically — before writing any UI code — whenever the task involves building, creating, adding, or redesigning a user-facing screen, page, flow, component, interface, or frontend, unless every interaction maps to an already-decided pattern. Verifies a brand brief exists, reads prior UX decisions to avoid re-asking resolved questions, surfaces only genuinely unresolved interaction decisions (batched, max 5), generates a complete screen-generation prompt for the configured design MCP, and enforces a hard human approval gate before impleme

Frontend & Design

Rsa Whiteboard Teacher

tangyc828/RSA-Whiteboard-Animation

Generate RSA-style whiteboard animation storyboards with scene timing, image prompts, and narration scripts. Supports English and Chinese.

Frontend & Design

Browse the most popular Claude skills, all frontend & design skills, or write your own with the skills generator.