一阶段九节day09产品设计下

u目了解今天的主u目了解今天的主要学习内容；了解什么是小程序；知道小程序的特点；uuuu微信uu微信小程序产品设计规u微信小程序的违禁行u七大定律今日今天的学习知识前什么知识前什么是小程什么是小什么是小案思小程序有哪些思小程序有哪些特点？什么是小小程序：什么是小小程序：一种不需要下载安装，即可使用的应用；开发成本低；流畅的使用体验；庞大的流量池可供使用；用完即走，不占用手机内存，但是有使用记录供用户可方便的再目u了解主流小目u了解主流小程序的上线时间；了解小程序覆盖的主要行业；u知识前什么是小知识前什么是小小程序的市场小程序的市场环小程序市场时小程序上线17-01-09微信小程序17-08-18支小程序市场时小程序上线17-01-09微信小程序17-08-18支付宝小程序面向开发者18-03-20国内10家手机厂商宣布正式成立快应用联盟，推出快应用18-07-04百度正式发布智能小18-09-17今日头条上线小18-09-23淘宝轻店铺内测18-10-24抖音小程序内测18-11-07小程序市场小程序市场小程序市场环-今日头小程序市场环-今日头小程序市场环境-小程序市场环境-支付小程序市场环境-微社旅电小程序市场环境-微社旅电直教小程序市场环境支付以钱、小程序市场环境支付以钱、信任、服务为特色，聚焦商业和生活服务的小程序生态头条秉承“信息创造价值”理念，借助小程序更好满足用户需求；微信小程餐饮、酒店、电影院、ktv、足浴按摩水疗、运动健身、酒吧、网吧、茶馆、棋牌室、桌游、农家乐、户外拓展、旅游、机票火车票、婚摄摄影、课程培训、汽车服务、体检、洗衣、配眼镜、鲜花、蛋糕、美容美发美甲、整形、化妆、搬家、宠物、家电维修、招聘、房地产、装修建材、工商注册、二手物品等行几乎能够胜任目前市面上的绝大多数行业的使用场景小程序市场环境小程序市场环境小程序市场环境小什么叫做小程一种小程序市场环境小什么叫做小程一种不需要下载安装即可使用的应有哪些主流的在做小程序的平台？微信、支付宝、今日头条微信小程序适用于哪些行业？几乎能够胜任目前市面上的绝大多数行业的使用场景；目 了解选择做小程序的要点；目 了解选择做小程序的要点；思既然微信小程思既然微信小程序有这么多优势，而且在很多行业都可以发挥作用，但为什么市面上并不是所有人都只做小程序呢？如何确定要不要做小程序如何确定要不要做小程序选择做小程序的要案选择做小程序的要案相同点都可以查看相关内容够购买实体书不同点App可以完成所有功能小程序里面对于音频专栏能查看不能购买APP、小程序、服务号、H5的对APP、小程序、服务号、H5的对选择做小程序的要案选择做小程序的要案相同点商品详情、下单、付款的完整的基础功能都不同点App做的更加大而全，甚至结合选择做小程序的要案选择做小程序的要案相同点都可以查看收听音频歌不同点App不仅包含音频还包频、社区等相关功选择做小程序的要-选择做小程序的要-公司产品所处根据现阶段的主要目拉新激活留存转化传播选择做小程序的要选择做小程序的要是否跟腾讯有业务重合度社交类的小程游戏类的小程…选择做小程序的要选择做小程序的要小1.选择要做一款小程序时有哪几个要点？根据产品业务根据产品形态根据公司所处是否跟腾讯有业务重目 了解小程序的接入流程；目 了解小程序的接入流程；微信小程微信小程如何接入微信小程如何接入微信小程接入流如何接入微信如何接入微信小程如何接入微信如何接入微信小程选择账号类型以后不可如何接入微信小如何接入微信小程每个邮箱仅能申请一个小程序如何接入微信小如何接入微信小程如何接入微信小程账号主范个18岁以上如何接入微信小程账号主范个18岁以上有国内身份信息的微信实名企企业、分支机构、企业相关企业（个体工商户个体工政国内、各级、各类政府机构、事业单位、具有行政职能的社会组织等，目前主要覆盖公安机构、党团机构、司法机构、交通机构、旅游机构、工商税务机构、市媒报纸、杂志、电视、电台、通讯社、其其他组不属于政府、媒体、企业或个人的如何接入微信小程如何接入微信小程填写小程序的基本信息，名称、图标、描述等如何接入微信小程如何接入微信小程小1.接入微信小程序流程是什么？注册、小程序信息完善、开发小程序、提交审核和发布；目u了解产品的目u了解产品的设计流程；了解小程序的设计规范（友好礼貌）；u微信小程微信小程产品开发流需求收需求分产品开发流需求收需求分产品设需求评需求开产品上相关设计规友好相关设计规友好礼清晰明便捷优统一稳纠正反例去掉任何与用户纠正反例去掉任何与用户目标不相内容，明确页面主题，在技术和页面控件允许的前提下提供内容，比如最近搜索词此页面的主题是查却添加了诸多与查询不相关的业务入口，与用户的目标无关，易造成用户的迷失反例示纠正操作没有反例示纠正操作没有主次，缺导，让用户无从选首先要避免并列过多操作户选择，在不得不并列多个操作时，需区分操作主次，减轻面，在用户进行某一个操作流程时，应避免出现用目 了解小程序的设计规范（清晰明确目 了解小程序的设计规范（清晰明确）；小程序的所有页面，都小程序的所有页面，都在右上角放置官方菜单；样式不可修改，但可选择深浅两种配小程序菜单位置固定，设计时预留出该位置；若需要在此区域附近放置交互元素，要特别注意交互事件是否会冲突，不要产生误操开发者可在满足开发者可在满足可用性的前提下，从微信提供的深浅两套配色的小程序菜单中选择合适的方案，以适应小程序页面设计风可在页面内添加自可在页面内添加自有导保持不同页面间导航一致，指向清晰，有路可退；受限于手机屏幕尺寸的限制，小程序页面的导航应尽量简单；建议自有导航样式与微信官方小程序菜单样式保持一定差异，以便区小程序内可以添小程序内可以添加标签分页（Tab）导航；标签分页栏可固定在页面顶部或者底标签数量不得少于2个，最多不得超过5个，建议标签数量不超过4项；一个页面也不应出现一组以上的标签分页栏；小程序首页可选择微信提供的原生底部标签分页样式，该样式仅供小程序首页使标签的图标样式、文案以及文案颜色可以自定义；相关设计规-导航颜相关设计规-导航颜色定义规小程序导航栏支持基本的背景颜色自定义功能，选择的颜色需要在满足可用性前提下，和谐搭配微信提供的两套主导航栏图请这样设保持文字请这样设保持文字与选中态足够的区请勿这样文字与选中态的区分度不明确，无法启动页页面下拉刷新模态加页面启动页页面下拉刷新模态加页面内局部全局加模态对微信小程序相关设微信小程序相关设计规范小1.微信小程序进行产品设计时，有哪些设计规范需要注意？重点突出、流程明确、小程序菜单、页面内导航、导航颜色定义规范、顶部标签栏、页面加载、结果反馈；目 了解小程序的特殊功能；目 了解小程序的特殊功能；特殊功客服特殊功客服特殊功扫码扫码打特殊功扫码扫码打开指定的页扫码传递信特殊功模板特殊功模板微信小程序特殊功微信小程序特殊功小1.微信小程序的特殊功能？客服消息、扫码功能、模板目 了解小程序的产品设计行为规范；目 了解小程序的产品设计行为规范；微信小程微信小程小程序的违禁一小程序的违禁一经发现，将根据违规程度，对该小程序进行限制功能，直至封禁处理。链接 滥用分享行不得存滥用分享行不得存在滥用分为，如不得要求（包括明示或暗示）用户分享不得通过利益诱惑诱导用户分享、传播互推行不得自行互推行不得自行或与其他第三方，共同利用腾讯的服务对微信小程序进行推荐、推广、排行，或集中设立跳转、添加平台服务，也不得为上述行为提供任何协助或便利。欺诈行包括但不欺诈行包括但不限于虚假红为多级分销行不得多级分销行不得通过微信小程序实信息诱导用户进行添加享或直接参违规内违规内储存国家法律法规禁止虚拟支付行开发虚拟支付行开发者在iOS系统上提供的虚商品，不能展现任何有购买、支付的功能、页面、按钮，即使实际上它们都不可使用；也不得引功能刷不得存在恶意刷不得存在恶意刷票、刷粉述行为提供工具或服网网程序、利诱其他用户参与、转发、下载或委托刷单平台品、积分等；诱导下载或使用APP获取收益外不得使用或推外不得使用或推荐、介绍插件、外挂或其他违规第三方工具、服务接入本服务和相关系统；如：售卖或宣传解功能软件混淆应混淆应微信小程序名称、icon、简介、描述、所提供的功能等响其他违禁行隐私/肖像行其他违禁行隐私/肖像行过度营销类目不符侵犯知识产权存在过度营销、展示或传播骚用户造成骚扰未经腾讯书面同意，任何开发者不得自行或与其他第三方共同利用腾讯的服务，侵犯其他主体的知识产权，包括但不限于文字、图片、视频、音频、软件等小程序当前所选类目与帐号所社交-直播类目，视为类目符擅自使用他人已经登记注册的企业名称或商标，侵犯他人企业名称专用权及商标专用权以及企业商誉。擅自使用他人名称、头像，侵害他人名誉权、肖像权等合法权利。未经授权发送、传播他人个人隐私资料，侵犯他人隐私权等合法权益小程序的违禁小小程序的违禁小1.有哪些微信明确我们不得触碰的行为规范？滥用分享行为、互推行为、欺诈行为、多级分销经营行为、违规内容、过度营销行为、虚拟支付行为、侵犯知识行为、类目不符行为、刷量、网赚、外挂、侵犯名誉/商誉/隐私/肖像行为、混淆行为；目u了解网站的目u了解网站的搭建流程；了解网站设计规范涉及的模块；u网站搭建网站搭建网站设计网站不同于移动应用：屏幕适配（屏幕尺寸、分网站设计网站不同于移动应用：屏幕适配（屏幕尺寸、分率交互方式不同，鼠标相对手指具备更精准的点击范围，有更要注意相关设计规范12345678u了解网站的设计尺寸u了解网站的设计尺寸及版心；了解网站的导航结构及设计要求；了解网站的常用字体字号；目uu网站设计规-设计尺寸及2012年以前，分辨率主要是还是1024*768，版心为现网站设计规-设计尺寸及2012年以前，分辨率主要是还是1024*768，版心为现在，电脑分辨率主要是1920*1080，版心为960-1200（默认安全区1200即可）分辨率比例版心主流15CRT（显像管）17寸17寸、寸普屏版网站设计规范-导航710px（首屏710px（首屏左右结构1、左右网站设计规范-导航710px（首屏710px（首屏左右结构1、左右布局，灵活性3、右侧为内容板块范围，是网站内容展示区居中结构1、居中布局，中间的灰色部分为有效的显示区域，用于网站内容的展示2、两边均为留白，没有实际用途，只是为了适配而存3、内容显示区域控制在1000px-1200px版心内其他内导版心内其他内网站设计规范-导网站设计规范-导航简单导航设计要遵循以下原则：简单：每个网站都应该有尽可能简单的结清晰：导航的每项对用户而言，都应该是清楚一致：系统的导航页在每一页中都应该是相同用户最少的点击，最快地到达目的网页PC导航：面包屑，非线APP导航：线网站设计规范-常用字体网站中网站设计规范-常用字体网站中文建议使微软雅字体，英文则建议使字体；iOS系统用苹方字体；安卓用思源黑体1.12px是网页设计的最小字号，适用于突出性的日14px则适用于非突出性的普通正文内容；16px或18px适用于突出性的标题内容；网站的字体大小没有硬性规定，根据实际情况以酌情考虑，但是要使用偶数字号2.3.4.网站设计规-常用字体间距及透字体网站设计规-常用字体间距及透字体间距舒适范围，除了特殊的需求之外，都可以使用默认数值的间距：1、行间距，字号大1.5-22、段间距，字号大2-2.53、当选用14px字号时，行间距：21-28px；透明度1、87%为正文标题；2、54%为二级标题；3、26%禁用状态和提示文字；4、12%分割线；字重也需要透明度u了解产品设计中的跨平u了解产品设计中的跨平台相似性；了解网站的超链接的处理；了解网站的控件设计；目uuu网站设计规范-网站设计规范-跨平台相用户体验设计的重要标准：统一；（电脑、平板、手机、音乐播放器、智能手表友好易用网站设计规范-网站设计规范-超链接的处理超链接时，需注意：超链接是网站中的重要组成元点击过的超链接要改变字体颜色如果带检索功能，搜索结果中，要对关键字出变色处理，提示用户网站设计规范-视觉按网站设计规范-视觉按视觉顺序设计网站时，需注意：将网页标题、登录注册按钮、导航栏等重要的内容，放在用户很容易看到的地方，以减少用户寻找的时间目的-让用户最快获取到他想要从左到右，从上到下字型网站设计规范-控件网站设计规范-控件能点击的按钮，需要给出操作提示（hover效果或点击效果不能点击的按钮，不要做成按钮的样式，页面中相同级别的按钮，保持设计样式网站设计规范网站设计规范-在不同设备上采用相似的设计；导航的设计要简单易用、清晰明了；改变访问过的超链接文字颜色；让页面浏览变得更容易；确保能点击的元素让用户看起来就能点击。目 知道网站产品设计的注意事项；目 知道网站产品设计的注意事项；网站设计-注意页面加载速度网站设计-注意页面加载速度：当用户在等待内容加载时，他们很可能会变的沮丧；如果加载速度很慢，用户很可能会离开这个网站；解决方-懒加载、预加载返回按钮：新打开的页面中尽量有返回按钮（或者面包屑导航）；如果一定要跳转到独立的页面，设置为在新窗口打开慎用促销、广告：促销和广告会抢夺用户的注意力，影响他们访问网站；慎用滚动劫持：用户最不喜欢的设计之一，用户有权决定自己浏览的网页和APP的位置；慎用自动播放音视频：需要用打开的音视频文件，设置为非自动播放的形式；文字配色：不要使用繁重的颜色背景，配方方案要协调、易接受；不要使用闪烁的文字目u了解七大定目u了解七大定律的主要内容；知道菲茨定律的定义及意义；u七大定律与产品设七大定律与产品设七大定律概Cooper（交互设计之父）：除非有更七大定律概Cooper（交互设计之父）：除非有更好的选择，否则就从标许多设计准则都基于人类心理人们如何感知、学习、推理、记忆，以及把意图转换为行动。七大定菲茨定席克定奥卡姆剃刀原泰思勒定神奇数字7±2接近法防错原菲茨定1、菲茨（PaulFitt）菲茨定1、菲茨（PaulFitt）菲茨定律所提出的人机界面设计法则，主页定义了游标移动到目标之间的距离，目标的大小和所花费的时间之间的关系：T代表：完成移动所需的平均时b代表：光标移动速度；D代表：从起点到目标中心的距W代表：目标的宽菲茨定菲茨定菲茨定菲茨定菲茨定可点击对菲茨定可点击对象（按钮）需要合理的大小尺菲茨定参考用户菲茨定参考用户使用手机习菲茨定减少绝对距离菲茨定减少绝对距离目标越近，用户点击越所以我们通常会缩短当前交互元素和目标元素的距离，来提高用户的使用通常会把按钮和常用操作元素放面下方的易操作区菲茨定减少相对在菲茨定减少相对在两个或多个操作中，通过缩短互元素之间的距离来提高用户的使效率菲茨定屏幕的边缘和菲茨定屏幕的边缘和角落无限i和M系统中都得到应用，Wiosdck栏放在屏幕的底端，菜单放在屏幕的顶菲茨定屏幕的边菲茨定屏幕的边和角无线移动端也同样适合，边角一般会放置菜单相关的元素；菲茨定课程小菲菲茨定课程小菲茨定律的对于产品设计时的启示：u按钮等可点击对象需要合理的大小尺 屏幕的边和角很适合放置像菜单栏和按钮这样的元素；目u了解席克定目u了解席克定律的内容；知道席克定律对产品设计的作用；u席克定2、席克当席克定2、席克当你想点一杯茶饮，你看着琳琅的茶饮是不是无从下在生活日常中你会对各种各样的而困扰，其实有时候不是你的问而是对方给予你的选择太席克定定律内容：席克定定律内容：一个人面临的选择(n)越多要作出决定的时间(T)就越长在人机交互中界面中选项越多，意味着用户做出决定的时间越席克定用数学公式表席克定用数学公式表达为：RT=aRT：反应所需时n：具有可能性的相似答案总当选择增加时，我们做决定的时间就会相应增加；产品在服务于用户时“时间就是关键”，所以我们要将做决定的选项减少到最少，以减少所需反应的时间，降低犯错的概也可以对选项进行同类分类和多层次分布，提高用户的使用效果席克定看到上面对席克定看到上面对于席克定律的说明，我们可以知道，用户的在某一场景下对选项的反应时间取决于三个因素：1、前期的认知和观察时2、根据认知后，处理的时3、选项的数那我们应该如何设计席克定1、分类选择提席克定1、分类选择提高用户效每日小米有席克定2、限制选席克定2、限制选择数量，减少用户时间席克定3、席克定3、分步解决，提升用户操作体席克定4、隐藏/席克定4、隐藏/删减很少使用项，降低错误点击席克定课程小运用席克定课程小运用席克定律，提升用户体验，需要注1、前期的认知和观察时2、根据认知后，处理的时3、选项的数所以我们再产品设计时可以使用如下几种方法：1、分类选2、限制选择数3、分步解4、隐藏/删减很少使用的选目u了解奥卡姆目u了解奥卡姆剃刀原理的内容；知道如何应用；u奥卡姆剃刀原3、奥卡奥卡姆剃刀原3、奥卡姆剃刀“如无必要，勿增实体”，即如有两个功能相等的设计，那么选择最简单的奥卡姆剃刀原理也被称为：“简单有效原理，它是由14世纪逻辑学家、圣方济各会修士奥卡姆威廉WilliamofOccam，约1285年至1349年）提这个原理告诫人们“不要浪费较多东西去做用较少东西也可以做好的事情lesismore少就是奥卡姆剃刀原只奥卡姆剃刀原只放必要的一个简洁的网站能让用户快速找到他们所找到的东西，如果你的网站充斥着很多无关紧要的东西；比如小弹窗，无用链接，用户会因为不能快速找到自己想要的东西而关闭网奥卡姆剃刀原减少不奥卡姆剃刀原减少不必要的最大片的内容区域给了各种新闻和广告，最重要的搜索框在顶部所占的位置却很小，干扰了用户的正常操作奥卡姆剃刀原减少多余弹框的奥卡姆剃刀原减少多余弹框的1.不要在用户第一次登录就立马出来：别人都没用你产品，你就要别人评价，是想怎么2.注意弹框的频率，别一会就弹一会就弹的，弹出鱼尾纹怎么3.专门定个入口，有些用户确实人品不错，他会在使用之后去给产品评所以留个这样的入口，层级可以深一点，让用户自己去操作，会更奥卡姆剃刀原小白规则奥卡姆剃刀原小白规则：降低用户的学习成老年人用儿童玩奥卡姆剃刀原课程小奥卡姆剃刀原课程小我们可以从以下四种方式运用奥卡姆剃刀原理，进行产品设计1、只放必要的东2、减少不必要段3、减少多余弹框设4、小白规目u了解泰斯勒目u了解泰斯勒定律的内容；知道如何应用；u泰思勒定4、泰泰思勒定4、