Friday

Friday

Busy doing nothing
China Shanghai

AI生成的UI设计，现已胜过八成人类设计师

## 当UI拼搭效率大幅提升，对行业未来意味着什么？ ![Open AI Image 2模型生成的UI设计](https://miro.medium.com/v2/resize:fit:1000/1*Ff50cQeYMpt4oaggUZ7HWg.png) 当下各大厂的AI主导权争夺战打得正热。Anthropic刚推出Claude Design没几天，OpenAI就甩出了全新的图像生成模型，这次还专门针对UI设计做了调优。我亲自测试了一番，不得不说结果相当惊艳。 ## 等等，真的假的？ 两年前ChatGPT刚能生成图像的时候，它做的UI设计烂得和当年爆火的「威尔史密斯吃意大利面」恶搞AI图差不多。 看得出来那时候模型是拿设计师作品站Dribbble的数据训练的：它拼命想把界面做得吸睛有创意，但界面本身错得离谱，笑死人。 ![2023年的AI生成UI烂得离谱](https://miro.medium.com/v2/resize:fit:1000/1*KVMSZQ8Ix9aMgvtW87_nqA.png) 这就是2022年底到2023年初AI做UI的水平 ### 现在早就不一样了 我用两个简
13 min read
Javascript测试框架
测试自动化

Javascript测试框架

了解几种JS测试框架，以供接下来工作中的需要。 下面是几种近几年评价较高的JS测试框架： 1.Jest 由Facebook团队研发，用于测试应用代码，尤其是React应用。React Redux testing [https://www.lambdatest.com/testing-cloud/react-redux-testing]. Jest之所以比较特殊在于它提供了一个集成框架，无需复杂的配置，只需要通过npm安装即可使用。 npm install --save-dev jest 为何Jest作为一个自动化测试框架如此受欢迎？主要在于以下几点： * 开箱即用，并且附带一个断言库，因此不需要再像其他测试框架那样需要自行搭配额外的三方断言库。测试用例通过行为驱动 （behavior-driven）的方式实现。你可以将你的测试用例文件放在_test_目录下运行。 * Jest的文档很棒，并且它是一款性能非常不错的测试框架。 * Jest提供了一组测试工具，他们有更高的鲁棒性，更少的错误。 * Jest可以通过抓取截图来进行可视化回归，如果你的应用React应
2 min read
PIXI.js 学习（二）
Web

PIXI.js 学习（二）

今天继续学习PIXI.js吧，  虽然已经很晚了。。 PIXI.js 的主要组件分为 Renderer @pixi/core PIXI.js 的核心组件，渲染 scene graph 到屏幕上，底层默认使用 WebGL 渲染器渲染 Container @pixi/display 主要的显示对象，会创建一个 scene graph：一个可渲染的对象树，比如 sprites， graphics 和 text Loader @pixi/loader 提供了一组用来异步加载资源文件的工具，音视频，图片资源等 Ticker @pixi/ticker 提供了基于时钟的周期性回调，你的游戏更新逻辑将会在每一帧执行，你可以同时使用多个tickers Application @pixi/app 一个简单的封装帮助类，封装了Loader，Ticker
4 min read
PIXI.js 学习（一）
Web

PIXI.js 学习（一）

今天突然心血来潮想要做一个游戏 可能是前几天看了《失控玩家》这个电影吧，应该是有点影响的 我相信大部分码农在刚开始写代码之前都幻想过做一个黑客， 或者等学会写代码之后做一款理想中的游戏 我两种都幻想过，但是一个都没实现，哈哈 废话不多说了，之前了解过 PIXI.js 这个库，从这个开始吧 官网说这不是一个游戏框架，因为只包含了游戏的图形渲染部分 不过这些都是次要的， 先从画面开始 下面开始吧，PIXI.js 官网走起！ 还是先不要立Flag了，之前立了Flag都半途而废了，哈哈
1 min read
CG学习

CG学习

PS软件运用 图层 1.叠加模式：修改颜色，上色 2.减淡模式：增加亮度，高光效果 3.正片叠底：取颜色正面暗面 颜色 H. 色相 S. 纯度 B. 明暗 Photoshop工具使用 用来创建选区：选框工具(m)，套索工具(l)，快速选区工具(w) 裁剪想要的形状：裁剪工具(c) 取色：吸管工具(i或cmd+单击色块) 创建简单图形或路径：形状工具(u)，钢笔工具(p)，使用直接选择工具(a)选择锚点 Photoshop快捷键 移动工具:v 选框工具:m 套索工具:l
2 min read