Mickey 写了一篇 《一个本科毕业生创业两年的感悟》,从他的视角,总结了我们合作的两年经历。

我也来写一篇,介绍我的学习之路,希望对大家有所帮助,谢谢大家~

我的学习方法

1.直接从0开始做项目,边做边学习,在做的过程中不断思考和反思当前的设计和实现,不断地修正,不断地迭代。
2.做完一个项目后,沉淀和升华:
a)根据做项目中遇到的问题,针对性地看一些经典书籍和学习资料
b)写一些文章,分享自己的学习经历和技术心得

我的学习经历

我从开始学编程到现在,一直都在前端领域学习。先后经历了开发网站->开发2D游戏和引擎->开发前端富应用->开发3D引擎和编辑器。

第一年从0开始,做一个行业平台的网站

非常感谢老师对我的信任,让我能在第一个项目就负责开发一个比较大规模的完整网站~

整个项目历时8个月,前端、后端、数据库我都要开发。

通过该项目,我学习了测试驱动的思想(后端和逻辑层写了很多测试)、分层架构、MVC、重构、领域驱动的思想,学习了前端、后端、数据库的技术。

从0开始,做Html5小游戏

再次感谢老师的支持,让我能够自由地研究自己感兴趣的内容。

做完网站后,我先后开发了 贪吃蛇->连连看->炸弹人 这三个Html5游戏,中间又做了几个小网站。 其中,我完全使用测试驱动来开发炸弹人游戏。

详见:
发布我制作的jQuery贪吃蛇游戏
连连看
炸弹人游戏开发系列

通过做游戏,我学习并应用了面向对象的思想和设计模式,学习了2D游戏中的基本概念和领域模型。

从炸弹人游戏中提炼2D引擎

从做的游戏中,我看到了一些通用模式,促使我开始提炼游戏引擎。

详见:
提炼游戏引擎系列
发布HTML5 2D游戏引擎YEngine2D

开发一个相对复杂的2D游戏,作为我的毕业设计

在拿到工作Offer后,我就开始毕业设计:使用提炼的2D引擎,开发一个即时战略的2D游戏。我还开发了对应的编辑器,用来编辑地图和关卡。

详见:
发布HTML5 RTS游戏-古代战争

分享我在读书阶段收集的经典书

我在上学的时候,通过边做项目边学习,看了一些书。

此处分享我看了哪些书、看了几遍、有什么心得,详见:2011-2014年收集的经典书和心得

WebGL、3D引擎等方面可以参考:
分享收集的WebGL 3D学习资源
分享我收集的引擎、图形学、WebGL方面的电子资料

开发最后一个2D游戏

我用提炼的引擎写了个demo。

详见:
动作类游戏demo

开发钉钉

在工作上,我有幸加入了钉钉的前端开发团队,参与桌面版钉钉的开发。

我学习了Angular,开发了搜索、群组、快捷键等功能。

通过参与该项目,我学习了一个真正的商业项目是怎样开发的,也学习了前端的更多技术,感谢项目老大~

开始学习3D

此时我看到了Babylonjs的3D demo,非常震撼。我已经迫不及待地想要学习3D技术了!我加入了北京的一个创业公司,开始接触WebGL技术。

感谢该公司,技术上对我有很多启发~比如我第一次看到了类似于Unity的组件化架构的引擎,而我之前一直参考Cocos 2D,用的是继承架构。我也学习了使用渲染命令队列来解藕逻辑和渲染的设计思想。

我是如何开始学习WebGL的呢?
1.我找到了《WebGL编程指南》这本书,把大部分demo实现了一遍;
2.再次第二遍实现demo,提炼3D引擎的雏形;
3.用提炼的引擎实现了一个“自由浏览场景”的demo。

开发引擎

通过学习3D,我感受到了3D引擎的巨大魅力,我决定自己开发一个3D引擎!

辞职,回家,从0开始,开发3D引擎

我学习了函数式反应编程的思想,模仿Rxjs,写了个Wonder-FRP库,这就花了我1个月的时间,为我以后学习函数式编程埋下了伏笔。

我出于学习的目的,尽可能地加入更多的功能(模型,动画,地形,水,阴影。。。。。。),并没有考虑给别人使用。

