DeepSeek+AI编程，设计AI工具导航网页

AI工具越来越多

经常有学友跑来问：写作用什么AI工具，搜索用什么AI工具……

前几天，我们分享了一篇介绍AI提效工具的文章。

也把对应的教程，在学友群里给部分学友做了分享。

但是，总感觉用起来还不是特别方便。

我们的教程里，详细的把每个工具的使用入口，都分享给大家了，目的就是希望大家在实际学习和工作中，能够把AI用起来，用AI来提效。

工具有了，教程也有了

目前是分享了10个工具，随着AI工具的快速更新，未来肯定还会有更新的工具，进入我们的日常使用中。

这就带来了一个新问题，工具太多了，找起来有点麻烦啊。

于是，我们着手设计了一个AI提效工具导航网页。

虽然，我不是很懂网页前端开发，但是我会使用DeepSeek，借这个机会，正好试试DeepSeek的V3最新版，在代码开发方面的能力。

先看下AI提效工具导航网页效果

有了这个AI工具导航，感觉瞬间清晰明了了，再来找AI工具，就直观方便多了。

虽然，之前我也用过网上的几个AI工具导航网，但是，给我的感觉是，工具太多了，太杂了。很多工具，还没法直接访问，需要魔法。有的工具，又没使用过。

作为日常学习和工作中使用AI，经常用的主要就是自己熟悉的那么几款工具。工具太多了，反而感觉不方便用。

基于我们日常办公的场景，以及个性化的使用需求，我决定自己动手设计一个AI提效工具导航

这个AI提效工具导航，里面所有的工具，都是我们之前文章中分享和实测使用过的。

而且，我进一步，按照使用场景，做了分类，分成了：

AI搜索、AI写作、AI PPT、AI编程、AI数据分析、综合性AI工具。

这个分类，也和我们之前写的教程里的分类保持了一致。

点击网页上的某个工具卡片

就可以直接唤起和进入具体的工具网页里，感觉非常方便。

具体的设计方法，简单介绍一下，你也可以结合我接下来介绍的方法，自己去修改网页、制作出属于自己的个性化AI工具导航。

总结下来，有三个步骤：

1. 写好提示词
2. Deepseek生成网页代码
3. 将导航网页添加到浏览器

具体如何做？来一起看实操演示过程

1、写好提示词

这里，我们可以提前准备好需要导航网页里，要展示哪些分类，哪些工具。

然后，打开腾云元宝，将网址复制到元宝对话框中，并写好提示词。

我们提示词这样写的：

这样写好后，直接发送给元宝，并且AI模型选择DeepSeek V3

这里注意，在元宝里，不选中R1.深度思考的情况下，是默认调用V3-0324最新版的。

2、DeepseekV3 生成网页代码

接下来，元宝里的Deepseek，就开始根据提示指令，生成整个导航网页的代码。

代码生成完成后，直接可以点击代码片段右上角的【运行】，快速查看效果。

这个，我们在之前的文章中，也给学友们分享过，新版的腾讯元宝，支持在线预览html格式的代码。

有一说一，国产AI的这些功能设计，确实是越来越方便了。

初版的导航页出来后，接下来，我们可以根据自己的需要，去修改调整代码。

比如，这里我想重新分类，就把分类需求告诉Deepseek，AI重新修改代码，并生成新的代码：

设计开发，本就是一个不断修改，调试的过程。所以，建议大家，多尝试。

网页代码修改调试后，就是把定版的导航网页，保存到电脑本地。

这里注意，保存为.html格式

保存下来，是一个文件夹，导航网页就包含在里面。

3、将导航网页添加到浏览器

最后，可以将导航网页，添加到浏览器中，方面我们随时调用。

这里，我们以常用的豆包浏览器为例：

将第2步中，下载下来的导航网页，在豆包浏览器中打开：

然后，点击豆包浏览器右上角的收藏按钮：

就可以将AI提效工具导航网页，收藏到浏览器的书签栏里。

下次需要使用AI提效工具导航的时候，只需要点一下按钮就出来了：

这样，经过以上三步，一个属于自己的AI提效工具导航就做好了。

我们设计的这个AI提效工具导航，主要是收集了国产AI工具中好用的办公提效工具。

全套网页代码，我已放在学友群和知识库里，需要的学友，可以到学友群领取。

不得不说，现在的国产AI，在我们广大科技工作者的努力奋进中，功能越来越强，体验上越来越好用。

这两天，看到海对岸发起的关税霸凌，有网友担心，这会不会影响到我们国产AI前进的脚步？

这里，我想说，可以非常自信的说，这不仅不会阻断国产AI前进的步伐，而且会激励更多的科技工作者，创造更多、更先进、更好用的国产AI工具，为我们以后美好的经济、社会生活服务。

眼下，我们每个人要做的，就是干好自己的事，支持和拥护祖国。用好AI工具，提升自己的学习和工作效率，提升自己使用AI的能力，和祖国站在一起，团结在一起，争取伟大的胜利。

相信，胜利终将属于我们！