Urano UI教程

嗨，如果你也想在视频开头实现这样的悬浮图标效果，其实只需要两步。第一步，我们打开一张纯黑的图片，然后下拉苹果手机控制栏，点击录屏，再拍摄一段人物戴耳机的画面。 这里我用了影视勾阿特进行录制，手持拍摄也足够清晰稳定。第二步，剪辑。在剪辑中，我们点击录屏好的素材，选中调整，把黑色调成负十二，再点击混合模式，改成绿色。然后我们复制几份，用蒙版工具抠出各个部分， 把拍摄到的人物画面放在所有素材的最底部。最后我们再对每个素材添加一个向上滑动的动画，把抠出来的素材自由排列，你就得到了这样的画面。

如何用 ai 生成这些 ui 图、表情包，还能转元文件，方便调整和切图交互呢？ 打开思考模式，输入这段描述，选一张比较满意的，选择工具栏的编辑文字就能直接修改，也不会改变文字原来的样式。 还可以用 command 加鼠标左键点选指哪改哪，还能导出矢量图，再也不担心仅仅只得到一张 jpg 了。下载后用 figma 打开，已经矢量化，就可以继续在里面调整和切图了。因为是思考模式，引擎里还有这个引导， 点击就能给到默认的提示词，帮我继续生成页面。基础页面差不多了，我们来做底部菜单的图标，选择裁切后的底部菜单图片，输入这段话， 编辑元素就可以提取单个的图标素材喽。之前页面生成后还有个提取 ip 角色的提示，太绝了，给我生成了这么丰富的结果，不只有各种面包类型的插画，不同的动作和表情，还有属于面包店的 ip 职业角色。 再编辑元素，就得到一个个拆解后的元素应用到其他的页面里。不管是直接静态图切图交付，还是转成矢量文件，导入 fgma 二次调整都很 ok。 你 学会了吗？我是洛洛，希望我的分享对你有帮助，下次见哦！

大伙儿好啊，今儿个呢，说一下这个图片快速切换开场哈，这样的， 呃，这样的图片快速切换的，这种开场呢，因为高动态嘛，所以呢比较抓眼球哈，那么这样的开场怎么做哈？非常简单哈，如果大家有图片素材，直接就可以拿来做，那如果大家没有足够的图片素材呢，可以用这个 copy y 生成，对吧？ 那么像这种开场超过几秒钟啊，比如说三秒钟左右的切图片，开场可能就需要大几十张图片，对吧？那么这样多的图片怎么去做呢？是吧？如果用 comfyui 怎么去做？很简单啊，就是第一步啊，我直接说了啊，你告诉豆包给我生成什么样的，比如说动漫女主的图片 啊，什么样的姿势，要求特写，这个很简单哈，特写动漫女主什么样的姿势，然后你可以让他啊，应用不同的服装描述啊，或者是发型啊，或者是这个 啊，表情啊，都可以哈。那么我就让豆瓣给我生成这么几十组图片的提示词哈，要求比中指对镜头特写啊，然后呢，不同的服装，然后最主要的是让他把结果帮你保存到 excel 当中，那么他生成完之后的效果，大家看，就是这样的， 好吧，就是这样的哈， excel 里边一堆提示词，那我们直接就可以来到这个批量管理软件，对吧，这样是吧，导入 excel， 那 么我这个提示词呢，它的起始行号是一啊，列号呢，也是一，对吧？那我就直接添加，我写清空后添加了哈，大家看提示词都进来了， 那这样我直接选择我喜欢的这个 api， 然后点击批量生成就可以了，刚才大家看的那一组呢，就是我生成好的， 大家看啊，这个就是我生成好的，那么生成好之后，我们就可以点击导出啊，这有一个 save， 选择保存，结果起一个名字，那我起的是 demo， 选择确定之后，大家看啊，桌面上这个文件夹当中就有数字编号一到二十这么二十张图片， 好吧，那接下来啊，很简单啊，我们来到 comui， 因为这个工作流程非常简单啊，我就直接说了，不给大家，这个直接给了大家看啊，非常简单啊。首先第一步啊，我们选这个节点叫做批量加载图片系列，好吧，它对应的插件名称是这个 comui 杠 various 好吗？是这个节点哈，然后呢，这个节点的名字叫做 batch load image sequence， 好 吧，批量加载图片哈，那么大家刚开始加载这个节点的时候，它默认是这样的，好吧，中间有一个括号，里边就是我们这个图片的 名称的啊，一个描述，那么这个描述什么意思呢？冒号零六，表示的是六位数啊，六位数字不够的用零补齐，好吧，它里边是这意思哈， 六位数不够的用这个零补齐，那么它针对的是谁呢？大家看啊，我们 cf ui， 这个我是默认生成好的图片，大家看啊， cf ui 默认生成好的图片，大家看是不是这个结构， cf ui 打头下划线五位数字，然后下划线 好吗？然后编辑结尾，那么他这个就是模仿真啊，这样的读取图片的方式哈，那么大家也知道是吧，我啊导出的图片编号是从一到二十，没有那么多补位，也就是没有那么多零是吧，那么怎么去做呢？大家看下边这个， 看这个哈，就是我把图片的路径写好，地盘桌面有一个叫 demo 的 文件夹斜线，然后花括号，花括号里边写一个数字，哎，他就代表着我图片的那个数字啊， 一到二十，他代表就是一到二十，好吧，其实就是个否循环读代码的同学，那么其实编号从哪开始呢？大家看啊，其实编号我可以写从一开始，那么加载多少张呢？加载二十张啊，不存在的，图片忽略，可以点击 yes， 也可以点击啊否， 好吧，这个地方大家看懂了吧，好吧，那么他这么设置完，他的加载图片就是从一一直加载到二十，如果中间没有图片，他就跳过，是这个意思啊，那么大家看啊， 加载完这些图片之后，直接合并为视频，那么视频的帧率大家要注意一下，你不能设置太高啊，太高晃眼睛，我设置是八帧，那么大家看，我运行一下 就是这个效果。好吧，那如果啊，大家不用这个批量管理软件，大家就是用 comui 生成的二十张图片，怎么办？一样啊，大家看这个， 这个就是我刚做的哈，我把 comui 的 图片导到桌面上了，是这样的，它的命名方式不是 comui 下划线，然后五位数字下划线吗？那么大家看我的命名哈。 呃，地盘桌面 demo 二文件夹，然后图片的前缀名是这个 comui 下划线，然后图片中间命名这块，因为它是五位数，大家看啊， comui 导出它是五位数， 对吧？所以呢，冒号，大家看啊，冒号零五 d 表示的是五位数字，不够的用零补齐，好吧，然后图片结束的时候，大家看这个位置 在这里哈，它图片结束的时候还有一个下划线，那么我把这下划线也补上在这呢，好吧，然后点拼音记，那么重点来了哈，大家看我 comui 导出的这个图片，其实编号它是零九啊，零零九九七五一直到零零 九九四，那么他的起始编号就是九七五，大家看懂了吗？然后加载二十张图片，没找到的放弃，好吧，这样呢，大家看好点击运行也是八帧，大家看图片也加载进来了，然后呢，将这个生成好的视频导到剪映当中啊，大家看这个 好，然后呢，我们可以配合后边的一些卡点动漫都行啊，那个就用视频生成就行了，好吧，导入一个卡点音乐，然后选择节拍二哈，选择节拍二，别选择节拍一，因为节拍一的卡点是吧，它那个间距太大了， 是吧？我们要的是这种高动态的卡点，所以选择节拍二。设置好之后，我们导出视频，这里边有一个重点哈，不要 ai 补帧，好吧，各位，因为我们是 每秒八帧生成的图片，如果你这个位置 ai 补帧，它就容易花屏好吗？各位，它就容易花屏，这个位置不要 ai 补帧，点击导出就可以了，最后的效果就是这样了， 好吧，一个小技巧哈。

