mobile-app

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Mobile App

移动应用

Use this pack for mobile product work across iOS and Android: shared app architecture, screen flows, native capabilities, performance, accessibility, and platform fit.
Defer route choice and lane selection to
../../reference/routing-matrix.md
. For
web/mobile UI
, keep
mobile-app
and
frontend-web
as the primary UI routes, start the harness lane with
visual-engineering
, use
frontend-ui-ux
only when stronger upstream product or interaction judgment helps, and add
impeccable
only as a supplementary refinement layer.
This pack covers both cross-platform and native overlays. Start from the product and device constraints first, then choose the overlay that best matches the codebase. Deprecated wrappers stay non-primary.
For setup posture, prefer refining an existing project in place. Treat direct
create
/
init
/
new
flows as greenfield-only and use them only when explicitly requested. Defer the full setup policy to
../../reference/project-setup-policy.md
.
此工具包适用于iOS和Android平台的移动产品开发工作:涵盖共享应用架构、页面流程、原生功能、性能、无障碍访问及平台适配。
路由选择和通道选择请参考
../../reference/routing-matrix.md
。对于
web/mobile UI
,请将
mobile-app
frontend-web
作为主要UI路由,以
visual-engineering
作为测试通道的起始项,仅当需要更专业的上游产品或交互判断时才使用
frontend-ui-ux
,且仅将
impeccable
作为补充优化层。
此工具包同时覆盖跨平台和原生开发方案。请优先从产品需求和设备限制出发,再选择最匹配现有代码库的开发方案。已弃用的包装器不作为首选方案。
关于项目搭建方式,优先选择在现有项目基础上进行优化。仅在明确要求的情况下,才将直接的
create
/
init
/
new
流程用于全新项目搭建。完整的搭建规则请参考
../../reference/project-setup-policy.md

Core focus

核心关注点

  • Design mobile flows around reachability, interruption, offline risk, and small-screen clarity.
  • Keep navigation, state ownership, and async behavior explicit.
  • Treat startup time, memory, battery, and frame stability as first-class quality bars.
  • Respect platform conventions instead of flattening iOS and Android into one lowest-common-denominator UX.
  • Pair with
    architecture-integration
    when contract, auth, or sync rules shape the app.
  • 围绕可触达性、干扰性、离线风险和小屏幕清晰度设计移动流程。
  • 明确导航逻辑、状态管理和异步行为。
  • 将启动时间、内存占用、电池消耗和帧稳定性作为核心质量指标。
  • 遵循平台规范,避免将iOS和Android的用户体验简化为最低标准的统一模式。
  • 当合约、认证或同步规则影响应用架构时,搭配
    architecture-integration
    工具包使用。

Shared mobile standards

通用移动开发标准

  • Make touch targets generous and predictable.
  • Build loading, empty, error, permission, and recovery states for real device conditions.
  • Prefer secure storage, least-privilege permissions, and explicit handling of device capabilities.
  • Keep background work, notification behavior, and offline sync intentional.
  • Validate accessibility, orientation changes, and resumed-session behavior.
  • 确保触控目标尺寸充足且位置可预测。
  • 针对真实设备场景构建加载、空状态、错误、权限申请和恢复状态。
  • 优先使用安全存储、最小权限原则,并明确处理设备功能。
  • 合理规划后台任务、通知行为和离线同步逻辑。
  • 验证无障碍访问、横竖屏切换和会话恢复行为。

Default workflow

默认工作流程

  1. Identify the dominant platform surface and select the nearest overlay in
    reference/
    .
  2. Map navigation, state, sync, permissions, and device capability needs before implementation.
  3. Implement primary flows first, then edge states, then performance and platform polish.
  4. Add the curated
    impeccable
    layer when visual refinement or anti-slop review is explicitly needed.
  5. Run
    review-work
    after significant mobile changes.
  1. 确定主导平台,选择
    reference/
    目录下最匹配的开发方案。
  2. 在实现前梳理导航、状态、同步、权限和设备功能需求。
  3. 优先实现核心流程,再处理边缘状态,最后进行性能优化和平台适配。
  4. 仅当明确需要视觉优化或防冗余审查时,添加精选的
    impeccable
    优化层。
  5. 在完成重大移动开发变更后执行
    review-work

Collaboration in this repo

本仓库协作规则

  • Use
    frontend-ui-ux
    only as a supporting upstream helper lane when mobile product or interaction judgment needs a stronger pass.
  • Use
    Explore
    to match local navigation, screen, and component conventions.
  • Use
    Librarian
    or
    Context7
    for framework and platform APIs.
  • Pair with
    architecture-integration
    for auth, contract, sync, or boundary-heavy work.
  • Add the owning backend pack when mobile changes depend on endpoint shape or service behavior.
  • 仅当移动产品或交互判断需要更专业的上游支持时,才将
    frontend-ui-ux
    作为辅助通道。
  • 使用
    Explore
    功能匹配本地导航、页面和组件规范。
  • 使用
    Librarian
    Context7
    查询框架和平台API。
  • 当涉及认证、合约、同步或边界逻辑较多的工作时,搭配
    architecture-integration
    工具包。
  • 当移动开发变更依赖端点结构或服务行为时,关联对应的后端工具包。

Overlays

开发方案参考

  • reference/react-native.md
  • reference/flutter.md
  • reference/swiftui.md
  • reference/jetpack-compose.md
  • reference/react-native.md
  • reference/flutter.md
  • reference/swiftui.md
  • reference/jetpack-compose.md

Guardrails

注意事项

  • Do not assume mobile is only React Native.
  • Do not trade platform fit for superficial UI parity.
  • Do not ignore startup cost, memory, or interrupted-flow recovery.
  • 不要默认移动开发仅使用React Native。
  • 不要为了表面的UI一致性牺牲平台适配性。
  • 不要忽略启动成本、内存占用或中断流程的恢复逻辑。