《移动UI设计项目教程》课件——8.学习单元2-排排美食APP原型全攻略.pptxVIP

排排美食APP原型全攻略

目录CONTENTS01项目与框架速览02分类页结构与导航03分类页核心区域绘制04分类子页逻辑深化05分享页场景化设计06关注页与全局复盘

01项目与框架速览

需求背景与模块总览经过公司多轮例会讨论，我们对“排排美食APP”的项目需求进行了深入分析，确定了其核心功能框架，为后续的原型设计奠定了清晰的业务边界与体验目标。分类:美食探索的核心入口，支持多维度筛选。推荐:基于用户喜好的个性化内容推送。摇一摇:增加趣味性的随机美食推荐功能。分享:构建美食社区，促进用户互动。我的:用户个人中心，管理个人信息与收藏。

画布与栅格设置为兼顾设计精度与观察便利性，我们采用iPhone6sPlus屏幕尺寸的一半进行原型绘制，并建立清晰的栅格系统。画布尺寸612x1104px(1224x2208px的一半)标准化栅格状态栏(StatusBar)高度:30px，用于显示系统信息。导航栏(NavigationBar)高度:62px，用于页面标题和核心操作。标签栏(TabBar)高度:70px，用于应用内主要视图的快速切换。

分类页原型图完成效果分类页子页面效果

02分类页结构与导航

状态栏与导航栏快速搭建通过标准化流程快速搭建页面顶部框架，确保一致性并提升效率。1.导入状态栏导入系统状态栏位图，保持左右安全间距。2.设置导航栏拖入