mobile-ui
Mobile UI design and implementation
Informations de source
- Dépôt
- ffsshhttiikk/opencode-agents-skills
- Dernière activité de la source
- 28 février 2026 à 22:52
- Langue détectée de SKILL.md
- anglais
- Étoiles
- 3
- Forks
- 2
Options d'installation
Le prompt qui vérifie d'abord la source est sélectionné par défaut. Vous pouvez passer à une commande directe ou télécharger une copie locale.
Vérifiez les fichiers source
Lisez SKILL.md et les fichiers associés affichés par SkillsMP avant de décider de l'installer.
Affichage de SKILL.md
SKILL.md
Instructions source · Aperçu en lecture seule- name
- mobile-ui
- description
- Mobile UI design and implementation
- license
- MIT
- compatibility
- opencode
- metadata
- {"audience":"mobile-developers","category":"mobile-development"}
## What I do
- Design intuitive mobile user interfaces
- Implement responsive layouts for various screen sizes
- Create consistent navigation patterns
- Build accessible mobile experiences
- Optimize UI performance
- Design for different platform conventions (iOS vs Android)
- Implement animations and transitions
## When to use me
Use me when:
- Designing new mobile app screens
- Improving existing app usability
- Implementing platform-specific UI patterns
- Creating accessible mobile experiences
- Building custom UI components
- Optimizing UI rendering performance
## Key Concepts
### Platform Design Guidelines
- **iOS**: Apple Human Interface Guidelines (HUD, gesture-driven, depth)
- **Android**: Material Design 3 (material surfaces, motion, theming)
- **Cross-platform**: Balance consistency with platform expectations
### Responsive Layout Principles
```kotlin
// Android ConstraintLayout
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/title"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintWidth_max="600dp" />
<Button
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
```
### Navigation Patterns
- **Tab-based**: Bottom navigation for equal priorities
- **Stack**: Drill-down navigation
- **Drawer**: Side navigation for many items
- **Modal**: Focused tasks, forms
### Accessibility (a11y)
- Minimum touch targets: 48x48dp
- Color contrast ratios (4.5:1 minimum)
- Screen reader support (TalkBack, VoiceOver)
- Content descriptions for images
- Focus management for navigation
### Animation Principles
- Duration: 200-300ms for most transitions
- Easing: Accelerate/decelerate curves
- Respect motion preferences (reduce motion setting)
- 60fps target for smooth experience
Voir sur GitHub