腾讯网静态网站建设,陕西网站备案代理,代驾软件开发需要多少钱,小程序介绍一.流程图设计流程图(Flow Chart)#xff1a;用图示的方式反映出特定主体为了满足特定需求而进行的有特定逻辑关系的一系列操作过程。流程图的四种基本结构#xff1a;顺序结构#xff0c;条件结构(又称选择结构)#xff0c;循环结构#xff0c;分支结构。1.流程图的常用符…一.流程图设计流程图(Flow Chart)用图示的方式反映出特定主体为了满足特定需求而进行的有特定逻辑关系的一系列操作过程。流程图的四种基本结构顺序结构条件结构(又称选择结构)循环结构分支结构。1.流程图的常用符号意义图8-1流程图的常用符号意义2,软件业务流程图设计一般我们在写产品需求文档的时候我们需要设计流程图一般一个PRD里面会由几个大的主流程图几个子模块的流程图构成。主流程图不需要很详细只要描述大概的通用操作流程。而在具体业务模块下再去设计详细的角色操作流程图。流程图设计完后先切分业务模块然后绘制线框图。图片示例图8-2 一个注册页面的通用流程图图8-2 一个注册页面的通用流程图作为制定一项交互设计工作计划的开端我们可以从探寻以下几个问题开始。1.为什么要做这个功能业务目的2.产品期望得到怎样的成果业务目标3.谁来使用这个功能目标用户4.他们为什么要使用这个功能用户需求、体验目标5.如何让他们都来使用这个功能行为设计在了解这几个问题的基础上逐步展开一系列的动作有序落实交互设计的前期工作计划。主要包括1、分析业务需求一2、分析用户需求一3、分解关键因素一4、归纳设计需求明确设计策略。二.手绘线框图1.页面功能模块的划分根据产品需求确定模块划分和页面内容为视觉和研发提供设计和开发标准。线框图设计要素界面内容、元素布局、优先顺序、关联分组。线框图要做到结构将产品的各个页面放到一起。内容页面显示内容是什么信息层次如何组织和展示这些信息布局功能页面如何工作完成任务视觉顺序行为与用户如何交互它是如何运转的线框图设计步骤明确该页面功能和任务确定设计页面所需信息内容对页面信息内容进行布局调整页面元素细节尺寸定位等。2.手绘线框可以买专门的手绘线框本然后铁皮的手绘线框原型钢尺。图8-3原型钢尺图8-4 原型工作小组图8-5手绘原型手绘线框一般在产品功能需求文档做完功能拓扑图及重要流程设计完毕然后开始把功能分配到各个页面上。有一些敏捷式开发时会让设计师一边讨论一边绘制手绘线框手绘线框图的优势是可以用最小的成本探讨设计可行性等问题。所以设计师平时应该多使用APP竞品使得自己对各类APP版式非常熟悉APP中比较重要的页面有注册、登录、首页、个人中心、设置、导航分类、播放器、各种列表、社交、购物车、照片库、侧滑、搜索、地图、社区、对话框、精品推荐等。十二类常见APP页面导航:图8-6十二种特色APP导航A、底部导航釆用文字加图标的方式展现。一般有3〜5个标签大部分APP选用这种导航优点是可以不迷路的在各个模块中切换缺点是会分割页面内容占有一定的底部空间。B、顶部导航优点适用于较多的分类卡片可以左右滑动隐藏更多功能缺点是需要2手操作。C、舵式导航优点是可以把常用功能或者重要功能居中醒目显示缺点是图标熟练只能单数。D、瓦片式导航优点简约而不简陋导航清晰、明显。缺点进入模块后要退出才能回到菜单。E、列表式优点可以对内容非常多的数据进行不断加载滑动缺点是单调容易引起疲劳。F、弹出菜单优点是形式节省空间新颖缺点是需要猜测和记忆内部功能。G、瀑布流优点是图片展示类可以一直下滑视觉效果好缺点是要找之前滑过去的图片需要上下翻很久。H、卡片翻转优点是视觉效果好动感强。I、侧滑菜单抽屉导航指的是一些功能菜单按钮隐藏在当前页面后点击入口或侧滑即可像拉抽屉一样拉出菜单。这种导航设计比较适合于那么不需要频繁切换的次要功能例如对设置、关于、会员、皮肤设置等功能的隐藏。缺点是需要猜测和记忆被隐藏的功能。J、时间轴优点是适合时间线发帖打卡性质的页面缺点是页面记录信息有限,需要点入后查看。K、数据可视化优点适合各种数据图表展示缺点耗费空间并且开发繁琐。L、自由添加优点可以让客户自由定义功能模块缺点开发麻烦客户有学习成本。3. APP线框设计低保真原型设计线框图一般分为低保真中保真高保真。低保真一般文字加简单的色块线框标示出大概布局和功能即可手绘或者AXURE自带功能即可。中保真基本加上了图标的形态尺寸也比较精确一些隐藏页面和操作提示会在旁边写明拥有了简单的逻辑跳转。高保真基本和开发出来的上线版本80%〜90%类似了有细腻的跳转动效或者交互操作反馈基本就是没连数据库的ALPHA版。图8-7页面之间的跳转原型交互线框4.常见APP交互跳转手势图8-8、APP常见交互手势UEgood学员APP线框作业展示做线框要注意合理性在保证顶部标题栏状态栏和底部导航栏尽力按官方系统APP的尺寸外可点击区域不要小于44DP,也就是手指点击尽量不要按到另一个控件出现误操作。同类功能和图标控件使用一致的尺寸设计及同类控件集中在一起不同的功能用不同的间距隔开颜色上尽量使用5〜7个色阶区分功能块。同类的页面多去收集一些排版在手绘线框的时候,多推敲下尽量让页面视觉效果又好看交互操作又方便合理。图8-9健身APP线框图8-10金融APP线框图8-11 运动APP线框图8-12金融APP线框
