ui-mobile
Mobile UI patterns - React Native, iOS/Android, touch targets
44
32%
Does it follow best practices?
Impact
Pending
No eval scenarios have been run
Passed
No known issues
Optimize this skill with Tessl
npx tessl skill review --optimize ./skills/ui-mobile/SKILL.mdQuality
Discovery
22%Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.
This description is essentially a comma-separated list of keywords with no verbs, no concrete actions, and no 'when to use' guidance. It fails to communicate what the skill actually does (e.g., generates mobile layouts, reviews touch target sizing, creates navigation patterns) and provides no trigger conditions for Claude to select it appropriately.
Suggestions
Add concrete action verbs describing what the skill does, e.g., 'Generates mobile UI components, reviews touch target accessibility, and designs navigation flows for React Native, iOS, and Android apps.'
Add an explicit 'Use when...' clause, e.g., 'Use when the user asks about mobile app design, React Native components, touch target sizing, or iOS/Android UI patterns.'
Expand trigger terms to include natural user phrases like 'mobile app layout', 'responsive mobile design', 'navigation drawer', 'tab bar', 'mobile accessibility', and file/framework references like '.tsx', 'SwiftUI', 'Jetpack Compose'.
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | The description lists technology names and a concept ('touch targets') but does not describe any concrete actions. There are no verbs indicating what the skill actually does — it reads more like a tag list than a capability description. | 1 / 3 |
Completeness | The description weakly addresses 'what' (mobile UI patterns) but provides no 'when' clause or explicit trigger guidance. Both dimensions are very weak, with no 'Use when...' or equivalent. | 1 / 3 |
Trigger Term Quality | It includes some relevant keywords users might say ('React Native', 'iOS', 'Android', 'touch targets', 'Mobile UI'), but misses common variations like 'mobile app design', 'responsive layout', 'navigation patterns', 'mobile components', or 'swipe gestures'. | 2 / 3 |
Distinctiveness Conflict Risk | The mention of React Native, iOS/Android, and touch targets narrows the domain somewhat, but 'Mobile UI patterns' is broad enough to overlap with general UI/UX skills, React Native development skills, or platform-specific design skills. | 2 / 3 |
Total | 6 / 12 Passed |
Implementation
42%Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
The skill provides highly actionable, executable React Native code examples covering a comprehensive range of mobile UI patterns, which is its primary strength. However, it is severely undermined by extreme verbosity with significant content duplication (touch targets, accessibility labels, color definitions all appear twice), a monolithic structure that should be split across multiple files, and extensive explanation of patterns Claude already knows (basic React Native APIs, platform differences, animation fundamentals).
Suggestions
Eliminate redundancy by consolidating duplicated sections (touch targets, accessibility labels, color contrast rules each appear twice) into single authoritative sections.
Split into multiple files: keep SKILL.md as a concise overview with mandatory rules and the checklist, then reference separate files like COMPONENTS.md, COLORS.md, ANIMATIONS.md, and NAVIGATION.md.
Remove explanations of concepts Claude already knows (e.g., what Platform.select does, how Animated.timing works, basic StyleSheet.create usage) and focus only on project-specific conventions and non-obvious constraints.
Add a brief workflow section describing the recommended order of operations when building a new screen (e.g., safe areas → layout → components → accessibility audit → checklist verification).
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | Extremely verbose at ~600+ lines with significant redundancy. Touch targets are defined in detail in the MANDATORY section, then repeated almost identically in the 'Touch Targets' section. Accessibility labels appear twice. Color systems are defined twice (MANDATORY contrast section + Color System section). Much of this content (platform conventions, animation APIs, component patterns) is knowledge Claude already possesses. | 1 / 3 |
Actionability | Nearly all guidance is provided as fully executable TypeScript/TSX code with complete StyleSheet definitions, proper imports, and copy-paste ready components. Examples cover buttons, inputs, lists, navigation, animations, and loading states with concrete values. | 3 / 3 |
Workflow Clarity | This is primarily a reference/pattern skill rather than a multi-step workflow, so explicit sequencing is less critical. However, there's no clear workflow for how to apply these patterns when building a screen (e.g., start with safe areas → layout → components → accessibility audit). The 'Premium Feel Checklist' at the end serves as a partial validation checklist but lacks a verification process. | 2 / 3 |
Progressive Disclosure | This is a monolithic wall of content with no references to external files despite the opening note mentioning 'base.md + react-native.md'. All content—accessibility standards, component patterns, animations, color systems, navigation, typography—is inlined in a single massive file. The component patterns, animation examples, and detailed color systems should be split into separate reference files. | 1 / 3 |
Total | 7 / 12 Passed |
Validation
81%Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.
Validation — 9 / 11 Passed
Validation for skill structure
| Criteria | Description | Result |
|---|---|---|
skill_md_line_count | SKILL.md is long (956 lines); consider splitting into references/ and linking | Warning |
frontmatter_unknown_keys | Unknown frontmatter key(s) found; consider removing or moving to metadata | Warning |
Total | 9 / 11 Passed | |
- Repository
- alinaqi/claude-bootstrap
- Commit
d4ddb03
- Reviewed
Table of Contents
Is this your skill?
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.