虽然引擎是全覆盖的单元测试用例,并且我注重代码质量,但是性能方面没有过多地优化,也没有外部的使用反馈。所以引擎属于自己玩的玩具。

短暂的工作

开发了一年后,我认为需要到外界获取一些反馈和交流,所以我参加了工作,并在工作中收集相关反馈,继续改进引擎。

我用引擎做了一些demo,并开始应用到手机端。

同事反馈:引擎太笨重,应该更加地模块化。感谢同事对引擎的改进建议,让我看到了引擎很多的不足。

再次出发

辞职,回家,我决定重写引擎。

此时我开始学习函数式编程的思想,这再次刷新了我的认知。因此我从面向对象切换到函数式编程,开始重写设计引擎,立足于真正的商业应用,能够支持大型场景:
1.使用js库,进行函数式编程
2.支持多线程
3.支持WebGL2
4.支持延迟渲染

与Mickey合作,一起开发Wonder产品

随着Mickey的加入,我们开始真正的创业:开发引擎和编辑器,打造Wonder,建立Web 3D生态。
我继续开发引擎,Mickey开发编辑器。

再次重写

开发一段时间后,我认为js库进行函数式编程非常不方便,代码不好看,而且性能也不好。

我关注到Reason的发展,认为Reason已经足够成熟,可以使用了。

于是我们引擎和编辑器完全重写,从Typescript切换到Reason,使用Data Oriented设计,开始真正的函数式编程。

Wonder发布1.0

从重写到发布,《一个本科毕业生创业两年的感悟》已经很好地总结了这段时间的经历。

终于,Wonder 1.0正式版发布,完成了我们创业的第一步,交付了第一个可以真正使用的产品。

从学习3D,到发布1.0产品,经历了4年。

我们的引擎和编辑器开源,详见:
Wonder.js引擎
Wonder-Editor编辑器

未来。。。。。。

我们会继续开发Wonder 2.0版本,打造和完善Web 3D生态,为大家带来更多的便利和服务。

详见路线图

我为什么一直走这条路?

因为兴趣,就会自发地想去学习,每天都有兴奋感。解决一个个问题后,也很有成就感。

我也看好Web 3D的潜力,这是一个有技术门槛,需要长期钻研,厚积薄发的领域,很适合我。

感谢互联网的便利,所有相关的知识都可以在网上搜索到。所以现在是最好的时代,能走到哪里全凭自己驱动。

我要走向何方?

我们做的Wonder产品-3D引擎和编辑器,技术上很有挑战,永无止境,这不就是对我最好的礼物吗?

我会持续地学习3D开发,把Wonder打造成世界上成熟的产品,让Web 3D开发变得轻而易举,为世界作出贡献。

致谢

感谢您能阅读到这里,每天都是最好的一天!

最后附上Wonder编辑器

8年,从2D到3D,我的学习之路的更多相关文章

  1. 《zw版·Halcon-delphi系列原创教程》 2d照片-3d逆向建模脚本

    <zw版·Halcon-delphi系列原创教程> 2d照片-3d逆向建模脚本 3D逆向建模,是逆向工程的核心要素.       3D逆向建模,除了目前通用的3D点云模式,通过2D图像实现 ...

  2. css3动画2D、3D转换

    css3动画的2D.3D转换代码: <!DOCTYPE html> <html lang="en"> <head> <meta chars ...

  3. ArcGIS API for JavaScript 4.2学习笔记[8] 2D与3D视图同步

    同一份数据不同视图查看可能用的比较少,因为3D视图放大很多后就和2D地图差不多了,畸变很小,用于超大范围的地图显示时有用,很多时候都是在平面地图上进行分析.查询.操作.教学需要可能会对这个有要求? 本 ...

  4. CSS3 2D、3D转换

    2D转换方法:transform().rotate().scale().skew().matrix() 3D转换方法:rotateX().rotateY() 1.示例代码 <!DOCTYPE h ...

  5. transform做2d和3d变形(css动画一)

    前言:这是笔者学习之后自己的理解与整理.如果有错误或者疑问的地方,请大家指正,我会持续更新! 有段时间我是没理清transform.translate.transition和animation之间的关 ...

  6. face-alignment:用 pytorch 实现的 2D 和 3D 人脸对齐库

    使用世界上最准确的面对齐网络从 Python 检测面部地标,能够在2D和3D坐标中检测点. 项目地址:https://github.com/1adrianb/face-alignment 作者: 阿德 ...

  7. 论文翻译——Rapid 2D-to-3D conversion——快速2D到3D转换

    https://blog.csdn.net/qq_33445835/article/details/80143598  目前想做一个关于2D转3D的项目,由于国内资料比较少而且大部分都是基于国外的研究 ...

  8. 介绍用C#和VS2015开发基于Unity架构的2D、3D游戏的技术

    [Unity]13.3 Realtime GI示例 摘要: 分类:Unity.C#.VS2015 创建日期:2016-04-19 一.简介 使用简单示例而不是使用实际示例的好处是能让你快速理解光照贴图 ...

  9. Rapid 2D-to-3D conversion——快速2D到3D转换

    https://blog.csdn.net/qq_33445835/article/details/80143598  目前想做一个关于2D转3D的项目,由于国内资料比较少而且大部分都是基于国外的研究 ...

