1. 站在设计的角度做开发
王磊（伯约）
ioldfish

2. topic 1
设计 ≠ 交互设计

3. topic 2
设计 ＝

4. Topic 1:架构设计的思考
信息架构

5. Topic 1:架构设计的思考

6. Topic 1:架构设计的思考
accountModule
bankCardModule
creditCardModule
cashCardModule
debitCardModule
ktModule

7. Topic 1:架构设计的思考

8. Topic 1:架构设计的思考
bankCardModule
creditCardModule
accountModule cashCardModule
debitCardModule
ktModule

9. Topic 1:架构设计的思考
前端架构

10. Topic 1:架构设计的思考
框架、设计模式、部署、规范...
《随感协作开发的JS设计模式》
h"p://www.ioldfish.cn/?p=314
《再议构建UI组件设计新思路》
h"p://www.ioldfish.cn/?p=334

11. Topic 1:架构设计的思考
选择 确认 结果
高耦合

12. Topic 1:架构设计的思考
选择 渠道确认1 结果
渠道确认2
渠道确认3
渠道确认4
一定的冗余

13. Topic 1:架构设计的思考
系统架构

14. Topic 1:架构设计的思考

15. Topic 1:架构设计的思考

16. Topic 1:架构设计的思考

17. Topic 1:架构设计的思考

18. Topic 1:架构设计的思考
综合案例

19. Topic 1:架构设计的思考

20. Topic 1:架构设计的思考

21. （体验）交互设计：
A页面
B页面 完成付款
默认选中余额功能

22. （服务端）系统设计：
cashier cashier
1 1
payCore

23. （前端）业务组件接口设计：
AP.widget.accountModule
={
init:funcEon(){
//实现业务初始化，此处省略业务代码N行
},
bindEvent:funcEon(){
//...
}
}

24. topic 3
凭什么听你的？

25. 先娱乐一下

26. 熊掉陷阱 陷阱深19.617米
下落时间正好2秒
求熊的颜色和种类?
A：白色，北极熊
B：棕色，棕熊
C：黑色，黑熊
D：黑棕色，马来熊
E：灰色，灰熊

27. g=9.832
g=9.8085
北纬44
g=9.780

29. 最受伤的是
我

30. topic 4
让数据说话

31. click1

32. click2

33. click3

34. click4

35. click5

36. click6

37. 近80％的用户存在这种操作轨迹
《用户行为分析解决方案－tracker&session》
h"p://www.ioldfish.cn/?p=363

38. 问题在哪里？

39. 支付体验不爽
不必
务 组件 计
端业 接口设
前 的
要
系统不必要的性能开销

40. （体验）交互设计：
去掉选中余额功能
A页面
B页面
默认选中余额功能

41. （服务端）系统设计：
cashier cashier
2 2
1 1
payCore

42. （前端）业务组件接口设计：
AP.widget.accountModule
={
init:funcEon(){
//实现业务初始化，此处省略业务代码N行 精简接口
},
bindEvent:funcEon(){
//...
}
}

43. 结束 Q&A