蚂蚁金服体验科技大会

07 2019 SEEconf 蚂蚁庄园背后的技术与思考 悠鹤 2019,1

1. 蚂蚁庄园背后的技术与思考 悠鹤
2. 默默地蒙上你的眼睛 看到你 悄悄地来到我心里 就像看到你的主人 饿了吧 终于来到我家里 我们一起慢慢吃 我的心就像奔跑时 吃个日出日息 我真想养好你 吃个情长如溪 不要蒙上你的眼睛 因为你的主人很年轻 不懂得照顾你 好好看看我的天地 足够让你飞翔,让你美丽 新浪微博⽤用户:佛头1
3. WebGL,想说爱你不不容易易 0.36 颗鸡蛋???对⼩小数点说 NO!!! 『⽀支付宝设计的神细节有哪些』之⼩小蜜蜂 ⽬目录 如何优雅地『搞鸡』 没有什什么能够阻挡,对调通接⼝口的向往 装扮与主题,开放与共赢 为了了性能,不不择⼿手段;⼩小问题,⼤大算法 In Tiny.js we trust, In R3 we trust ⼜又回到最初的起点,WebGL ⻘青涩的脸
4. WebGL,想说爱你不不容易易 1/9
5. 0.36 颗鸡蛋??? 对⼩小数点说 NO!!! 2/9
6. 0.36 颗鸡蛋???对⼩小数点说 NO!!! • ⼩小数部分容易易造成⽤用户困惑 • 数字增加⽤用户感知不不明显 • ⽤用户对于可收取感知不不明显 • 百分⽐比进度给⽤用户以期待感 • 进度条变化给⽤用户以感知 • 数字真正代表可收取的数量量 2/9
7. 『⽀支付宝设计的神细节有哪些』之⼩小蜜蜂 3/9
8. 『⽀支付宝设计的神细节有哪些』之⼩小蜜蜂 现实中,跳“8”字舞是蜜蜂的⼀一种交流⽅方式,它们会根 据太阳,蜂房,采蜜点三个地⽅方的定位,通过跳8字舞 告诉同伴采花蜜的⽅方向,并随着太阳⽅方向的变化调整 ⾃自⼰己舞蹈的⽅方向~ 3/9
9. 如何优雅地『搞鸡』 4/9
10. 如何优雅地『搞鸡』 分层设计 luna-image-kit 业务层 luna-time-kit luna-spm-log luna-share-kit luna-image-resize 控制 理理念 ๏⼯工程化 ๏配置化 游戏层 tinyjs-resource-loader tinyjs-plugin-tiling tinyjs-plugin-ninepatch 订阅 ๏组件化 ๏数据驱动 理理念 luna-mock AFBridge 数据层 驱动 redux-logger redux-watch redux-thunk reselect ๏防抖 ๏组合 细节 redux-batched-subscribe 4/9
11. 如何优雅地『搞鸡』 净 调试代码⽆无侵⼊入 巧 图⽚片⾃自动合成 微 打磨动画细节 ⼯工程思维 ⼯工匠精神 效 游戏渲染调试 极 纯⼿手⼯工切图 4/9
12. 没有什什么能够阻挡 对调通接⼝口的向往 5/9
13. 没有什什么能够阻挡,对调通接⼝口的向往 😂 临时应对 权宜之计 没有视觉 技术先⾏行行 😎 5/9
14. 装扮与主题,开放与共赢 6/9
15. 装扮与主题,开放与共赢 节⽇日主题
16. 装扮与主题,开放与共赢 ⾼高级装扮 6/9
17. 装扮与主题,开放与共赢 FreeStyle 装扮制作平台 6/9
18. 装扮与主题,开放与共赢 Armature ⻣骨架 Bone ⻣骨骼 Slot 插槽 Image 图⽚片 6/9
19. 装扮与主题,开放与共赢 资源系统 antfarm-resource JS ⽂文件 装扮资源 资源⼊入⼝口 装扮配置 动态换装 ⼤大量量图⽚片⽂文件 主题挂载 主题资源 兜底机制 ⾃自研 ⼯工具 tinyjs-resource-loader ๏优化图⽚片数量量、体积、尺⼨寸 image-process-loader ๏解决图⽚片云构建系统依赖问题 业务资源离线包 按需加载 资源加速 themeName 资源复⽤用 ⼯工程化 构建 蜻蜓组件 服务端 DRM resourceVersion 6/9
20. 为了了性能,不不择⼿手段 ⼩小问题,⼤大算法 7/9
21. 为了了性能,不不择⼿手段;⼩小问题,⼤大算法 max-rects-algorithm -32.7% 398*310 232*358 5229B 4981B 7/9
22. In Tiny.js we trust In R3 we trust 8/9
23. In Tiny.js we trust, In R3 we trust 蚂蚁庄园和它的⼩小游戏们 8/9
24. ⼜又回到最初的起点 WebGL ⻘青涩的脸 9/9
25. THANKS

相关幻灯片