【Book 50】《Producter | 让产品从0到1》（1
书名：Producter | 让产品从0到1
作者：周楷雯
出版：中国工信出版集团 & 人民邮电出版社
- 第一部分 开篇
- 第二部分 产品的设计
- 设计的感觉
- 基础界面
- 设计工具
- 产品的起点
- 第三部分 产品的实现
- 第四部分 产品的迭代
- 第五部分 产品的营销
- 第六部分 产品的进阶
第一部分 开篇
核心观点：设计驱动开发
作者作为一个独立开发者，从设计到编程，也包括最后的营销，都是自己一人完成。其起点，是从设计开始的，因而作者倡导的，是用设计驱动开发。
在此部分，作者主要阐述三点：
- 设计是一种和谐的感觉——因恰如其分而结合在一起的东西，功能与外观之间达成完美妥协。
- 设计创造了体验，体验包括：界面，看起来怎么样；交互，如何和产品提供的服务进行交互；品牌，构建起了什么样子的文化和品牌认同；心智，改变了用户对事务的认知。
- 实践：“毕竟对于生活本身来说，成功和失败并没有什么本质区别，重要的是参与到这个游戏中来。”（约瑟夫·休格曼）
第二部分 产品的设计
设计的感觉：阐述作者自己对于设计的一套理念
基础界面：了解现有的基础交互方式
设计工具：作者推荐的两个工具的使用
产品的起点：作者自己的 App《小记》的诞生
1. 设计的感觉：清晰、整洁、酷、寻找灵感
清晰：利用人眼对边界信息感知差的特点，将次级消息放在边缘。减少信息与背景的相互干扰。
e.g.：
- iOS 中的天气 App：当前温度最重要，醒目
- 《纸牌屋》的片头设计：文本的位置
- 谷歌眼镜：半透明的灰色北京，让人们聚焦不在眼球正中间的边界信息
- 《钢铁侠》的制服内视觉界面：利用透明渐变做衬底
小结：
- 简化界面元素的设计语言
- 利用人眼的视力差别进行布局
- 采用半透明或渐变增强可读性
整洁：延续简化、内容为主的设计理念。Less is more。
e.g. :
- 留白：过曝的照片们（ins：hx1125）
- 整洁的 App 设计：数读（已被下架）
- 元素的主次关系：永远不要让不同级的东西看起来一样
小结：
- 留白来帮助聚焦最重要的信息
- 关键色的谨慎选择
- 拥有唯一的主体
酷：代表生命力，代表纵深
e.g.：
- 《Ingress》
- 《Smash Hit》
- 《纪念碑谷》
- 《Clear》
小结：
- 强烈的视觉风格/交互效果
- 新奇的氛围体验
- 生动的交互反馈
寻找灵感
- Dribbble 设计分享
- Behance 更专业，作品完成度更高
- Siiimple 极简主义收集
- Reeoo 网页设计，按颜色筛选
- Land Book 优秀登录页面收集
- Call to idea 以模块进行筛选
- Designer News 设计师社区
- 大脑的后台运行（暗时间）
2. 基础界面：标签栏、侧滑菜单、滑块、瀑布流
标签栏：底部、导航
- 经典模式：iOS 的自带 App 、微信、Telegram
- 自定义标签栏：Instagram、Flipboard、Artsy
侧滑菜单：抽屉式菜单、注意避免滥用
- VONU：图片处理 App，用侧滑菜单对低频功能进行收集，更好的凸显高频功能
- Kuvva：壁纸 App，凸显每周推荐
- Thunder Space：核心功能明确
滑块：轮播设计、强筛选性
- KickStarter：众筹平台，项目展示
- Tinder：交友，like or nope
瀑布流：单列瀑布流适合文字信息为主的展示，图片为主的可以尝试多列瀑布流
- 单列瀑布流：Twitter、知乎日报、TeeVee
- 多列瀑布流：Pintrest、Flipboard、Dribbble
3. 设计工具：Photoshop、Sketch、Framer
Photoshop：
- 专业的颜色管理
- 丰富的配色方案
- 强大的处理能力
Sketch：不面向印刷时的最佳选择
- 多分辨率支持
- 多格式支持
- 在移动端实时预览
- 原生的效果支持，如 iOS 的 Blur
- UI 模板
- 元素符号，可以方便地复用元素
- 苹果公司官网的素材支持
Framer：交互原型设计，可编程
- 原型自动转换为 HTML 页面
- 设备上随时改动，同步预览
- 分发给远程人员，在任意设备查看
- 真实交互
- CoffeeScript 易上手
Sketch 基础：Artboard、模板、元素编辑、Mask、Symbol、对齐、Blur
实践：绘制 Wunderlist 图标
Framer 基础：
CoffeeScript 基础
4. 产品的起点：《小记》《Hydro》
《小记》是怎样的产品：文艺产品
哪些元素让它文艺：字体（康熙字典体+文悦古仿宋）、朱红色（作为唯一关键色）、数字三（永远只显示三篇）、留白（留白是界面的阴面设计）、直书（传统）
做《小记》的理由：给自己的方寸之地
产品气质：复古、独立、单纯、禅
设计《小记》：以时间为交互线索，纵书为展现形式
参考：日本直书设计、W3C 关于纵书的规范
字体：宋体与产品气质的吻合
对齐：在室内设计中，尤其是极简主义设计中，往往会在场景中布置一个物体来吸引观察者的眼球，以产生联想。
色彩：固定使用的红色
版式：纵书：每列之间的距离大概是字体的大小
设计中的基本法则：
- 不要仅仅是为了不同而设计
- 通过点睛的元素赋予设计灵魂
- 色彩选择上的谨慎
- 注意元素之间的对齐逻辑
- 元素边距之间的逻辑，针对人机交互进行优化
- 元素之间的和谐
- 参考专业的资料
- 寻求不同人士的意见
交互设计：
人脑的工作模式：面对新事物，是无意识、自动思维的大脑
交互的思考：
- 心理感知
- 用户时间
- 产品定位
- 功能数量
交互的动画：设计动画，时间成本是最大的问题
《小记》的交互设计：单击进入，双击返回，返回时用放大、渐变的动画
这是一个有学习成本的交互设计，但是它可以很好的保护这个 App 带来的时空感。
《Hydro》的交互与体验设计
需求来源：2014 年，不能在 Widget 中方便的开关 VPN
界面设计思路：VPN 最根本的体验是快速翻越，因而没有做任何页面切换的部分，将所有交互叠在一个地图中
邀请：当用户具备邀请资格，上滑主界面进入邀请界面，此时背后地图放大，产生纵深感
机制的设计：只做移动端，实行邀请制，一切都是为了保证服务器的稳定性——VPN 服务的最大问题所在
