building-native-ui

Guide Expo Router app development with native UI patterns and route organization.

Updated Jan 2, 2026

Search Tags:#react-native #mobile-development #expo #expo-router #ui-guidelines #native-ui

Ready to run

npx skills add https://github.com/IlyaKukarkin/bee_bloom --skill building-native-ui-ilyakukarkin

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: building-native-ui
Source: https://github.com/IlyaKukarkin/bee_bloom/tree/main/.agents/skills/building-native-ui
Command: npx skills add https://github.com/IlyaKukarkin/bee_bloom --skill building-native-ui-ilyakukarkin

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Builds developers' capacity to create polished Expo Router apps with native UI patterns, ensuring consistent structure and visuals across platforms.

Core Features & Use Cases

Guidance on route structure, file-based routing, and navigation patterns for Expo Router apps.
UI Best Practices for styling, components, and native tab integration, including accessibility considerations.
Real-World Use: design teams delivering mobile apps with cohesive UI and predictable architecture, from onboarding to daily use.

Quick Start

Create a new Expo Router project and apply the UI guidelines to structure routes, style components, implement native tabs, and add polished animations.

Frequently Asked Questions about building-native-ui

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I organize routes and file-based routing in an Expo Router app?▼

Expo Router uses file-based routing where directory structure defines navigation. This Skill guides route organization, file-based routing setup, and navigation patterns to ensure predictable app architecture across iOS and Android.

How do I integrate native tabs in Expo Router for iOS and Android?▼

Native-tabs integration in Expo Router requires configuring tab components within the route structure. This Skill provides guidance on native-tabs integration, ensuring consistent tab behavior and styling across iOS and Android.

What is the best way to add polished animations to Expo Router components?▼

Polished animations in Expo Router require applying specific animation patterns within route setup. This Skill describes animation patterns and UI component guidelines to achieve cohesive, polished visuals across platforms.

Does this Expo Router UI guidance cover accessibility considerations?▼

Yes, Expo Router UI guidelines include accessibility considerations alongside styling and component best practices. This Skill describes UI component requirements, native-tabs integration, and accessibility to ensure cohesive design from onboarding to daily use.

Can I use these native UI guidelines for an existing React Native project?▼

These native UI guidelines apply to React Native projects using Expo Router, focusing on styling, components, and navigation patterns. This Skill helps structure routes, implement native tabs, and apply polished animations within Expo-based mobile apps.