Does it provide guidance on mobile security?

Yes, it includes mandatory patterns for secure token storage using Keychain or SecureStore and warns against common pitfalls like hardcoding API keys or logging PII.

Can it help with platform-specific design requirements?

Absolutely. It contains dedicated reference logic for iOS Human Interface Guidelines and Android Material Design 3 to ensure your app feels native on every device.

Does this skill support both Flutter and React Native?

Yes, it includes specific performance patterns, state management advice, and optimization scripts for both Flutter and React Native frameworks.

How does this skill improve mobile app performance?

It enforces the use of optimized list components, prevents unnecessary widget re-renders, ensures animations use the native driver, and provides scripts for UX audits.

Mobile App Design & Performance

Name: Mobile App Design & Performance
Author: maskelog

bymaskelog

•

Mobile Development

Implements mobile-first design principles and performance patterns for iOS and Android applications.

The Mobile Design skill equips Claude with specialized knowledge for building high-quality mobile applications using React Native, Flutter, or native technologies. It moves beyond desktop-centric defaults by enforcing touch-first interactions, platform-specific UI conventions like Apple's Human Interface Guidelines and Android's Material Design, and mobile-optimized performance patterns. By prioritizing the 'thumb zone,' battery-conscious development, and offline-capable architectures, this skill ensures that mobile apps are platform-respectful experiences rather than just scaled-down websites.

Key Features

01Touch-first UI optimization using Fitts' Law and thumb zone mapping for better ergonomics.

02Offline-first architecture guidance including background sync and data persistence strategies.

03Platform-specific convention enforcement for iOS (HIG) and Android (Material 3) navigation.

04Secure data handling patterns using Keychain, SecureStore, and EncryptedSharedPreferences.

05Framework-specific performance auditing for React Native FlatLists and Flutter widget rebuilds.

061 GitHub stars

Use Cases

01Converting a web-based UI into a mobile-native experience with appropriate touch targets and gestures.

02Architecting cross-platform applications that maintain a native feel through platform-conditional logic.

03Optimizing React Native or Flutter list performance to eliminate jank and achieve a smooth 60fps.

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add maskelog/daegu_bus_flutter_app mobile-design

For use in Claude.ai and ChatGPT

Download Skill