我的前端组长经常会和我讨论各种后台页面流程或者布局如何优化的问题，常常引发我许多思考，很多我们习以为常的常规化的页面还是有很多可优化的点，如果你默认了普遍就是这个样子的，那你也没有办法进步了。哪怕不能实现，但是思考的过程也是拓宽思路的过程，不应该止步不前。
今天来说几个我在工作中设计和日常积累的一些可以称之为所见即所得的页面设计，这种思路可以拓展到日常的其他模块设计里去，让设计更具价值，更直观，也让用户更喜欢你的设计。
拟物设计
拟物设计是最经典的所见即所得的案例。最早的苹果手机在iPhone 没有实体键而整体是屏幕的设计，在当时仿佛是外星科技降临一般令人惊艳。为了让大众习惯直接在手机上点图标（在此之前人机互动都是间接输入的：比如实体键盘、鼠标、触控笔等），乔老爷子发布了革命性的操作系统iOS，手机的所有图标都是圆角，这样可以避免用户认为会刺到手指。所有图标和界面全部是拟物设计，这样可以更好地让用户理解哪些是可以点击，对应的功能是什么，几乎不需要教育用户的时间。这一种拟物设计是最早的所见即所得的设计理念，也是划时代的强调用户界面和交互设计重要性的设计。
现在用户对各种互联网产品的适应度越来越高，设计的扁平化，2.5D等新的层出不穷的风格也很容易被大众接受，但是交互的好用易用性始终还是摆在设计的第一位，所见即所得是用户理解壁垒最低的设计。
公众号的展示设计
网页的操作确认页面，下面是微信公众号的群发提交弹窗，以图表的形式告诉你，文章的标题，你的原创声明是否开启，赞赏是否开启。
还有公众号针对移动端的展示页面设计，直接和移动端页面一毛一样，左侧手机展示页完全和用户使用的页面一致，点到哪里修改哪里，点击对应内容是图文还是图片还是音视频，一览无余。
后台展示模版设计选择也是一样。包括微信表情开放平台上传表情包的逐页操作也是一样，虽然是几年前的设计，但是这种设计理念是非常值得借鉴的。
在我之前经手的一个网页模版也有类似的设计，需要做客户的短信发送模版，最早在我拿到原型的时候只有如下的内容。我刚看到的时候非常懵，不知道我填写之后具体是什么作用，效果是如何的。
和小伙伴讨论之后确定这个是和之前的商家创建及短信发送页面相关联所以我设计了一个，上面是展示版面，下面是填写版面的页面设计，且展示区域根据底部填写内容实时变化，还有短信模版模拟了手机短信的收信框，根据修改实时变化，更直观也更易于使用的人理解。当然这是当时做的也局限于我自己的思路限制，现在我觉得这个版面还可以更优，例如短信模版部分直接做成手机页面的展示，短信也是首页真实页面的展示样式也是不错的。
商品属性展示设计
还有一个移动端的案例。
小姐姐们都有很多买口红的经历，口红的色号总是有很多很多，如果在购物的时候只是单纯的选择颜色或者在属性选择页面选择模特展示图上的口红颜色，有时候并不能很好的让消费者知道这颜色是什么样的，可能还会导致用户选择之后颜色偏差很大带来的退货换货或者选择线下试色等，不能快速帮助消费者决策，推进消费进程。
有一个的很好的设计案例，设计者通过自己在线下真实的购物场景，了解客户的购物习惯，设计出这种文件夹式的设计可以解决口红色卡的展示问题，点击对应色卡弹出展示，让用户对口红颜色的感知更加强烈。这也是一个设计创新，并且他们还申请了设计创新的专利。
图片来源：支付宝设计专家SKY的设计专利
还有一个例子是关于产品展示的。该作者将自己在线下店，观察到的客户购物习惯，运用到了设计项目中，比如说大部分人买东西前，都喜欢把商品，放在手上转动，方便各个角度去观察，结合这个用户习惯，运用到了设计里。设计出这种可以360度旋转把玩产品的产品展示方式，更贴合线下场景及用户习惯。
图片来源：支付宝设计专家SKY的设计专利
像手机或者网页，线上的承载内容的一个平台，其实在设计和开发的时候，更愿意让用户能产生一种自然而然就是这样做的感觉。所见既所得，其实就是这种引导最最直观的一种方式，所谓的引导用户，只不过是想让用户线上跟线下的体验更加一致而已
