AI探索指南

关于AIGC人工智能、思维方式、知识拓展，能力提升等。投稿/合作： @inside1024_bot
AIGC 领域的最新工具、开源项目以及行业大事件

AI探索指南

  2. AI探索指南

    这里我们可以要求 Claude 用 CDN 引用 TailwindCSS 来写组件样式，Tailwind CSS 封装了一套非常美观和简洁的样式，可以让 Claude 直接调用，确保在色彩、响应式和基础组件的美观度不出大问题

    AI探索指南
    最近很多人问我，为啥我用 Claude 写的应用就没那么漂亮？ 所以教大家一些非常简单的技巧，用上了以后你也能搞定这么漂亮的界面 👇下面是具体的技巧和完整提示词 完整内容这里：https://mp.weixin.qq.com/s/tUOAfd4OI56QxD94-0PPKw 1️⃣第一个技巧： 不用非得用语言来描述你想要的界面样式，可以去一些设计平台找一些你喜欢的设计稿将图片上传到图片让模型参考。 如果你不知道去哪找的话，国内推荐站酷、海外的话推荐 Dribbble 和 Layers。 在跟…
    这里我们可以要求 Claude 用 CDN 引用 TailwindCSS 来写组件样式，Tailwind CSS 封装了一套非常美观和简洁的样式，可以让 Claude 直接调用，确保在色彩、响应式和基础组件的美观度不出大问题。

    🌟提示词：

    方括号［］的部分就是你需要填写的部分。

    我需要创建一个[具体描述你的页面/组件类型]，请帮我生成美观且响应式的HTML+CSS代码。

    ## 设计参考
    我希望设计风格类似于以下参考：
    [上传参考图片或描述设计灵感来源]

    ## 技术要求
    - 请使用HTML、TailwindCSS和少量必要的JavaScript
    - 引用Tailwind CSS（v3.0+）通过CDN
    - 页面需完全响应式，在移动设备和桌面端都能良好显示

    ## 图片资源
    - 请使用Unsplash API提供的图片作为内容图片
    - 根据内容主题选择合适的关键词

    ## 图标要求
    - 使用Font Awesome或Material Icons等专业图标库 (通过CDN引用)
    - 避免使用emoji作为图标替代品

    ## 交互细节
    [描述任何需要的交互动画或效果，例如：]
    - 按钮悬停时有轻微放大效果
    - 表单输入框聚焦时显示渐变边框
    - 卡片在悬停时有阴影加深效果

    ## 特别注意
    - 确保代码干净且有适当注释
    - 提供完整可运行的HTML文件，包含所有必要引用
    - 优化视觉层次和间距，确保设计美观专业

    5️⃣如何生成设计稿：

    昨天群里一个朋友提了一嘴能不能转设计稿想了一下，居然还真可以，而且可以帮你生成带自动布局的 Figma 设计稿和对应可复用的组件。具体的方法也很简单

    只需要将你生成的代码部署到线上，如果你用 Claude 或者 POE 都有这个功能，如果你用的软件没有发布能力的话可以用这个 http://yourware.so 产品。

    获得了线上的链接之后，我们只需要使用 http://html.to.design 这个 Figma 插件就可以很好的将网页转换为

  3. AI探索指南

    最近很多人问我，为啥我用 Claude 写的应用就没那么漂亮？

    最近很多人问我，为啥我用 Claude 写的应用就没那么漂亮？

    所以教大家一些非常简单的技巧，用上了以后你也能搞定这么漂亮的界面

    👇下面是具体的技巧和完整提示词

    完整内容这里：https://mp.weixin.qq.com/s/tUOAfd4OI56QxD94-0PPKw

    1️⃣第一个技巧：

    不用非得用语言来描述你想要的界面样式，可以去一些设计平台找一些你喜欢的设计稿将图片上传到图片让模型参考。

    如果你不知道去哪找的话，国内推荐站酷、海外的话推荐 Dribbble 和 Layers。

    在跟 Claude 说的时候就可以忽略那些不好描述的地方，重点描述静态图片无法表现的部分，比如下面的这个卡片组件。

    我就让 Claude 注意交互的动画和输入框聚焦之后的渐变动画上，界面内容和风格就让他按图片生成。

    2️⃣第二个技巧：

    在让 Claude 生成界面的时候，你会发现 Claude 生成的页面没有图片，本来应该是图片的部分经常是空白的，这个就很影响结果的视觉表现。

    其实我们可以要求他引用一些在线的图片来填充到页面需要图片的部分。

    这里首先推荐 unsplash，他是一个开源图片网站，里面有世界各地的设计大神上传的图片，而且可以直接引用。

    可以看下面加上图片之后的卡片是不是就好看很多了。

    3️⃣第三个技巧：

    另外 claude 在生成页面的时候本来应该是图标的地方，他喜欢用 emoji 来代替，emoji 也很好，但是在一些严肃的页面上就会显得格格不入。

    这里可以要求 Claude 在生成页面的时候引用在线的图标库，比如Font Awesome或Material Icons，这些开源图标库可以通过 CDN 直接引用，而且不需要部署。

    可以看到引用了 Font Awesome 图标库的图标之后我们的界面变得更加简洁和整齐。

    4️⃣第四个技巧：

    我们常用的前端样式代码是用 CSS 写的，但是 CSS 本身的一些样式其实没有太考虑美观度的要求。

    这就导致你让 Claude 写样式的时候他就会过渡自己发挥，美观度也就没办法得到保障，而且你对样式要求多之后他要从头写的 CSS 也就越多浪费很多 Token。

  4. AI探索指南

    AskCodi - AskCodi上可以帮助你完成任何编码工作

    AskCodi - AskCodi上可以帮助你完成任何编码工作
    AskCodi AskCodi上可以帮助你完成任何编码工作

    链接：
    https://www.askcodi.com/

    #Ai工具推荐
    AskCodi
    AskCodi, an AI agency that builds and runs your software
    AskCodi, an AI agency that builds and runs your software
    An AI agency that runs itself. Give AskCodi a goal: the scope comes back in writing, the work arrives for your sign off, and the account stays open after launch.

    Ai工具推荐

  6. AI探索指南

    分享下早上提到的用Cursor+Claude 3.7 Sonnet一段话生成高保真app原型图的提示词，相比我自己前几天写的版本，主要解决了两个问题：1）原来的版本因为试图在一个html文件内生成过多代码，所以容易报错需要多次操作；2）生成的原型图还是不够精美

    分享下早上提到的用Cursor+Claude 3.7 Sonnet一段话生成高保真app原型图的提示词，相比我自己前几天写的版本，主要解决了两个问题：1）原来的版本因为试图在一个html文件内生成过多代码，所以容易报错需要多次操作；2）生成的原型图还是不够精美。

    新的提示词是解决了相关问题，以及同样只需要给Cursor直接发提示词就好了，不需要做任何额外的操作，相对而言比较新手友好。

    👇
    我想开发一个{类似小宇宙的播客app}，现在需要输出高保真的原型图，请通过以下方式帮我完成所有界面的原型设计，并确保这些原型界面可以直接用于开发：
    1、用户体验分析：先分析这个 App 的主要功能和用户需求，确定核心交互逻辑。
    2、产品界面规划：作为产品经理，定义关键界面，确保信息架构合理。
    3、高保真 UI 设计：作为 UI 设计师，设计贴近真实 iOS/Android 设计规范的界面，使用现代化的 UI 元素，使其具有良好的视觉体验。
    4、HTML 原型实现：使用 HTML + Tailwind CSS（或 Bootstrap）生成所有原型界面，并使用 FontAwesome（或其他开源 UI 组件）让界面更加精美、接近真实的 App 设计。
    拆分代码文件，保持结构清晰：
    5、每个界面应作为独立的 HTML 文件存放，例如 home.html、profile.html、settings.html 等。
    - index.html 作为主入口，不直接写入所有界面的 HTML 代码，而是使用 iframe 的方式嵌入这些 HTML 片段，并将所有页面直接平铺展示在 index 页面中，而不是跳转链接。
    - 真实感增强：
    - 界面尺寸应模拟 iPhone 15 Pro，并让界面圆角化，使其更像真实的手机界面。
    - 使用真实的 UI 图片，而非占位符图片（可从 Unsplash、Pexels、Apple 官方 UI 资源中选择）。
    - 添加顶部状态栏（模拟 iOS 状态栏），并包含 App 导航栏（类似 iOS 底部 Tab Bar）。
    请按照以上要求生成完整的 HTML 代码，并确保其可用于实际开发。

    如果你对这套提示词是怎么迭代写出来的感兴趣，尤其是为什么我不会写代码为啥提示词里能表述这么多编程专业词汇，你可以看看这篇文章：https://mp.weixin.qq.com/s/xbFqY9DwTwwZskgBmeqAxA

  8. AI探索指南

    104: 3700次预训练寻找非共识，MiniMax-01开发者讲述4年线性注意力之旅 - 晚点聊 LateTalk

    104: 3700次预训练寻找非共识，MiniMax-01开发者讲述4年线性注意力之旅 - 晚点聊 LateTalk

    上期，聊了稀疏注意力。这期，聊注意力机制的另一大改进方向：线性注意力。嘉宾是 MiniMax 高级研究总监，负责 MiniMax-01 模型网络架构的钟怡然。他开发了 1 月中旬开源的 MiniMax-01 中使用的线性注意力架构。

    怡然在 2021 年线性注意力还是“美好的泡泡”时就开始关注它的实现。这我一个 AI 研究者关注与投入小众方向的过程。

    （本期因录音 bug，音质不太好，有波动，不时出现“变声期”，请见谅。）

  9. AI探索指南

    经常被问到平时都用什么 AI 工具，于是整理了一下我和 @海辛Hyacinth 在工作流中常用的工具合集

    经常被问到平时都用什么 AI 工具，于是整理了一下我和 @海辛Hyacinth 在工作流中常用的工具合集。

    *由于工具迭代太快，本条将永久动态更新。
    *都是我们做项目用的工具，你永远可以相信我写的推荐。

    🖼️🖼️ 主力生图工具
    ▶ Whisk & ImageFX（也就是 Google 家的 Imagen3）
    写实风格能达到以假乱真的程度，而且还免费。

    ·

    🖼️ 辅助生图工具
    ▶ midjourney：曾经的王者，但用过 Whisk 之后用不回去了，希望 V7 加油。
    ▶ 即梦：如果你需要生成中国风和中文字，这是最好的选择。
    ▶ Flux：开源最佳，适合搭配 ComfyUI 工作流使用。

    ·

    🎨 修图工具
    ▶ PS 的创成式填充：虽然生图很拉，但缝缝补补很合适。
    ▶ Krea 的编辑器：其实就是 Flux 的局部重绘，但前端交互做得超好。
    ▶ MJ 的编辑器：常用的是 Retexture，局部调整不推荐。
    ▶ 个人忠告：抠局部细节的时候还是直接P吧。因为当生成区域小到一定程度时，inpainting 对关键词的响应就会极弱，与其浪费时间抽卡，真的不如直接上行活。

    ·

    🔍放大工具
    ▶ 图片放大用 Maganific & Krea：老实说 Maganific 用多了其实也没那么好用，Krea 更经济实惠。
    ▶ 视频放大用 Topaz。

    ·

    📽️ 视频生成工具
    ▶ 目前我们用得最多：可灵 & Pixverse
    ▶ 风格化场景我们用：Hailuo
    ▶ 创意特效我们用：Pika
    ▶ 转绘我们用：ComfyUI

    ·

    🐋 我们在哪用 DeepSeek？
    ▶ 我用 ima
    ▶ 海辛用官方app 和 元宝

    ·

    其他想到再补充。

  10. AI探索指南

    在 GitHub 上发现一款实时语音转文字工具：WhisperChain

    在 GitHub 上发现一款实时语音转文字工具：WhisperChain。

    让语音秒变正式文档，真正实现"开口即成章"。

    主要是能自动优化语言表达，去掉口头禅，让内容更加流畅、正式，非常适用于会议记录、写作辅助、语音笔记整理等场景。

    核心功能
    - 实时语音转文字
    - 自动润色文本
    - 自动复制到剪贴板
    - 全局快捷键录音
    - 简洁的网页界面

    GitHub：https://github.com/chrischoy/WhisperChain

  11. AI探索指南

    Hocoos - 推荐！无代码AI智能在线快速创建网站

    Hocoos - 推荐！无代码AI智能在线快速创建网站
    Hocoos 推荐！无代码AI智能在线快速创建网站

    链接：
    https://hocoos.com/

    #Ai工具推荐
    Hocoos AI
    Hocoos AI Website Builder - Create Your Website in 5 Minutes
    Hocoos AI Website Builder - Create Your Website in 5 Minutes
    Create professional websites in seconds with Hocoos AI website builder. Get all the sales and marketing tools to start & grow your online business now.

    Ai工具推荐

  12. AI探索指南

    AI探索指南
    字节在今天终于发布了Trae的国内版本 可以直接从国内下载使用，依旧免费！ 这也是国内首个AI原生IDE，界面是中文，而且针对国内常见的开发方式做了优化，更懂中国用户。 👇下面是详细的功能介绍和入门教程： Trae功能特性详细介绍： Builder模式自动化开发能力 ——AI 自动化执行任务，端到端生成 Context深度理解能力，代码仓库级理解，深度理解 IDE 内信息，# 指定上下文 补全能力—— 实时续写和预测 一键 apply，快速修改和应用 对话式开发，版本随时回退（非常有安全感） 免费…

  13. AI探索指南

    字节在今天终于发布了Trae的国内版本

    字节在今天终于发布了Trae的国内版本

    可以直接从国内下载使用，依旧免费！

    这也是国内首个AI原生IDE，界面是中文，而且针对国内常见的开发方式做了优化，更懂中国用户。

    👇下面是详细的功能介绍和入门教程：

    Trae功能特性详细介绍：
    Builder模式自动化开发能力 ——AI 自动化执行任务，端到端生成
    Context深度理解能力，代码仓库级理解，深度理解 IDE 内信息，# 指定上下文
    补全能力—— 实时续写和预测
    一键 apply，快速修改和应用
    对话式开发，版本随时回退（非常有安全感）
    免费使用，不像其他的类似软件需要付费
    支持Mac和Windows全平台

    写了一篇比较详细的入门教程，如果你对这类软件完全没认知可以看看：https://mp.weixin.qq.com/s/NMOG5ZuhmryxJZIiEJLRvw
    也可以直接在这里下载：http://trae.com.cn/?utm_source=content&utm_medium=vx_kol&utm_campaign=guizang

    还用 Trae 国内版试了一个复杂的前端效果实现，改了一次就成了，第一次没对齐。
    提示词在图里

    另外Trae 不止可以用来写代码，当本地知识库也是挺好的，这里是之前的教程：https://mp.weixin.qq.com/s/3mlhd5lRBSz3t8NSR8o3yg

    不要觉得自己没有写程序的能力或者需求就不接触Trae这类AI IDE。

    很多小需求小工具我们日常工作中都需要，AI编程不是非要写一些大的项目和完善的产品，更可以帮你解决日常工作中非常繁琐的一些小工序和小事。

    慢慢的我们每个人都会有一套自己的AI工具集，毕竟你的需求只有你自己才清楚，你自己写的工具也不会上一些垃圾功能和收费功能来恶心你。

    简单的试一试，门槛真的很低。