楼主是后端开发,设计白痴,一点不懂美学,没有任何审美
前端仅限知道 js 语法,css 语法,如果有设计图,自己也能搓出来页面。
最近让 AI 做了几个 HTML 页面,真的丑到爆炸了,交互也很奇怪,
请教各位,有啥方法能快速培养审美(用 AI 也行)。
或者先让 AI 弄几个设计,从中选一个,然后根据设计产出页面
有啥好方法推荐或者分享吗,求指导
1
radishzz 5 天前 ![]() 审美是靠累积的,很难速成。
你急着做出好看的页面的话,直接找点好看的网站模板,截图发给 ai ,然后让它总结设计风格。你觉得没问题,再让他开始做就行了。 推荐几个网站: https://www.framer.com/marketplace/templates/?sort=popular&period=all https://www.inspo.page/ https://www.awwwards.com/inspiration_search/?text=template |
![]() |
2
easychen 5 天前 ![]() 在提示词中让 ai 使用 tailwind css ,设计高端大气时尚的某某网页试试。交互没辙,都自己慢慢让它改…
|
3
walterggg 5 天前 via iPhone
我大学是学环境设计的,我也觉得 ai 排版很丑,但有时候也出乎意料,可以在自己卡住的时候快速出方案,这对我帮助很大,网上的设计素材很多,我就是多翻看同行的网站设计,有序的拼接到一起,我的网站参考了野卡、奈飞小铺、gamsgo 、appstore ;设计能力和技术都有限,用最小的技术去满足自己能接受的排版,没有推广的意思,地址: https://ipinpin.store
|
4
walterggg 5 天前 via iPhone
还有 surfsharkvpn
|
5
yyysuo 5 天前
都是有现成的 abc 让你选的,自己不需要审美。
|
![]() |
6
CHTuring 5 天前 ![]() ## 方式一
1 、打开 https://v0.app/ 这个网站 2 、拉动滚动条 From the Community 这个栏目 3 、学习别人是怎么写提示词的 ## 方式二 1 、打开 https://ui.shadcn.com/ 这个网站 1 、AI 生成的时候提示词加入 Shadcn UI 风格 |
7
Danswerme 5 天前
|
![]() |
8
leverestfish 5 天前
@Danswerme #7 同问
|
![]() |
10
huangzhiyia 5 天前
用苹果全家桶
|
![]() |
11
bearbest 5 天前
我的个站前段时间刚用 AI 重构了所有 UI ,感觉还行吧,可能是提示词需要优化一下?可以多了解一些绘图的提示词
|
13
iamtuzi3333 5 天前
一样,后端 ai 写的还可以,就是页面确实难绷
|
![]() |
14
kuqma98 5 天前
用 Claude ,先让大模型写设计需求,会包含 UI 设计和细节,再用设计需求让大模型写前端。
|
![]() |
15
pytth 5 天前
豆包写的 ui 默认用了 TailWindCSS
|
![]() |
17
Heimo 4 天前
上一次写前端还是在七八年前,对现在前端技术栈基本脑袋空空,最近刚好在用 cursor 从 0 到 1 写一个前端应用,我的一些经验
0. 准备工作,找个喜欢的项目,把连接丢给它让它分析下技术栈,用作参考,提出项目的使用场景等基础信息让它推荐技术栈,在这个基础上 1. 设计依赖库和原则,可以写入.mdc 文件设置为 always 2.1. 指定核心依赖库(需要指定版本,AI 的记忆没那么新) - CSS 框架,比如 TailWindCSS - UI 库及主题,比如 heroui (基于 TailWindCSS 的 UI 库),主题会帮你设计好全局的颜色,圆角,边框宽度,不透明度等,能省很多事 https://www.heroui.com/themes - 字体 - icons ,比如 heroicons 2.2. 开发原则 ``` 禁止使用原生 HTML CSS JS 开发布局、样式、交互、组件,必须使用 tailwindcss 及 heroui ,heroicons 依赖库 UI 组件必须考虑复用性、样式一致性,确保风格统一 ``` 设定好开发规范之后 在提示词中指定好用 UI 库的什么组件做什么功能,组件的开发文档连接丢给它让它写代码之前看下文档,基本的提示词就可以保证样式统一,还方便维护 另外,heroui 文档也有 ai ,找不到合适的组件,可以问文档的 ai ,拿着答案和文档连接再丢给 cursor 让它自己去看 本质上思路就是管理好注意力和上下文,提高提示词的信息密度 |