- 我是如何从网瘾少年变成程序员的?
从网瘾少年到从网瘾少年到流水线工人流水线工人从网瘾少年到流水线工人 2008年的我很顽皮是一名典型的网瘾少年。还记得当时为了做每天的游戏任务,早上5点钟就从被窝里爬起来去网吧上网,上两个小时到7点钟再去学校上课。 [图片] 当时的我学习成绩特别差,初中升高中的时候,没有考上当中的重点高中。那个时候就萌生不想读书的想法,不管家人怎么说都铁了心不愿意再读书,于是老爸提出,只要我乖乖听话去上学,就买一台电脑给我。当时拥有一台电脑可以说是我最大的梦想,所以我选择了一所职中,专业是电子电工。 [图片] 现在还依稀记得学习内容是:认识元器件,焊接,排线,修电视机,修电冰箱,制作电路图等等。 [图片] 学习两年之后,2010年开始进入工厂实习,工资一月600元,当时觉得还挺多的。因为自身玩心太重导致干了半个月就没干了。后来去了东莞,由于没有成年的原因,进工厂只能交中介费,交了200元才能找到一份工作,做一名流水线工人,一条线十多个工作位,我负责的是用电烙铁将一个电阻焊到一块电路板上面。 [图片] 由于刚进工厂,工作时候动作不够熟悉,做起来很慢,导致后面的人没有事情做,影响到了整条线的生产速度,那段时间经常被小组长骂。 在工厂做了快一年,直到有一天,我无意中问了问带我做事情的师傅。 [图片] 就这段无意的对话使我陷入了思考,那年我正好17岁,3年后就是这位同事的状态,仿佛看到了自己的未来,这并不是我想要的。接着我就拿起了手机给我爸打了一通电话,说自己想回家继续读书。 我爸很支持我,没过多久我就提了辞职报告收拾东西回了家。现在聊起当年的经历我爸说当年很多亲戚其实都是不支持我回来的,在我家那个小地方,17岁能赚到3000多已经很不错了。加上从小学习成绩就不好,再读书肯定不行,指不定学费白花了,还不如好好在工厂打工。 [图片] 从流水线工人到程序员 2011年回到家后,我去长沙找了一家学校,学习了自己想学的编程。 说句题外话,我为什么想学编程? 小时候非常喜欢玩游戏,一名准网瘾少年。玩过很多游戏,如:泡泡糖,传奇,私服,魔兽争霸,魔兽世界,跑跑卡丁车,冒险岛,梦幻西游,QQ炫舞,DNF ..., 用过一些游戏外挂,觉得好牛,以为学习编程就能做外挂了。(结果你懂得!) [图片] 经过两年的学习之后,我2013年来到了上海。那一天是2013年6月22号,当年的想法是做架构师,踏上长达16个小时的火车来到了上海,一路坎坷事情虽然已过去几年了,但现在我仍然记忆犹新。 [图片] 从学校到职场 21岁-23岁(2013-2015),从Android开发到移动端负责人,开始带团队。 在去上海找工作之前,我加了很多技术交流群,问过里面参加工作的人,面试的常见问题,还请在里面关系不错的给我做了模拟面试。 2013年6月,我从长沙到上海来的时候,面试的情况还算比较不错,用了 3 天面试 7 家公司,拿到了4个offer。 我选择了一家小型公司,公司的产品是一款语言助手APP,上千万用户量。 在这家公司我参与了备忘录模块,天气播报模块,帮助事件,查找命令,来电播报,短信播报,应用管理模块,联系人模块,摇一摇功能,换肤功能,参与酒店模块以及重构开发。 [图片] 虽然经常加班、但是感觉特别充实,学到了很多!感觉自己就像一块海绵一样,在知识的海洋里贪婪地吸收着。平时我的小组长分配的任务,我都会用最快速度去执行并完成,每次都能够提前完成,再主动找毛毛要新任务,如果没有新的任务则会主动问同事有没有需要帮忙的地方。 我认为,在这个阶段让我懂得了。 无论做什么任务都要全力以赴,虽然每次安排任务会越来越多,但是不要怕做的越快任务越给越多,要知道实践的越多学习的越多,对自己成长越大! 从技术到管理 23岁-25岁(2015-2018),进入一家创业公司,从0到1搭建研发团队。 那个时候公司一共就30多人,一个开发也没有,大部分都是销售,业务是做高端婚礼会馆,老板想做自己的系统,觉得系统能赋能业务。我的想法就是试一试,大不了重新找工作,于是拿着身份证就办理了入职手续。 当时办公场地在南京步行街和公司租的婚礼场地在一个地方,于是老板随便找了一个小办公室,搞了网线,我自带了电脑。这就是我的办公场所了。 初期最难的是招人,最开始就是叫朋友过来看看聊一聊,前几个人都是朋友叫朋友的,开发圈子里面都有些熟人。花了一个多月团队也初步成型,移动端,后端,设计都有1-2人了(早期只做App所以没有招聘前端人员)。 由于没有产品经理就自己每天和老板沟通需求,自己找了个原型图绘制软件把想法画出来,然后不断的和老板探讨。开始开发,由于团队刚开始磨合花了不少时间,所以开发时间也评估少了,只能加班搞。花1个月的时间,做出了系统的第一个版本。上线后天天加班改功能,因为需求只和老板讨论过,而没有和实际使用的业务讨论过,很多功能与业务场景不符合,想法过于美好,考虑不完善。在没有招到产品之前,我承担了产品的角色,前往业务一线天天和业务人员一起讨论,最后也做出了业务人员满意的产品功能。 [图片] 过了两年后,公司从原来的30多人到了300多人。开发团队也跟着不断扩大,从原来的几个人变成了三十多人,管理难度也大幅度提升了。从原来的几个人都坐在一张桌子上,一起吃饭聊天到现在坐满了一个办公室。这个时候制度就很重要了,所以开始制定了一些制度,还有一些奖惩机制,以及找老板要了每个月都活动经费。这个时候我开始看很多管理方面的书籍、还上了很多管理到课程(线上、线下都有)、以及还请身边带团队的朋友吃饭,请教一些带团队的问题。 老板也给了我了足够大的自由空间,让我搭建了整个研发团队的制度、流程、福利。打破了我固有的技术思维,让我学习了商业思维,带我去上线下管理课。 我认为,在这个阶段有两点对我成长帮助很大。 自己当产品的经历。一定要去了解业务一线,老板看到是方向。业务一线才能提出真实需求。要学会提取符合业务产品的需求然后往老板的方向去做,这样才是对的。否则做出来业务人员不用,就是白做了。 思考问题的思维的转化。我的思考维度从“如何做,能不能做?”到“为什么做,带来什么样的价值?”让我从技术人员的思维转换成了管理者思维,带我思考产品的商业价值。 从上海到长沙 25-28岁(2018-2021),进入在线教育公司,担任事业部负责人,带领30多人团队做公司核心业务。 从上海带了一支小团队谈好条件一起来到了长沙,第二天就办理入职手续进入工作状态。在这家公司成立了一个新部门,起初是做微信小程序做用户留存,由于上面给的压力较大加班非常疯狂,从白天干到黑夜,累了回去就睡,起来就继续干。 期间我们尝试了很多种不同的类型:答题、直播、视频、社区、工具矩阵等等,大大小小做了几十款小程序。后来又从to C 转向 to B业务,虽然尝试了很多类型的to C的小程序产品,但是从数据的角度来说并没有被公司认可,反而在to B内部系统中获得了不错的评价。从2018年到2019年,一年多的时间过去了,当时做的业务稍微有些起色的时候,被组织架构调动了。 组织架构大调整,资源重新分配,从最开始一个人带着5个人搭建团队用了一年多的时间到了20多人,后来资源重新整合两个部门合并。我又重新回到了一年多钱多状态又从5个人开始带起,做了一个公司的创新业务,主要和广告投放相关的业务。 从2019年到2021年,经过一年多的不断迭代,反复的和业务摩擦,所负责的团队业务越来越广,团队也随之越来越大从5人增长到了30多人,业务也从边缘做到核心,覆盖100%公司的流量入口。 [图片] 在这家公司做了3年多,从2018年3月14号入职到2021年6月22号离职。目前在创业中,围绕微信生态探索更多的可能性。 在这家公司我学习到了: 目前是流量为王的时代,有流量就能产生收益,流量是一家公司的生死线,核心中的核心。 有了流量之后,需要去提高流量利用率,做好用户留存,分析用户多个维度的需求,去满足产生新的垂直业务场景。 在一个行业做了几年之后,自己一定要让去理解这个行业,技术人的技术只是基础,行业认知才是放大器,基于行业特性做出来的解决方案才是最有价值的。 业余时间 除了以上的工作经历,我还是一个喜欢用业余时间折腾。 1. 2016年写出知名Android开源库 BRVAH 22k+ stars,同类框架排名第一。 [图片] 2. 2017年启动公众号「码个蛋」,公众号矩阵10w关注。 [图片] 3. 2018年探索微信小程序,目前工具矩阵百万用户,用户访问数千万次。 [图片] 改变自己 [图片] 回想在这些年的过程,其实本质上就是在不断的改变自己。 以前的我,只会一味的阅读技术书籍,沉迷于技术。 以前的我,不喜欢与人沟通,甚至有些偏内向。 以前的我,只会用最快的速度完成安排下来的任务。 以前的我,只关注自我成长。 以前的我,只关注当前要做的事情,只想着怎么做。 以前的我,只关注项目内容的交付。 现在的我,阅读的书籍类型有管理,心理,商业,人文。 现在的我,喜欢和人聊天,倾听,讨论,分享自己的想法。 现在的我,在接到任务之前更多的是思考是否合理,有没有更好的解决方案。 现在的我,关注团队每个人的成长。 现在的我,站在用户角度思考,多想产品价值,先会思考为什么这么做。 现在的我,会从产品到研发再到运营,全面思考上下游的衔接。 这些经历让我懂得了。 1.积极主动做事情,得失不要太看重。 2.要深耕某个行业,不要做全要做精。 3.坚持每天复盘,从反思中不断成长。 以上是我从一名流水线工人到程序员再到一名创业者。一路走来的思考,希望能对你有所启发。 [图片] 最后,再送上一段我很喜欢的话 我喜欢程序员,他们单纯、固执、容易体会到成就感;面对压力,能够挑灯夜战不眠不休;面对困难,能够迎难而上挑战自我。他们也会感到困惑与傍徨,但每个程序员的心中都有一个比尔盖茨或是乔布斯的梦想“用智慧开创属于自己的事业”。我想说的是,其实我是一只程序猿*
2021-09-10 - 从webview渲染列表页 二次进入skyline渲染的详情页,组件显示异常?
从webview渲染列表页 二次进入skyline渲染的详情页 <t-image>组件无法正常显示,组件一直处于loading状态
08-30 - sticky-header 组件offset-top 属性,目前似乎不支持 负值,比如-200?
sticky-header 组件offset-top 属性,目前似乎不支持 负数,比如-200? 后续可以支持 offset-top 支持负数吗?有些交互用得上,比如滚动时,顶部的封面图 不希望它 完全隐藏, 可以留一部分,作为 navbar的 背景图 这样UI 好看点。。
08-30 - 个人开发者把小程序发布到 App Store 5个步骤(保姆级教程)
用完即走,小程序已经成为连接用户与服务的重要桥梁,无论是购物、出行还是娱乐,小程序都以其便捷性和高效性赢得了用户的青睐。 那小程序是否有边界,能否拓展到 App? 微信开发者工具的最新升级,为这一问题提供了创新的解答。现在,开发者们可以轻松将已有的小程序代码构建为全功能的 App,而无需从零开始开发,这不仅节省了大量的人力和时间成本,更为小程序开发者们打开了通往 App Store 巨大流量的大门。 在这篇文章中,我们将深入探讨微信开发者工具支持小程序 App 化的五大步骤,分析其潜在价值,并通过实际案例来展示这一过程的效果。 背景:个人开发者,将小程序代码构建为 iOS App,以下为整体流程,适合 iOS 开发 / 上架零基础的同学。 [图片] 缘起 一个周末,突然奇想,我还没有搞过 App,要不搞搞玩玩😄 从 0 开始学还是很慢的,毕竟时间有限,好在了解过提示工程 [代码]《ChatGPT 进阶:提示工程入门 陈颢鹏 李子菡》[代码],问了一下助手 ChatGPT 几个常见的问题。 开发适用于 iPhone 的 App 的流程是什么 注册开发者账号 -> 下载 Xcode -> 学习 Swift -> 设计 + 编码 + 测试 -> TestFlight 内测 -> 准备上架 (准备) -> 提交审核 -> 应用上架 -> 应用更新和维护 很好,请给出可运行的应用实例,完成查询本机 IP 地址 我是一个新手,请问在 XCode 中如何运行你提供的代码 几轮对话后,大约用了 1 个小时,一个 iOS Demo 在模拟器上跑成功了,有点意思😄 不过功能有点简单,几年前用 Vue 写过一个还在跑的网站,同时我知道 ChatGPT 的编程能力,于是我丢了一个问题给他。 [代码]你是一个开发,会 Vue 、iOS 开发(使用 SwiftUI 框架 )两种语言,现在需要你根据 Vue 的代码重写为 iOS 代码,以下是 Vue 代码 [代码] [图片] 笔者是一个运维平台的产品,为了不忘记运维场景和技能,自己维护一个业务场景,开发语言:golang + Vue,部署架构:腾讯云 CLB+TKE+ 服务网格,运营系统:CLS+ 云函数 +Kafka+Doris+Flink+Hadoop+Streamsets。 结果惊奇的发现,真的可以执行,不服不行 👍 [图片] 1. 转折:把小程序代码构建为 iOS App 测试包(1 小时) 如果仅仅只是这样,那么这篇文章标题就该叫“GPT 如何将 Vue 改写为 App”。 万万没想到,过了 2 周从朋友那里获悉 微信开发者工具可以直接将小程序代码构建为 App,就像 Golang 一样,可以通过参数 [代码]GOARCH[代码] 控制构建的程序是在跑在 [代码]amd64[代码],还是 [代码]arm64[代码] CPU 架构上。 [图片] 现实就是这么巧,几年前使用 Vue 开发站点时,同时也开发了同款小程序。 有点意思,参照文档 构建你的第一个应用 花了 1 个小时,在我的 iPhone 上跑了 测试版 的 App. [图片] 此处应该给多端应用的产品和开发点个赞👍🏻 搞到这里,我其实进入了这款的第一个哎哈时刻,确实很爽,因为我不需要花心思用 GPT 来迁移 Vue 程序,直接用微信开发者工具构建为 App 即可,交互完全一致。 另外记录构建过程中遇到的两个问题 问题 1:小程序的图片在 App 中无法渲染 启用 Media SDK 即可 [图片] 问题 2:App 带有 Vconsole 入口 一开始以为在模拟器中才有,最后发现是一个配置,需要自己主动关闭。 [图片] 2. 构建正式包 谁不想在 App Store 能搜到自己的 App 呢,第二步,构建正式包。 2.1 准备苹果开发者账号 在 MacBook Air 或 iPhone 中安装 Apple Developer,然后注册苹果开发者账号 [图片] 一年 688 元会费 [图片] 正常情况下,交完会费后,第二天会收到一封欢迎加入 Apple Developer Program 的邮件,代表苹果开发者账号注册成功。 很遗憾,我注册时提示“未知错误,请再试一次” 找 Apple Developer 客服反馈,最后答复 [代码]由于一个或多个原因,您无法完成 Apple Developer Program 的注册。我们目前无法继续处理您的注册。[代码]。 好吧,估计是被风控命中了,于是找了家人的账号来注册,直接成功😄 2.2 生成 Bundle ID/ 证书 /Profile 生成 App 备案和构建正式包都需要的 Bundle ID/ 证书 /Profile。 生成 Bundle ID Bundle ID 是一个唯一的标识符,用来识别你的应用程序。它通常采用反向域名格式,例如 com.example.myapp。在开发和发布应用程序时,你需要在苹果的开发者账户中注册一个 Bundle ID,这样苹果的服务才能识别出你的应用程序。 参照 文档 生成 Bundle ID。 生成 证书 /Profile 证书(Certificates)用于建立开发者的身份,并确保应用是由已注册的开发者发布的。开发者需要从苹果开发者中心申请证书,用来对应用进行签名,这样 iOS 设备才会信任并运行这个应用程序。 配置文件(Provisioning Profiles)是一个包含证书、应用程序 ID、设备 ID 和其他信息的文件,它告诉 iOS 设备一个应用程序可以被安装和运行。配置文件将应用、开发者和设备联系起来,控制哪些设备可以安装和运行你的应用程序。 参照 文档 生成 iOS 证书和 Provisioning Profile。 [图片] 拓展资料:创建证书签名请求 问题:申请的 iPhone Distribution 证书不受信任 导入 Apple WWDRCA 证书 即可,可能原因:大致是分发的根证书没有导入你的 Mac 上。 更多资料详见 Apple PKI。 [图片] 2.3 备案(10 天 +) App 如果没有备案,在中国大陆将无法上架,这是苹果官方的说明。 中国工业和信息化部(MIIT)要求 App 必须具备有效的互联网信息服务提供者(ICP)备案号,了解更多 [图片] 其实备案比较简单,参照 App 备案 ,使用上一部分申请的 [代码]Bundle ID[代码]、证书(可查看 [代码]公钥[代码]、[代码]签名 MD5 值[代码])即可,不需要把 App 开发完,再来备案。 备案最长需要 20 个工作日,笔者用了 10 个工作日,在一个周五的下午收到了工信部发来的备案通过短信。 2.4 创建移动应用 移动应用是为了让 App 能用上微信的能力(比如分享到朋友圈或发送给朋友、微信登录 / 支付等),在移动应用中同时登记了 Bundle ID 和 Universal Links,这将会传递给下一步的多端框架,这是构建可正式包(采用苹果的分发证书)的必备条件。 先介绍一下 Universal Links。当用户使用 iPhone 手机访问你的网站,同时安装了 App 时,能在网站顶部快速跳转到 App。具体可以看下苹果官方的文档 Supporting associated domains 你需要有一个网站,未来要放 Universal Links 要用到的 [代码]apple-app-site-association[代码] 文件,不过对于我来说,这个功能好像用处不大,我更需要的是当用户用 iPhone 访问网站,引导他去 Apple Store 安装 App. 这里有一个关键信息,如果你不需要微信支付 / 微信登录 / 微信卡券的能力,不需要做开发者认证(开发者认证不能是个人主体) 访问 微信开放平台,创建移动应用,提交审核,几个小时就审核通过了。 [图片] 2.5 绑定多端框架 在 Donut 开发平台 中将 多端应用绑定上一步创建的移动应用,这样可以用到移动应用中登记的 Bundle ID 和 Universal Links,官方这么做比较合理,关键信息必须通过移动应用这关人工审核来起到一定的约束。 [图片] 绑定后,在多端应用中可以看到 Bundle ID 和 Universal Links 了。 [图片] 2.6 准备 App icon 等资料 App Icon 先用工具为你的 App 设计一个 1024px X 1024px 的图标,然后在 App Icon Generator 上生成 iPhone 所有规格的图标,之后在 [代码]project.miniapp.json[代码] 配置。 [图片] 启动图片 App 启动一般需要 2~4 秒,如果没有启动图片是白屏,用户会有点慌,不知道当前 App 是否正在启动,启动图片就是解决这个问题,同时在启动图片中传达 App 的价值主张。 我是直接用 Sketch 设计的,分辨率为 1290px x 2796px,这是兼容性最强的 6.7 寸(iPhone 15 Pro Max/15 Plus/14 Pro Max)手机的分辨率。 考虑到启动图片在不同机型上的兼容性,如果你用 Xcode 开发,苹果官方会推荐使用 Launch Screen Storyboard 隐私信息访问许可描述 小程序虽然没有用到摄像头、麦克风等权限,但多端的 SDK 中有(具体详见 Donut 官方文档 上架应用市场常见问题),所以得提前申明,不然把包通过 [代码]Transporter[代码] 上传后,会收到苹果发出的不合规邮件。 [图片] 以下是根据苹果官方打回的邮件中定义的隐私信息访问许可描述,应该是最基础的了,可以贴到你的 [代码]project.miniapp.json[代码] 文件中(用编辑器打开)。 [代码]{ "privateDescriptions": { "NSBluetoothPeripheralUsageDescription": "为了提供完整的功能,我们的应用程序需要访问蓝牙外设。这将用于与其他设备进行通信和数据交换。我们承诺保护用户隐私和数据安全。", "NSMicrophoneUsageDescription": "为了提供完整的功能,我们的应用程序需要访问麦克风。这将用于录制音频和进行语音交互。我们承诺保护用户隐私和数据安全。", "NSCalendarsUsageDescription": "为了提供完整的功能,我们的应用程序需要访问日历。这将用于提醒和日程管理。我们承诺保护用户隐私和数据安全。", "NSLocationAlwaysAndWhenInUseUsageDescription": "","NSBluetoothAlwaysUsageDescription":" 为了提供完整的功能,我们的应用程序需要始终访问蓝牙外设。这将用于与其他设备进行通信和数据交换。我们承诺保护用户隐私和数据安全。","NSPhotoLibraryUsageDescription":" 为了提供完整的功能,我们的应用程序需要始终访问相册。这将用于 IP 查询时显示 ISP 的图标。我们承诺保护用户隐私和数据安全。","NSCameraUsageDescription":" 为了提供完整的功能,我们的应用程序需要访问摄像头。这将用于录制视频。我们承诺保护用户隐私和数据安全。","NSLocationWhenInUseUsageDescription":" 为了提供完整的功能,我们的应用程序需要在使用时访问位置信息。这将用于提供定位服务和相关功能。我们承诺保护用户隐私和数据安全。" } } [代码] 2.7 构建正式版版本包 参照 打包生成 IPA 生成正式版的版本,注意使用分发证书。 [图片] 报错:file must be in miniprogram project 解决:把 mobileprovision 放在 miniprogram 目录下,因为 profile 不像 App icon 一样会自动上传到 miniprogram/ 目录下。 2.8 使用 Transporter 上传版本 参照 官方文档 上传正式版的 APK 包。 [图片] 遇到问题: Transporter,无法为 App “comxxxx.ipa” 创建临时 .itmsp 软件包。No suitable application records were found. Verify your bundle identifier ‘com.xxxx’ is correct and that you are signed into Xcode with an Apple ID that has access to the app in App Store Connect. [图片] 解决办法:去 App Store Connect 添加 App,绑定 [代码]Bundle id[代码],这样 Transporter 可以验证包在 App Store Connect 中已注册。 3. 使用 TestFlight 测试 在 App Store Connect 的 TestFlight 页面,可以选择内部、外部测试,外部测试版本需要 Apple 官方审核,把 公开链接发给朋友即可。 [图片] 在测试的同时,可以同步准备上架 App Store 的资料了。 4. 准备上架 Apple Store 审核资料 截屏 截屏是用来在 App Store 中显示你的 App 产品介绍页的,具体参照 截屏规范 [图片] 有 [代码]iPhone 15 Plus[代码] 和 [代码]iPhone 8 Plus[代码] 这两款机型就足够了,其他型号的手机能复用,分辨率应该是等比率缩放。 如果你像我一样,没有这两款手机,那用 iOS 模拟器。 Xcode -> 工具栏 Windows -> Devices and Simulators -> Create a new simulator -> Download more simulator runtimes [图片] 在微信开发者工具中运行这两款模拟器,利用模拟器自带截屏工具即可。 隐私政策 找一下常见 App 的隐私政策,在其产品介绍页中可以跳转过去。 如果你有网站就放在网站上,如果没有可以放在腾讯文档上。 [图片] 选择 App 供应的地区范围 哪些地区的用户可以下载你的 App。 [图片] 提交审核 一切准备好了后(包含备案),开启提交审核。 下午 5:35 提交审核,第二天早上 3:40 上架成功。✌🏻 [图片] 5. App Store 的数据 上架后刚好一周,看看最近一周的数据,还不错。 [图片] 这是评分数据 [图片] 6. 引流 二维码引流:草料二维码 通过草料二维码生成 App 的下载链接,放在网站上,引导用户跳转至 App。 Universal Links 参照 Apple 官网文章 Supporting associated domains 准备 Universal Links。 前面已经介绍了这个东东是干嘛的。 准备 [代码]apple-app-site-association[代码] 文件,放在网站的 [代码].well-known[代码] 目录下,完整路径为 [代码]/.well-known/apple-app-site-association[代码] 以下为示例,特别注意的是 [代码]appID[代码] 是由 [代码]团队 ID[代码] + [代码]Bundle ID[代码] 组成。 [代码]{ "applinks":{"apps":[], "details":[ { "appID":"<team_id>.<bundle_id>", "paths":["*"] } ] } } [代码] team_id 从 开发者账户 中获取 [图片] 顶部导航 当用户访问网站时,顶部引导用户跳转到 App 下载页。 等有空了搞搞。 7. 后记 小程序转 App,让个人或企业可以快速拥有 App,获取应用市场的流量,让开发者把精力放在业务逻辑上。 同时在开发小程序的过程中,发现开发者生态会散落在多个地方,比如 github,提供一些小程序模版、组件等能力,无法集中在一个地方比较方便的找到整个开发者生态的能力,和 VSCode 插件生态有点区别。 [图片] 先说 IDE 插件,比如我用 GPT4-Turbo 来写先代码或排查问题会在微信开发者工具和 Web 间跳转,操作流不太顺,如果能在微信开发者工具的插件入口中找到对应的 AI 代码助手,用起来应该很爽。 一旦平台的开放能力放出来,这些能力将源源不断的涌入到这个市场中,而不是作为平台方来集成这些能力,毕竟精力有限,同时还不一定做的最好,用插件可以让用户有更多的选择。 再说说 小程序组件,以大模型为例,目前市场有备案的大模型基座模型有好几家,在小程序开发过程中其实比较缺整体组件(UI + 背后的 API),有点像商场一样,平台方构建开放的能力,引导各个供应商提供开箱即用的能力,让用户可以快速上手,赶上这波大模型的技术趋势。 比如我自己在设计开放能力时的思考,平台专注骨架功能的开发,让开发者能参与到平台的建设中来,把生态盘活起来,最终提升大家研发运营的效率。 最后就是管理后端比较分散,比如 开放平台、donut、we 分析、云测、云托管,云开发,产品矩阵看不清,不容易知道整体的能力,缺少一个集中的控制台。 最后希望小程序越来越好 😄
01-30 - xr-frame如何实现ar模型下的透明遮挡效果?
如题,在shader中处理ar相机的底图作为遮挡物的贴图这种方式是否可行?有没有其他直接的方法?
2023-03-10 - xr-frame中渲染透明视频
渲染透明视频可以通过将透明视频通道转换为灰度图的方式,利用uv将透明叠加到视频上。shader处理如下: vec4 color = texture2D(u_baseColorMap, vec2(vTextureCoord.x*0.5,vTextureCoord.y)); vec4 colora = texture2D(u_baseColorMap, vec2(vTextureCoord.x*0.5 + 0.5,vTextureCoord.y)); vec4 baseColor = vec4(color.xyz,colora.x); gl_FragData[0] = baseColor; 具体代码: const xrFrameSystem = wx.getXrFrameSystem(); function createVideoTsbsEffect(scene) { return scene.createEffect( { "name": "video-tsbs", "properties": [ { "key": "u_baseColorFactor", "type": 3, "default": [1, 1, 1, 0] } ], "images": [{ "key": "u_baseColorMap", "default": "white", "macro": "WX_USE_BASECOLORMAP" }], "defaultRenderQueue": 3000, "passes": [ { "renderStates": { "cullOn": true, "blendOn": true, "depthWrite": true, "cullFace": 2 }, "lightMode": "ForwardBase", "useMaterialRenderStates": true, "shaders": [0, 1] }], "shaders": [ `#version 100 precision highp float; attribute vec3 a_position; attribute vec2 a_texCoord; uniform mat4 u_projection; uniform mat4 u_world; uniform mat4 u_view; varying highp vec2 vTextureCoord; void main() { vTextureCoord = a_texCoord; gl_Position = u_projection * u_view * u_world * vec4(a_position,1.0); }`, `#version 100 precision highp float; uniform highp vec4 u_baseColorFactor; #ifdef WX_USE_BASECOLORMAP uniform sampler2D u_baseColorMap; #endif varying highp vec2 vTextureCoord; void main() { #ifdef WX_USE_BASECOLORMAP vec4 color = texture2D(u_baseColorMap, vec2(vTextureCoord.x*0.5,vTextureCoord.y)); vec4 colora = texture2D(u_baseColorMap, vec2(vTextureCoord.x*0.5 + 0.5,vTextureCoord.y)); vec4 baseColor = vec4(color.xyz,colora.x); #else vec4 baseColor = u_baseColorFactor; #endif gl_FragData[0] = baseColor; } `] } ) } xrFrameSystem.registerEffect("video-tsbs", createVideoTsbsEffect); wxml: <xr-scene bind:ready="handleReady"> <xr-assets> <xr-asset-load type="texture" asset-id="waifu" src="https://mmbizwxaminiprogram-1258344707.cos.ap-guangzhou.myqcloud.com/xr-frame/demo/waifu.png" /> <xr-asset-load type="video-texture" asset-id="test" src="https://demo.uality.cn/output-lr.mp4" options="autoPlay:true,loop:true" /> <xr-asset-material asset-id="video-tsbs-mat" effect="video-tsbs" uniforms="u_baseColorMap:video-test" /> </xr-assets> <xr-mesh node-id="cube" geometry="cube" material="video-tsbs-mat" /> <xr-camera clear-color="0.4 0.8 0.6 1" position="0 1 4" target="cube" camera-orbit-control /> </xr-scene> 视频生成: 通过ffmpeg生成将带有透明通道的mov格式视频转换为左(rgb通道信息)右(alpha通道信息)的MP4视频。 ffmpeg -i input.mov -vf "split [a], pad=iw*2:ih [b], [a] alphaextract, [b] overlay=w" -y output-lr.mp4 也可以用百度小程序“AFX透明视频”带的工具制作。(左右的话,直接修改shader的偏移就可以了) 转换出来的视频结果如下图: [图片]
2023-04-07