这个国庆我原本想七天都宅在家里的,但后来我还是改变了主意,决定去外面看一看。
当我得知我喜欢的乐队 MyGO!!!!!将于上海开演唱会时,我内心十分激动。然而,票务代理却是臭名昭著的 EUPD,他们以放票少,官牛多而出名,让无数抢不到票的粉丝伤透了心。
当抢票信息公布后,我并不打算直接用手机去抢票,因为这样成功率实在是太低了,感觉就跟原神无保底单抽出金的概率差不多吧。
作为一个还算懂点技术的人,我决定利用我平时所学,打造出几个抢票利器,来助我一臂之力。
TUIKit是腾讯的一个基于 Chat SDK 的 UI 组件库,目前支持 H5、小程序、uni-app,但并没有对 Taro 的支持。
由于我的项目是基于 Taro 的,因此我先要把它 uni-app 的版本迁移到 Taro 上去。
这里是 alphardex。
最近我想做一件事情,这件事情是我之前一直想做,但迟迟未能落成的事,那就是——cosplay!
cosplay 是一种潮流,它源自日本,指的是模仿并扮演动画、漫画、游戏(简称 ACG)等虚构作品中角色的活动。参与者通常会精心设计自己的服装和化妆,以尽可能地还原原作中角色的外貌和特点。这不仅是一种娱乐活动,也是一种表达对喜爱作品的热情和尊重的方式。无论是在展会、活动中,还是在社交媒体上,cosplay 都是一种展示个人创意和爱好的方式。(By ChatGPT)
作为一个宅龄十年的 ACG 爱好者,不玩一次 cosplay 真的是有点对不住这个身份。
记得在学校读书的那个时候,不仅没钱,而且还被各种作业和考试压迫,但现在就不一样了,钱是足够的,并且下班回家后还相对比较自由,在这些条件下,为什么不试着大干一把呢?
本文就暂时不谈技术了,专门讲讲我探索 cosplay 的过程。
这里是 alphardex。
最近看到有小伙伴发了一个小米 SU7 的展示网页,那是相当的酷炫:
光看上面的图可能看不出来什么,请直接访问原网页:https://gamemcu.com/su7/
当你体验一遍后,会看到各种炫酷的效果,包括隧道穿梭、波浪动画等,并且还有些细节也值得注意,如地面的反射效果。
那么这个网页是用哪个技术实现的呢?答案是three.js
,不论是从控制台,还是一些技术解析插件都能得知。
但是,这里我要研究的重点却并非three.js
本身。仅仅用three.js
展示一个3D
模型,相信对大家来说并不是很难。真正的难点,是那些炫酷的效果是如何实现的。想要实现那些效果,就得靠three.js
背后的功臣——Shader
,也就是着色器。
为了进一步地加强three.js
和Shader
的学习,我决定爆肝几天,亲手把那些炫酷的效果给还原出来。
经过一定的努力,总算是写出来了。不多说,放地址:https://su7-replica.netlify.app/
对整体流程做了一个简化:入场动画过后,无需长按,点击汽车即可直接进行冲刺(方便直接录制动图或视频),再次点击汽车即可取消冲刺,返回原来的状态。
相信不久前大家已经被这个粒子动画给刷屏了吧:
之前看过很多人都在分析跟这个效果相关的跨窗口通信技术,尽管这样是挺好,但我依旧有点纳闷:为什么没有人讲讲背后的粒子特效是怎么实现的呢?
于是乎,我花了一整个周末,把这个粒子特效给肝了出来。尽管可能跟原特效相比有一点差距,但也表明了这种效果是可以实现的。
在线体验:https://entangled-fxhash.netlify.app/
本文就让我们来看看实现这个粒子特效有哪些要点吧~
之前看到有人在浏览器端复刻了原神的登录界面,效果非常还原。
本文就让我们一起来看看这种效果是如何实现的,主要分析Shader
相关的部分。
怀着学习的目的,我自己也写了一版,观看地址:https://genshin-replica.miaohezi.com/
呀哈喽!这里是 alphardex。
在使用 three.js 开发时,有时会感觉场景的渲染不是非常美观,本文就来一步一步地将一个不是很美观的场景重新焕发它的生机。
场景美化前:
场景美化后: