产品设计10步走,设计Perfect产品首页.pdfVIP

产品设计10步走 ，设计Perf ect 的产品首页 无论是PC端还是移动端都会有首页 ，但是后台往往是不不需要的首页的。为什么 因为前端面对的 是不了解你的用户 ，所以需要首页把你最想告诉的用户的东西给展示出来。而后台不同 ，使用的人 本身就是对你的平台了解。即使是第三方服务的后台 ，也是信任你才使用的平台。所以前端偏重展 示和简洁为主 ，后台偏重逻辑和使用度。当你负责一个产品线的时候 ，做前端页面更注重的是UI设 计的排版和布局 ，前端工程师切图和炫酷的效果 ；而后台页面更注重后台工程师的逻辑、数据调用 。 而web端页面展示复杂 ，我们以用户体验五要素 （战略层、范围层、结构层、框架层、表现层 ）和 简约至上四策略 （删除、组织、影藏、转移 ）作为产品设计指导思想。设计的web首页的时候 ，我 们要展示简洁大方也要思考周密 ，但有时候真的会有遗漏怎么办 那我们可以从以下十步去完成 设计 ，不会有遗漏。 一、产品整体布局 整体布局显示从我们的业务出发 ： 首先思考我们的用户是谁 进入首页 ，首屏展示一定是要告诉用户我们是干什么的 那些首页分 类的导航起到就是告诉用户我们是干什么的。 然后从第二屏开始 ，告诉用户为什么要选择我们 然后告诉用户我们是怎么解决这些问题的。 从用户角度出发 ： 首次进入首页看见的所有产品和服务的大类目。这些是我需要的吗 然后开始浏览首页下滑 ，找到买这个服务和商品信任的理由和价格是不是优惠。 整体布局思考从W HO ，W HAT ，W HY ，HOW的层面进行分解 ，简单说就是3W 1H法则。 二、用户需求确认 特别电商和O2O产品在web端首页的商品分类很重要 ；在web端首页展示产品分类够不够直达用户 心理很重要 ；好的产品分类可以让用户导流。所以设计产品分类时 ，一定是按合理的用户认知进行 排列。这里分类就牵涉到用户需求。 我们在确认了用户画像后 ，建立了用户用例。这个时候用户需求已经确认 ；比如用户用例把用户整 体购买流程和顺序完全模拟出来。 怎么确认这些需求 1. 流量品的需求路径。 2. 流量品的路径周边盈利品类目展示。 3. 盈利品的需求路径。 确认这些后 ，不仅业务也是从用户需求出发了 ；相近的需求安排 ，可以不按常规安排也是了解用户 需求很重要的。 从点击分类 ，进入列表页 ，再进入商品详情页 ，再点击购买。这一套需求路径需要站在用户角度 ， 我们往往太局限于业务角度。 三、竞品设计分析 竞品分析有时候在我们看来可能是抄袭 ；但是借用乔布斯话说 ，这就是借鉴了。但是竞品分析依旧 重要 ，我们必须时刻关注对手的动向。 在页面布局时 ，其实你会发现产品思考点越来越重合 ，因为业务重合性的关系。设计层面却是不 同的 ，是基于自身业务展示的。 这里需要思考的是 ，对手上的这个块页面需求点是哪块 对手又上了哪些业务 他的下一阶段产品 目标是什么 然后再思考我们是不是可以上这个页面 最后 ，在产品设计可以采取不一样的展示风格 ，不一样的展示风格基于用户层面去思考。哪怕小小 的设计展示不同 ，也是打动用户的关键。 比如 ： web端你鼠标下滑动时 ，你的顶部工具栏是吸顶式导航 ，就能很好吸引用户注册你网站。 如果在阅读网页时 ，你加入了小小返回首页功能 ，用户就更能进入沉浸式阅读。 在移动端设计时 ，哪怕你返回有一个向右滑动手势比没有好很多 ，技术上只是多了十几行代码。 四、功能模块确认 从3W 1H和竞品分析确认后 ，我们功能模式其实大致都可以确认 ：首屏的全部分类展示和banner图 展示 ；顶部的吸顶式工具栏 ；第二屏展示热门服务 ，热门服务的吸引点在于告诉我们产品的优势 ； 展示运营活动和信任的用户展示。后面是SEO页面和常用页面底部。每个功能模块确认都是从产品 设计和业务逻辑进行支撑 ，最后通过QA 的测试用例进行模拟测试。 功能模块确认需求注意的是 ： 1. 展示的功能是否直观。 2. 展示的功能是不是表达清楚 ，用户了解。 3. 展示的功能是不是容易操作理解。 4 . 展示的功能上下衔接是不是合理。 五、布局排版简洁 web端布局排版越来越简洁了 ，从90年代那种弹窗漫天飞 ，到00年代页面布局小而杂乱。现在web 端页面展示也继承了移动端一样的特性 ，简洁大方。 web端页面设计也经历了3个时代变更。在排版合理基础上 ，简洁并不是意味着简单。我们要避免简 洁并不仅是简单的误区 ，而是要用简单的语句和图片解释清楚我们是干什么的。 页面整体呈现出统一性。上下视觉保持一致性 ，不要使得页面分散用户的注意力 ；每个往下滑