模拟抖音APP原型图制作.pdfVIP

抖音 APP 原型图制作 原型图制作信息 ? 抖音 APP 版本： 11.2.0 ? APP 运行平台： iPhone8 IOS 13.4.1 ? 原型图设计软件： Axure RP 8 ? 软件运行平台： macOS 10.15.5 ? 原型图页面尺寸： 375*667 抖音 APP 产品结构图 抖音 APP 从产品设计上来看主要分为 6 大模块，分别是登录、首页、 关注、发布视频、消息管理、我 共计 6 个模块，每个模块对应不同的 内容，从页面层级上来绘制抖音 APP 的产品结构图简单如下： 产品原型图大致也是按照上述产品结构图绘制， 该原型图主要展示抖音 APP 主要功能页面及交互流程，细节页面和交互未做详细绘制。 抖音 APP 原型图制作 登录 首页 关注 发布 消息 我 总结 原型图绘制个人经验总结 对于产品新手来说，初期临摹绘制产品原型图时，多使用 Axure 软件 的辅助线和页面截图来辅助绘制， 可快速定位元件位置和大小，能更快 完成元件的绘制和位置摆放， 对于新手来说比较友好； 将图片大小修改 成与原型图页面大小一致的尺寸， 通过 X 轴和 Y 轴辅助线快速绘制元件。 需要重复使用的元件或者页面， 通过创建母版可极大提高原型图绘制速 度，若需要修改同一页面元件的样式，直接修改母版样式即可。 绘制好的原型图多使用组合功能， 以防止对页面拖动时改变页面元件的 布局；同时，在绘制过程中，尽量对具有整体性的元件集合设置组合， 方便元件拖动时不改变元件布局。 对于产品新手来说，在设置元件颜色时，尽量使用颜色提取工具，可保 持元件颜色的准确性。 可通过导入外部元件库的方式来提升原型图绘制效率， 对于常用的元件 可自行整理成一套元件库使用。 对于抖音 APP 的一些思考 产品整体页面简洁直观， 可操作和不可操作区域均通过明显的颜色来进 行区分，且整体页面风格都采用对比度很高的颜色来进行视觉上的区 分，例如登录页面中可操作按钮和不可操作按钮使用红色和灰色进行区 分，极大提高了用户使用体验。 对于同一页面中不同的展示菜单， 均使用不同的文字颜色或是颜色条来 进行区分。 例如导航菜单当前页面菜单使用白色字体加底部白色导航条 进行区分；但在颜色对比上还有优化空间，且页面颜色运用较为凌乱， 颜色统一性运用有优化空间， 例如不同页面的导航条颜色可做归一化处 理。 整体交互逻辑比较简洁直观， 对于用户友好性较高。但部分页面存在重 复情况，可做页面归一化处理，例如“消息”页面中的“粉丝”列表和 “我”页面中的粉丝列表两个页面存在重复，且目前页面不是同一个， 可做页面归一化处理。