ui-mobile
Mobile UI patterns - React Native, iOS/Android, touch targets
35
32%
Does it follow best practices?
Impact
—
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 topics with no verbs, no concrete actions, and no explicit trigger guidance. It fails to communicate what the skill actually does or when Claude should select it. While it includes a few useful keywords, it lacks the specificity and completeness needed for reliable skill selection.
Suggestions
Rewrite with concrete action verbs describing what the skill does, e.g., 'Designs mobile UI layouts, implements touch-friendly components, and adapts interfaces for iOS and Android platforms using React Native.'
Add an explicit 'Use when...' clause with natural trigger terms, e.g., 'Use when the user asks about mobile app UI, touch targets, React Native components, navigation patterns, or platform-specific design guidelines.'
Include additional natural keyword variations users might say, such as 'mobile app design', 'responsive mobile layout', 'gesture handling', 'bottom navigation', 'tab bar', or 'safe area'.
| 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 does — it reads more like a tag list than a capability description. | 1 / 3 |
Completeness | The description does not clearly answer 'what does this do' (no actions described) nor 'when should Claude use it' (no 'Use when...' clause or equivalent trigger guidance). Both dimensions are very weak. | 1 / 3 |
Trigger Term Quality | It includes some relevant keywords users might say ('React Native', 'iOS', 'Android', 'mobile UI', 'touch targets'), but misses many common variations like 'responsive design', 'mobile app', 'navigation patterns', 'gestures', 'swipe', 'bottom sheet', etc. | 2 / 3 |
Distinctiveness Conflict Risk | The mention of 'React Native' and 'touch targets' provides some specificity, but 'Mobile UI patterns' and 'iOS/Android' are broad enough to overlap with general mobile development, React Native coding, or platform-specific 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 patterns covering accessibility, components, navigation, and animations. However, it is severely bloated with significant content duplication (touch targets, accessibility labels, colors all appear twice), explains concepts Claude already knows, and dumps everything into a single monolithic file with no progressive disclosure structure. Trimming redundancy and splitting into referenced sub-files would dramatically improve this skill.
Suggestions
Remove duplicate sections: touch targets, accessibility labels, and color definitions each appear twice — consolidate into a single authoritative location for each.
Split into multiple files (e.g., COMPONENTS.md, ACCESSIBILITY.md, ANIMATIONS.md) and make SKILL.md a concise overview with links, reducing it to under 100 lines.
Remove explanations of basic React Native APIs (StyleSheet.create, Pressable, Platform.select) that Claude already knows — focus only on the specific values and patterns that are project-specific.
Add a validation workflow: how to verify touch target sizes, test contrast ratios, and audit accessibility labels (e.g., specific tools or scripts to run).
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | Extremely verbose at ~500+ lines with massive repetition. Touch target rules are defined in the mandatory section and then repeated nearly identically in the 'Touch Targets' section. Accessibility labels appear twice. Color definitions overlap between the mandatory section and the Color System section. Much of this content (how StyleSheet.create works, what Pressable is, basic React Native APIs) is knowledge Claude already has. | 1 / 3 |
Actionability | All guidance is backed by fully executable, copy-paste-ready TypeScript/TSX code examples. Specific values (44pt targets, color hex codes with contrast ratios, spacing scales) are concrete and immediately usable. Anti-patterns include both bad and good alternatives. | 3 / 3 |
Workflow Clarity | This is primarily a reference/pattern library rather than a multi-step workflow, so explicit sequencing is less critical. However, there's no clear guidance on the order of applying these patterns when building a screen, and the mandatory section at the top acts as a checklist but lacks a verification/validation step (e.g., how to actually check contrast ratios or test touch targets). | 2 / 3 |
Progressive Disclosure | Monolithic wall of text with no references to external files and no clear separation of overview vs. detail. Everything is inlined into a single massive document. The content would benefit enormously from splitting into separate files (e.g., COMPONENTS.md, ACCESSIBILITY.md, COLORS.md) with a concise overview in the main skill file. | 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 (955 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
7e5f7a2
- 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.