随机推荐

  1. 如何让 Editplus 支持 SQL 语法高亮

    editplus 用来编辑或查看一些常用程序源码都很方便,而且软件小巧,但是他原生不能支持对 SQL 文件的高亮显示,有点遗憾,但好在我们可以自定义这种高亮显示,那么要如何设置呢 1. 首先点击下载文 ...

  2. T5大牛带你解析:如何实现分布式技术

    1.分布式事务 2. 分布式锁 Java 原生 API 虽然有并发锁,但并没有提供分布式锁的能力,所以针对分布式场景中的锁需要解决的方案. 分布式锁的解决方案大致有以下几种: 基于数据库实现 基于缓存 ...

  3. 解决 Mac launchpad 启动台 Gitter 图标无法删除的问题

    Mac 删除应用非常简单,将应用拖到回收站就删除了.或者进入应用程序文件夹,选中程序,command + delete 就删除了应用,这也是删除文件的快捷键. 但是,安装 Gitter 后,删除了应用 ...

  4. Servlet+JSP及Tomcat常见面试题(面试必备)

    1.  什么是servlet? servlet是用来处理客户端请求并产生动态网页内容的java类 2.  Tomcat的缺省端口是多少,怎么修改? a)      默认端口号是8080 b)      ...

  5. Python 闭包小记

    闭包就是能够读取其他函数内部变量的函数.例如在javascript中,只有函数内部的子函数才能读取局部变量,所以闭包可以理解成“定义在一个函数内部的函数“.在本质上,闭包是将函数内部和函数外部连接起来 ...

  6. Linux配置成网关

    之前按照诸葛建伟的metasploit魔鬼训练营搭了个简单的内网环境,其中就是一台linux作为内网网关.但是虚拟机开启的时候经常出现包不能转发的情况,也就是网关没有配置好. 在网上找了好几个才找到适 ...

  7. Hadoop3.2.0使用详解

    1.概述 Hadoop3已经发布很久了,迭代集成的一些新特性也是很有用的.截止本篇博客书写为止,Hadoop发布了3.2.0.接下来,笔者就为大家分享一下在使用Hadoop3中遇到到一些问题,以及解决 ...

  8. 微信小程序开发06-一个业务页面的完成

    前言 接上文:微信小程序开发05-日历组件的实现 github地址:https://github.com/yexiaochai/wxdemo 这里来说一说我们的理念,我们也学习小程序开发有一周多了,从 ...

  9. 把项目中那些恶心的无处存储的大块数据都丢到FastDFS之快速搭建

        在我们开发项目的时候,经常会遇到大块数据的问题(2M-100M),比如说保存报表中1w个人的ID号,他就像一个肿瘤一样,存储在服务器哪里都 觉得恶心,放在redis,mongodb中吧,一下子 ...

  10. Java高阶语法---static

    背景:听说static Java高阶语法是挺进BAT必经之路. static: 静态static,很多时候会令我望文生义,但是get到了static最重要的一点,其他的理解都还ok. static最重 ...