谁还不会做这种不用抠图的波谱方圆点一个视频教会你。第一步，双击这个快速蒙版，这一步最关键，这里选择第二个选项，找一个揉边笔刷，点一个圆，按住 ctrl 鼠标左键点击图层缩略图， 按一下快捷键。 q， 选择滤镜像素化彩色半调，最大半径是波点的尺寸，下面通道数值改到一样就行。最后一个通道的数值可以不用改， 大家可以去试一下，改到不一样的效果，再按一下。 q， 退出快速蒙版，隐藏当前图层，再新建一个图层， 选一个喜欢的颜色， art 加 delete 填充前景色，或者用油漆桶工具填充，我们换一个背景色看看，完全是不用抠图的，单独的波点。同理，我们拉个图形试试，把图形转为智能对象，或者山格化高斯模糊一下。 接下来就是重复之前的步骤，这里我就不解说了，大家回忆一下之前的步骤，不会的，罚你倒回去再看一遍， 最后改个喜欢的颜色搞定。喜欢的话求关注，我们下期见！

大家都低估了界面的三点一 pro 的 前端能力，现在有这样复杂的网页结构，丝滑动效的网页，它都能够轻松写出来。虽然它的模型能力很强，但你要写的好看还是需要一些技巧的。今天分享三个我常用的思路，教你写出工业级水准的前端。首先不要再给 ai 说好看一点，精致一点了， 我们需要建立基础的设计规范，非常简单。比如你看这个页面，你只需要说来个毛玻璃，它大概会给你弄得灰溜溜的。但如果你明确的说你要玻璃拟态的风格，你看只要明确视觉规范， jimmy 三点一 pro 就 知道这个风格该有的透明度和模糊度，质感就会好很多。 还有就是动效，千万别写酷炫的动画这种词太虚了，你就直接跟他说，告诉他要带弹簧回弹的阻尼感，结果你看这样他写出来滚动的物理惯性手感会非常好。那如果要做那种沉浸式体验的网页呢？别光跟 ai 说沉浸式， 其实这个叫自定义鼠标跟随和卡片展开，这样做出来的网页更接近那种活过来的高级感。好了，我也把这些方法整理成了文档，你可以拿去慢慢学习。

本视频将带您了解如何利用 control 平台对 modata 设备及其内部编辑码板卡实现集中管理。 首先，注册一台 modata 设备。第一步，通过 modata 设备端 web ui 发起注册申请， 在顶部菜单栏中依次点击进入系统设置 control hub 模块，点击注册按钮，在弹出的窗口中依次填写 control hub 邀请码和地 址，点击确定发送请求。第二步，登录 control hub 平台， 在左侧菜单栏中进入设备页面，切换到待审核页签，勾选该设备后点击通过 注册完成后，即可在 modder 页签中查看设备信息、分组和升级固件等操作。 点击右下角在线图标，将直接跳转到该 modit 设备的 web ui 进行远程访问和设置。 点击右侧按钮展开，可以看到该 modit 中插入的所有编辑码版卡的基本信息，包括产品名称、序号以及当前的固件版本号， 可以选择将这些编辑码板卡也注册至 control hub 平台。操作方法为，点击板卡图标，跳转至相应的 web ui， 登录后发起注册申请的方法与 modit 的 方法相同。 同样回到 control hub， 进入设备待审核页签，通过该板卡的注册申请， 随后便能在 modata 页签中直接查看该板卡的在线状态，并通过点击右下角在线图标，直接跳转至该板卡的 web ui 进行远程访问和设置。 如果板卡未注册，仍可在 control hub 查看基本信息，但无法看到在线状态，即直接访问其 web ui， 需通过 modi 设备的 web ui 进行编辑码板卡的管理。 当您在 control hub 平台注册了多个 modi 设备时，可以清晰地看到每台设备内部安装的板卡，方便集中管理。 一个 control hub 账号可注册的 modit 设备和板卡数量取决于您证书授权的设备数量限额。

