作者：周楷雯
出版社：人民邮电出版社
格式: AZW3, DOCX, EPUB, MOBI, PDF, TXT
Producter 让产品从0到1试读：
前言
从什么时候开始，设计变成了我生命的一部分？似乎开始于一个非常难以捕捉的时间；或许是我第一次打开Vimeo的时候；或许是第一次用镜头记录风景的时候；或许是我第一次想要用情书感动一个女孩的时候。
记忆的丢失让人分外伤怀，但是与产品一起度过的每一刻，我都满怀着对美好的期待与感恩。
独立完成一款产品是很多人的梦想，也是我的梦想。但是，只是完成一个产品并没有什么价值，真正完成一款优秀的产品的难度远超过“完成”这个词语的含义。
设计的锤炼、编程技艺的精进、营销的思考让很多人在起步阶段就放弃了。
从来没有一本书去讲如何完整地“完成”产品设计这件事情。我觉得应该有一本！于是，断断续续地，经历了一年的时间，我终于在23岁生日前写完了这本书。
完成一件事情着实考验人的耐心，这本书初稿完成之后又经历了相当大的修订，这种改进和迭代与产品开发极为相似。正如许多创作一样，想要下笔如神是非常困难的，甚至很多经验丰富的产品设计者的作品的第一稿也不见得就能够做得比新人好。真正使作品脱颖而出的，是后期对作品的反复打磨与改进。
在本书修订的过程中，我常常会跟朋友说“写书就像绣花一样”。尤其是，最近几年荒废了写作，竟然遇到了很多语法问题（可能是英语文档看多了的缘故）。
非常感谢周奕飞（@austinchou0126）和朱宏旭（@nixzhu）在本书初稿排版和语法方面所做的修正。
这本书只是一个开始，和产品一起成长，做出越来越优秀的东西才是最大的快乐。读者对象
本书主要涵盖了以下4个部分：
设计原理；
原型、动画效果、交互设计；
iOS开发；
营销。
书中以《小记》这一作品作为例子，完整地还原了一款产品从最初的想法到编码实现，再到上架，以及营销的全过程。
如果你什么都不懂，面对未来正充满困惑，那么这是一本很好的入门书籍；如果你只是略知一二，那么这本书也是很好的补全指引。
不过，由于产品的世界不存在“只要A必然发生B”的真理，所以请带着怀疑的眼光去审视本书中的每条结论，学会如何思考才能淡定地面对这个变幻莫测的世界。解疑
本书的电子书发布后会持续迭代更新，这也是电子书发行的好处。如果你对本书有任何意见或者建议，欢迎写电子邮件给我（kevinchou.c@gmail.com），或者直接关注我的微博@周楷雯Kevin（http://weibo.com/kevinzhow）与我交流。视频资料
Lolita作为首个视频资料，借助视频的优势，追加了设计和编程的实践部分，在读本书之前，读者可以先从视频看起。相关视频可以在腾讯视频上找到。示例
本书中的所有示例代码均可从GitHub（https://github.com/ProducterTips/producter-book-examples）获得。Producter相关
Producter Tips是由我和好友一起维护的一个分享设计、编程和产品的地方。你可以在那里发现一些实用的设计或者工程技巧。第一部分 开篇第1章 Product/产品：设计驱动开发关于设计的第一次
第一次总是很特殊的体验。对设计来说，第一次体验可能是尴尬的。有可能是在Photoshop里拖曳了几个难看的方框，也可能是在草稿纸上画了一堆歪扭得不成样子的曲线，反反复复，最后只能感叹一句——“算了吧，我果然没什么天赋！”
但是，设计并不是看起来那样坐在桌子前凭空臆想，然后动动鼠标就可以有所产出，也不是一项与在桌子前待多久有关系的活动。设计师往往要以年为单位，让自己沉浸在优秀的设计里，增强自己的设计嗅觉，掌握了大量的设计模式，才能够最终做出优秀的作品。
设计可以从模仿开始。
在我的记忆里，第一次做设计是在Ubuntu 7.04上用GIMP制作壁纸——模仿Mac的霞光壁纸，那是2007年的事。完成后自己非常开心，因为我的桌面第一次铺上了自己做的壁纸，而且我没有用PS这种“恶俗”的软件，没有在Windows和OS X这种“邪恶”轴心系统上，我内心洋溢着一种类似于“人类解放”的革命情怀。为什么先做设计
很多人以为我是从编程开始的，其实设计在我的故事里是先于编程发生的事情。
不过，我真的尝试过先开始编程。大概是在2004年我小学六年级的时候，由于“初生牛犊不怕虎”，我进书店买了本C#的书，就准备回家编程了。但估计是“智商”的问题，我完全看不懂那些术语。大概就在第1章，只不过10页就开始讲命名空间（namespace）。我当时就蒙了，被这个陌生的名词搞得头脑发热，完全死机了！什么是命名空间，完全不能从字面上理解它的意思。我因此觉得自己很傻，怎么刚翻开这几页就看不懂了？最后感叹道：“天才如我，竟然看不懂编程书！编程真是高深！”
当时家里没有网络，处于一个完全单机的环境，完全靠《少年电脑世界》《中学生电脑》《电脑报》《电脑爱好者》这些杂志来积累计算机方面的知识。在我家乡的小县城，周围没有一个人从事这个行业，所以我以为每个学编程的人都是直接看这种书并且一次就能看明白且学会的，因此我遭受了巨大的挫败感。
那本书的前几十页差不多被我翻烂了，用红色水笔反复标注了我对每行代码的理解，但最后我还是没有弄懂，只能放弃了。
因此，在尝到了设计壁纸的甜头之后，我开始尝试做更多的设计，并且买了原研哉的《设计中的设计》。这本书中的“重视留白且简约的设计”对我的影响很深。设计是什么
设计是一种和谐的感觉——因恰如其分而结合在一起的东西，功能与外观之间达成完美妥协。
我想设计必然是有个人风格的，这种风格会成为产品的灵魂，最终交付到用户手中，让他们去感知。但是，如何让这种个人风格和产品的功能相得益彰，是每位设计师在开始设计之前要最先思考的问题。
我非常喜欢“设计驱动开发”。先设计，后开发，然后回过头来，改进设计，精进程序。在这个过程中，自己和自己能快速地交流，快速地反馈，这种方式可以很好地激励自己，并且让自己很好地把握进度。但这样做也最容易产生自我妥协。人会犯懒，这是没办法的，因此需要不断激励才能把某些事情做得完美。
在开源社区有两个著名的设计驱动开发的例子，一个是Elementary OS，另外一个是GNOME。它们是出了名的“三年前画好图，三年后只能实现画图的一半”。设计创造了什么
设计创造了体验，体验包括了很多方面：
界面，看起来怎么样；
交互，如何和产品提供的服务进行交互；
品牌，构建起了什么样子的文化和品牌认同；
心智，改变了用户对事务的认知。
界面和交互像一款产品的阳面，每个人都看得到，而品牌和心智则像产品的阴面，你看不到但感觉得到。因此，设计绝不是停留在最表面的看起来怎么样，每年都会流行起一些软件产品，也会有很多人去模仿这些成功的产品，但一款产品的成功，除了界面和交互，还有很多深层次的东西，产品只有完成了品牌和心智认知的构建之后，才算是建成了一款产品的护城河。
设计所造就的体验，才是一款产品最为核心的属性。实践
不论方法是什么，实践才是能真正积累经验的活动，有经验值才能学会做产品。但是，实践同时也可能意味着另外一件事情——失败。
人总会逐渐避开不愉快的体验，对失败犹甚。无论是学习的失败、交友的失败，还是和女孩子交往的失败，都可能以一句“我果然还是不适合”为逃避这件事情的理由。
在你一个人独立完成一款作品的过程中，也会经历很多失败——第一次设计的丑陋、代码的漏洞百出、放出不成熟的产品导致的恶评等，这些都会让你受到沉重的打击。但是，从失败中反思得到的经验才是真正宝贵的财富。更何况，失败经历多了，总会成功的。“毕竟对于生活本身来说，成功和失败并没有什么本质区别，重要的是参与到这个游戏中来。”——约瑟夫·休格曼第二部分 Product Design/产品的设计第2章 设计的感觉从感觉开始
学习新东西的方法有很多，一直以来我们被教育的方式都是：从基础开始，积微成著，最终搭建起自己的知识体系。
这种方式最明显的好处是可以夯实自身基础，但弊端却是毁灭性的——枯燥乏味的过程及大脑中的知识无处可用的沮丧，时刻伴随着学习的每一天，最终会让我们失去兴趣，选择放弃。对于设计而言，尤其如此。
每一条设计准则都源于对人心理的研究。想要从事设计，就要懂得人们如何感知、学习、推理和记忆。但是，为什么我们要花费四五年的时间，从配色、结构、心理学入手呢？
谢天谢地，在计算机的世界里，我们完全可以反过来，抛开理论，先看一看有趣的设计是什么样子的，然后再讨论一下这些设计都遵循了什么样的设计理念，再利用这些感觉去尝试做自己的设计。毕竟，在一切开始之前，保护好转瞬即逝的兴趣才是最重要的。
但是，别高兴得太早！
不要忽略对基础理论的学习。当你的设计完成时，你会找出很多设计的缺点，并发现自己知识的短板。这时候再回去看那些枯燥无味的理论书，你就能体会到如沐甘霖的快感。
在开始学习之前，和你分享一句被许多有为人士说过的话：[1]如果想要取悦所有人，那么你不会取悦任何人。
设计师的工作和艺术家有很多不同，注定不能像艺术家那样特立独行。设计并不是把个人品味强加于产品之中。伴随着对设计的理解的不断深入，“设计为谁而做”这个问题会成为每个设计开始时设计师要思考的第一个问题。清晰
清晰（clarity）这种感觉，是利用人眼对边界信息感知差的特点，将次级消息放在了边缘。将这种感觉用于对现实场景的信息化中，就能在很大程度上减少信息和背景之间的相互干扰。
要达到这种效果，需要对信息放置的位置、背景色彩的过渡及现实场景有一个妥善的处理。
从iOS 7开始，苹果公司正式把这种感觉引入了系统设计：
简化（simplify）；
内容为主（maximize content）；
纵深（depth）。iOS中的天气App
iOS 7中的天气App是对这种感觉的最好阐释，如图2-1所示。雪天的背景占据了整个屏幕，没有了以往常见的界面边界，视界变得极为开阔。图2-1
去除了边界，内容得以占据更多的空间，因此足以让用户聚焦于内容本身而不是界面。但是，此时并不是真的没有了边界，从视觉的角度来讲，此时的天气App，中间的大字号气温就成了中心，其他区域都是边界。
人眼的边界视力比中心差得多，用户能轻易地分辨29，但第一眼却很难注意到下面的气温都是些什么。在这种情况下，把次级消息放在边界就成了更好的选择。《纸牌屋》
在《纸牌屋》这部电视剧里，片头的设计也很有这种清晰的感觉，如图2-2所示。文字在屏幕的位置清晰自然，浑然一体。图2-2谷歌眼镜
谷歌眼镜（Google Glass）在文字下方加了个半透明的灰色背景，来让人很好地聚焦边界信息，如图2-3所示。图2-3《钢铁侠》
除了像Google Glass那种半透明的处理方法，如果信息块不高、区域统一，也可以用透明渐变来做这种底衬，如图2-4所示。这种处理可以从钢铁侠的图片中感受到。图2-4小结
简化界面元素的设计语言。
利用人眼的视力差别进行布局。
采用半透明或渐变增强可读性。整洁
整洁（clean）延续了简化、内容为主的设计理念，是建立在合理性之上的美学协调。整洁作为一种极简主义，更能让高端用户喜欢。少即是多。（Less is more.）——Ludwig Mies van der Rohe留白
一次偶然的机会，我在Instagram上关注了一个非常善于采用过曝（overexpose）做到整洁的感觉的女神——hx1125。
我非常喜欢她那些在白色背景上只摆着一两件东西的感觉（如图2-5至图2-8所示），这种满足感和多年前翻开原研哉先生的《设计中的设计》时极为相似。
这种设计如此慷慨地把画面让给了需要我们去注意的信息上。我想整洁这种设计感觉的灵魂也正是如此——少即是多。图2-5图2-6图2-7图2-8
在我刚开始学习做设计的时候，潜意识总会驱使我去填满整个画面，那种感觉就是“没塞满就是没设计过”。后来，随着做的设计越来越多，我开始更多地关注画面的比例、协调性，不再去想如何塞满整个画面，而开始去想怎么让画面再少一些元素，最好是选择一款合适的字体、一个合适的字号、一种合适的颜色，只有文字，那真是太美了。
大概在一年前，我设计过一个从未拿来用的名片，如图2-9所示。没使用的原因是，这个设计需要非常有质感的纸和非常精巧的印痕才能体现它的美感，但是我不知道到哪里去找这样的纸和工艺才能做到这种效果，只好一直将其封存在我的Dropbox里。没有手机号，没有二维码，没有地址，只有Twitter和Email。没办法，我觉得这样最纯粹，这可能和我没有消失殆尽的不群之心有关。图2-9
后来我尝试了一种竖版的名片设计（如图2-10所示），衬线字体的优雅和稳重似乎始终是我在文字排版中的挚爱。图2-10整洁的App设计
爱范儿（ifanr）有一款非常整洁的App——数读，如图2-11所示。我对这款App一见钟情。后来，在我的一款App CoinsMan中，我也运用了这种设计方式，如图2-12所示。图2-11图2-12
这两款App都采用了强信息驱动的设计方式，数读中最重要的就是那个点睛的数字，在CoinsMan中最重要的就是当前的价格。把它们用最大字号放在中间无疑是最好的选择，其他一切信息都不要来抢这个关键信息的聚焦区间。
数读的中央数字下面的点睛文字用了远小于主体的字号，而CoinsMan在最高和最低这两个价格上，也是用了小字号，而我觉得还不够，我还降低了它们的不透明度，最后选定在60%左右。元素的主次关系
在数读中，下面有一段灰色的文字，是全文的开头，点击这里并往上滑动可以看到全文信息，全文的文字颜色也会增强为黑色。在CoinsMan中，下面的5分钟交易量柱形图也是明显暗于价格波动5分线的，而所有元素都小于屏幕中间的数字。
这就是元素的主次关系，也是设计中非常重要的一点——永远不要让不同级的东西看起来一样。如果发生了这种永远不该出现的情况，那么这个界面看起来就是一场灾难。小结
留白来帮助聚焦最重要的信息。
关键色的谨慎选择。
拥有唯一的主体。酷
酷（cool）似乎是找不到“形容词”的时候的唯一选择。酷并不是简单地好看、有趣，而是一种准确的视觉体验。对于App自身而言，酷代表一种生命力，而纵深这种理念也始终贯穿着。《Ingress》《Ingress》是Google公司在2012年上线的一款LBS多人游戏。当时我被这款游戏的玩法深深感动了，一向视“宅”如命的我都不顾夏日的炎热跑出去玩这个游戏。《Ingress》这种虚拟现实的感觉会让人一下子被迷住，地图已经不是我们导航概念里那种呆板的形象，而是变成了一种要去拯救世界的场景，如图2-13所示。这种风格超出了你对任何一款LBS游戏的预期。地图中无处不在的粒子特效、光晕、极强的明暗对比，让其产生了杀马特般的冲击力。
即使不想出门，也会想去探索一下这款超酷的游戏软件，这就是“酷”激发了用户的好奇心。图2-13《Smash Hit》
前段时间App Store推荐的这款《Smash Hit》真算是“酷”的最佳实践了，如图2-14所示。它通过以下3点为你打造了一个可以释放压力的空间：
缥缈的虚拟感；
神秘朦胧的场景；
精致的物理特效。图2-14
虚拟空间更容易让用户产生代入感，按照你的设定，寻着你的逻辑，变成一个“中二病”。《纪念碑谷》
场景互动一直是游戏的命根，从早先《仙剑奇侠传》中的迷宫、《轩辕剑》中的机关术、《塞尔达传说》里人物与场景的物理互动，再到现在的场景破坏，场景的真实反馈给了用户无限的刺激，如图2-15所示。图2-15《纪念碑谷》中各个关卡的设定都非常有趣，总是用让你想象不到的方式将你带入下一个场景，巧妙地利用视差、矛盾空间去构建新的路径，达到了场景互动的极致。《Clear》
将酷的特质应用到软件中，彰显“酷”这一设计感觉的典型App是《Clear》，如图2-16所示。适当地加入“酷”这一元素构成，必然让App富有生机。图2-16小结
在前面3款游戏中，“酷”体现出了以下特质：
强烈的视觉风格；
新奇的氛围体验；
生动的交互反馈。“酷”的特质如果应用到Clear这款软件中，那么就是：
新奇的交互效果；
让人惊喜的视觉反馈；
强烈的设计风格。寻找灵感
对设计来说，与学习基本理论相比，积累大量的素材和设计思路更为重要。“当你手里有个锤子的时候，你看什么都是钉子。”这句话说的正是方法单一的后果。学习了大量的设计语言并掌握了元素的组合方式之后，你手里就不再只有一把“锤子”。
融合生活中对于美好设计的体验，属于你自己的优秀设计便会自然诞生。
接下来，一起来看看获得设计灵感的好地方。Dribbble
Dribbble是在设计师中非常流行的一个分享设计的社区，每次打开这个社区网站都会有许多让人惊叹的设计，如图2-17所示。不过，惊叹之余，你也可以对这些设计进行更深入的思考——当这些设计应用到真实环境中时，是否真的能增强体验。图2-17Behance
Behance社区更为专业。这个社区的作品完成度都相当高，覆盖的范围也相当广泛，如图2-18所示。该社区2012年年底已经被Adobe公司收购。图2-18Siiimple
Siiimple是一个专门收集极简主义网站设计的网站，筛选的作品都很独特并且具有启发性，如图2-19所示。图2-19Reeoo
Reeoo也是一个专门收集优秀网页设计网站，提供了详细的分类目录，从App、艺术、动画到摄影、体育一应俱全，还可以根据颜色的主题筛选，非常好用，如图2-20所示。图2-20Land Book
LandBook专门收集优秀的登录页面（landing page），品类齐全，值得时不时地去看一看，如图2-21所示。图2-21Call to idea
Call to idea是一个以类别为线索收集各种设计的网站，它专业、精美，是激发灵感的好地方，如图2-22所示。图2-22
把同类别的优秀设计通览一遍，你就能发现很多共通之处。图2-23Designer News
Designer News是全世界最热闹的设计师资讯社区，新的设计想法、新的产品都会在这里讨论，如图2-24所示。图2-24大脑的后台运作
创造性的活动并不是单纯地将时间耗在上面就可以做出优秀的成果。大脑的运算不同于电脑，潜意识的部分是无法控制的，但它的速度却远远超乎你的想象。
在大量收集、学习了多样的设计之后，不妨离开书桌，出去跑跑步或游个泳，完全忘记工作的事情。这时候你的潜意识会在后台归纳组织你的素材，这些素材可能来自你半生的积累，数百万条记录在飞快地组织着，彻底放松回来后，最终的结果可能就是——“我是怎么想到这个点子的，我真是个天才。”
[1] If you want to please everybody, you please nobody.第3章 基础界面
结束了设计感觉的培养，我们现在开始了解一些基本的用户界面（UI）及其交互方式。标签栏
标签栏（TabBar）是iOS上最经典的基础界面，导航结构都进行了扁平化处理，用户可以在主界面底部通过不同的功能标签（tab）来高效地选择自己需要的功能。标签栏的经典模式
微信、Telegram以及iOS自带的音乐App都采用了这种方式，通过多个标签在底部对功能进行了分割，使用不同的图标（icon）表示不同的功能，为了提高可读性，在图标下面用文字标注了这个图标的含义，如图3-1所示。图3-1自定义标签栏
很多App都采用了自定义标签栏的样式来展现App，尽管是“新瓶装旧酒”，也还是有很多App把这种形式做出了新意。
Instagram和Flipboard都隐去了图标下的文字，通过不同风格给标签栏加上了自己的品牌烙印，而Artsy更是只留下文字，从另一个角度打上了品牌烙印，如图3-2所示。
试读结束[说明：试读内容隐藏了图片]