还在为昂贵的 ai 视频订阅费发愁吗？今天手把手教你用 comfyui 工作流生成超燃 mv， 调用全免费工作流，成本直接打到骨折，效果媲美各大主流平台，支持一键导入现成流，小白也能秒上手。独家提示词生成器，帮你优化文案，多环节工作流一键串联，把时间留给创意， 跟我一起开启 mv 高效创作的新时代！首先打开抖音，找一段自己喜欢的音乐复制链接，然后切换到我的工具的素材，下载梦单，点击下载，下载完后看一下，然后点击分离音频， 听一下分离好的音频， 然后切换到 mv 生成界面，满单输入项目名称。我们这次用的是上传音韵，这个选择也可以自己生成，输入数字人的年龄， 从素材选择刚才下载的音韵，试听下对不对， 也可以自己点本地上传，然后点击通过音频生成分镜，点这个会调用大模型生成分镜数量，分镜时长，分镜图片提示词，分镜视频提示词。 因为我们选单个分镜时长是二十五秒，该音频总时长二十三秒，所以只有一个分镜既可以生成 好了，生成好了，我们看一下这通过音频分来出来的文本是不是对的，该文歌词分离出来是给大模型分析去生成情绪视频风格用的还有图片与视频分镜提示词， 检查一下生成的分镜图片与视频提示词是否满意，如果可以的话，点图片生成好的图片生成好了，检查一下图片是否满意，满意直接点击生成视频 mv。 不过我想用刚才下载数的人物形象进行升图，我们切换到素材下载慢单，选择刚才下载的视频，然后点截取图片，我们再切换到创作工作台，选择第一步 图片预处理，选择刚才截取的图片，选择你要反推的大模型，点击 ai 解析， 然后生成反推的提示词，提示词包括中英双语提示词，然后点下一步升图配置节点，利用刚才的提示词，然后选择好升图的工作流，生成图片， 等待一下生成好了看一下效果，然后切换到 mv 制作慢爷把刚才生成的图片在分镜里上传，图片上传完后点生成视频，等待几分钟，然后看下效果， 正常 mv 会有多个分镜，然后我们把视频剪辑一下，点 final mv 下面的重新生成，可以剪辑分镜转场，生成完了可以看到最终的效 果。然后我再看一下我们之前用自己的数字人图片生成的效果，切换到历史记录，查看下生成的视频，目前所有生成的数据都可以在这里找到。

u i 界面当中用好光的小技巧，首先第一个就丰富层次，你把这个光感直接放在界面当中，它层次嘎一下就起来，包括你像这个也是一样的，你看这会层次少了，把你这个光感的图往上一放，你看看这效果，不嘎一下就有了吗？层次第二个光的作用是啥？就是引导效果，你这会来一束光之后，我直接照在第一名、第二名、第三名上面，这样它整个有个视觉引导，这效果也很不错。 再有第三个作用就是强化质感，你有了光影之后，它对比会强，你看这个就有点平，我光的地方加亮，暗的地方加深，你看看右边嘎一下，它就比左边它看起来更加立体，更有质感。第四个点就是塑造空间感，你可以增加点头影，增加点头影就相当于你加了这个光跟影的这种感觉， 亮的地方更亮，暗的地方更暗，它在界面当中看起来，哎，这小效果是吧？空间感一下拉满。以上这四个点就是光影在 u i 设计当中它起到的作用，你关注蔡老师，我天天给你分享这实战小干货，我告诉你，嘎一下你就厉害。

想学 ai ui 设计，但却不知从何入手？别担心，这期满满的干货教程将为你一次性讲清十款内外常用的设计工具，以及一套从零开始的学习方法。第一款， figma ai， 它是行业内的标准工具，具备强大的 ai 自动拍板功能， 能够轻松生成界面、修改细节。对于新手而言，先学习使用这款工具是最为稳妥的选择。第二款， pixui， 作为国产的专业设计工具，它的 ai 功能十分齐全， 无论是在手机还是电脑上都能流畅使用。其操作简单易上手，非常适合国内的使用环境。第三款，即时设计。 这是一款免费的国产 ai 设计工具，它可以直接根据文字生成页面，对新手来说，用它来练手制作出稿再方便不过了。第四款，磨刀 ai， 它专注于原型交互，能够通过 ai 快 速生成页面并进行跳转演示。如果你需要做产品流程和演示稿， 那么墨头 ai 会是一个不错的选择。第五款，开瓦可化，它拥有丰富的 ai 模板，能够一键完成排版和配色，即使是零基础的新手，也能快速做出完整的界面。第六款，伽罗力 ai， 作为国外专业的 aerei 工具， 只需输入文字，它就能生成高质量的界面，细节和质感都能达到很高的水准。第七款， famerai， 它生成的界面自带交互动效，完成设计后可直接进行预览演示，是进阶学习的必备工具。第八款， wizard， 它可以将手绘草图转化为 ai 界面，非常适合快速输出想法，把灵感转化为可适化的方案。第九款，锐轮锐 i， 它能够一键生成组建库和整套页面系统，无论是做后台、官网还是 app， 都能高效完成。第十款 mechat 你 它主要用于生成视觉风格和创意效果，与其他设计工具搭配使用，能让你的设计瞬间提升档次。想要系统地学会 ai ui 设计，可以按照以下四个步骤进行，第一步，熟练掌握一款主力工具， 扎实打好基础操作。第二步，学习 ai 提示词的使用，学会控制设计的风格布局和颜色。第三步， 荧幕优秀作品，借助 ai 提高效率，再手动对细节进行优化。第四步，完成一套完整的作品集，从手艺到内也形成一个完整的流程。只要根据这套方法学习，即使是零基础的你也能快速掌握 ai ui 设计。

这样就不会影响到之前引用相同变量的文字，这也是 develope 的 一个关键作用。好了，那在这个设计当中，我们要应用的变量我就创建完成了，那现在我是否可以把这些变量直接应用在这些 ui 元素的属性当中呢？答案是不能。 为什么呢？因为这些变量缺乏语义化的名称啊，就是他们无法表达功能或者是意图。举个例子，比如说这个按钮的背景色，我要应用哪一个颜色变量呢？ 这个是没有清晰规定的。那对于我团队中的设计师来说，对于这个变量的应用也会出现同样的困惑。那为了对变量的应用场景进行准确定义，建立标准化的设计资源体系，我们需要引入一个概念， develope。 那什么是抵赞 token 呢？简单来说，它是为设计中的颜色、间距、圆角、半径等基础属性赋于语义化名称，并存储其具体数值的可赋用变量设计与开发，通过这些语义化名称统一调用对应属性。下面来看一下具体的做法。创建一个新的变量合集 命名呢叫做 tokens， 然后为我们需要的属性创建变量，并命名 文字色 primary 颜色，这里我采用的是元素加层级的命名规则。然后在值这里呢，我们选择这个 libraries， 在 这里呢，去引用 primitives 集合里面的值 这个文字的最高优先级的颜色呢，我们用这个 green 十。看到在这个变量里面呢，我们就去引用了另外的一个变量啊，然后我们继续来创建， 然后给它们一个分组，叫做 color text。 接下来容器层颜色， 这个里面我们选择白色 surface 给它拖到跟文本颜色平齐， 下面是按钮颜色 分组 最后一个颜色变量啊，平分颜色， 接下来来创建间距和圆角半径的变量间距和圆角半径这里我用的命名规则是属性加尺码编号的方式， spacing 分 组， spacing 复制一下 radars 命名和值，这个部分呢，我们来改一下，改成圆角半径啊， 这里漏了一个啊，附上值， 现在我使用的这个命名规则只是针对我当前的这个设计，实际的设计工作中，你们可以根据自己的需要去制定更加细致和规范的命名规则啊，不一定要按照我这个来。 接下来呢，我们就可以把这些值应用在卡片上面的这些元素上了。那现在有了这些语义化的命名，我们就对使用哪一个变量非常清楚了，我们来一一给它们赋值。 现在呢，我们就给这个卡片上面的元素的颜色间距以及圆角去赋了这个变量的值。然后我们来看一下啊， 在这个 tokens 集合里面呢，有些变量引用的是相同的变量，比如说这个文本品牌色和这个按钮的主色，它们俩引用的都是这个 blue 六这个变量。那么现在呢，当我去变更这个 这个 blue 六这个色值的时候，按钮和文本的颜色都会跟着一起发生变化。 那如果说我们只想要变更这个按钮的背景颜色呢，就可以单独在按钮背景色这个变量当中去更改它引用的变量， 比如说改成这个，它的变量改成这个， 这样就不会影响到之前引用相同变量的文字，这也是 develope 的 一个关键作用，它既支持通过调整底层变量实现全局更新，也支持通过调整引用关系实现局部控制。