返回顶部
热门问答 更多热门问答
技术文章 更多技术文章

这套提示词,帮你快速解锁Gemini 3 Flash前端设计能力

[复制链接]
链载Ai 显示全部楼层 发表于 昨天 17:13 |阅读模式 打印 上一主题 下一主题
Google今天凌晨发布的Gemini 3 Flash模型还挺特别的。
大家都知道这个比Gemini 3 Pro更快、更便宜的模型不会在中午发布(因为早晚会来😜
但是让人没意识到的是,这个新模型确实比Pro版本便宜75%,速度比Gemini 2.5 Pro快3倍,但让人没想到的是,这个低价快速,理论上该是从Pro蒸馏的模型怎么特么那么强??
大多数指标上都和Gemini 3 Pro都相差无几,甚至。。。还更猛了。
这就有点离谱了,我查了所有Google的发布文档也没看出这个更强的逻辑是什么,但不管如何,能用上一个更快更便宜的,尤其是Coding能力上很强的模型总是值得高兴的。
不过,因为大模型被训练语料里的一堆垃圾网页污染,在默认情况下,你用任何模型可能都是生成蓝紫色调的AI感满满的网页。
为了解决这个问题,我之前给大家做过一套生成更出色设计感网站的提示词,我发现这套提示词和Gemini 3 Flash尤其搭配,你大概30秒就可以抽卡获得以下任何一种效果。
提示词如下,去试试吧,稍微改一下提示词要生成什么网站的需求就可以了👇
#1.你的任务##1.1目标描述-根据我的描述,帮我创建一个设计出色,内容丰富,用户体验友好的网站。-网站主题:{把你的需求写在这里}#2.工作流程##作为具有20年经验,在Apple、Google、facebook等顶级企业工作,比乔布斯、张小龙更出色的产品经理执行工作###2.1.1采用逆向工作法,先撰写1000字深入思考过产品的PRFAQ###2.1.2需求洞察,穿透用户表述,补齐显性与隐性需求,形成完整需求清单:功能、用户角色、使用场景、核心任务路径、边界与异常、数据结构。###2.1.3结构输出PRD文档,明确目标用户,功能,优先级(MoSCoW),绘制信息架构草图(站点地图与任务流)。##作为具有20年工作经验,在Apple以及顶级设计咨询企业工作过的设计师执行工作###2.2.1执行设计灵感采样-任务说明:请借鉴艺术家/建筑师/工业设计师的"风格与感觉",进行提炼与融合后改造网站视觉与交互。-仅借鉴气质与方法,禁止临摹或再现具体作品。-从"灵感来源池"中随机采样2位-每位灵感需给出"灵感→网页实现"的转译说明-灵感来源池:SaulBass,MauriceBinder,PabloFerro,DanPerri,KyleCooper,PaulaScher,NevilleBrody,AprilGreiman,DavidCarson,JamieReid,PushPinStudios(SeymourChwast),MassimoVignelli,JosefMüller-Brockmann,OtlAicher,ArminHofmann,KarlGerstner,MurielCooper,PietMondrian,SoniaDelaunay,JosefAlbers,VictorVasarely,BridgetRiley,M.C.Escher,PaulKlee,KazimirMalevich,JoanMiró,HenriMatisse,MarkRothko,RenéMagritte,SalvadorDalí,YayoiKusama,TakashiMurakami,KatsushikaHokusai(葛饰北斋),XuBing(徐冰),ZaoWou-Ki(赵无极),JohnMaeda,CaseyReas,ZachLieberman,VeraMolnár,ManfredMohr,RefikAnadol,SougwenChung,ZahaHadid,BjarkeIngels(BIG),ThomasHeatherwick,OlafurEliasson,LeCorbusier,LudwigMiesvanderRohe,FrankLloydWright,AlvarAalto,LouisKahn,NormanFoster,RenzoPiano,Herzog&deMeuron,OMA/RemKoolhaas,TadaoAndo(安藤忠雄),SANAA(Sejima&Nishizawa),KengoKuma(隈研吾),KenzoTange(丹下健三),LinaBoBardi,LuisBarragán,DieterRams(Braun),JonyIve(Apple),NaotoFukasawa(无印良品),JasperMorrison,MarcNewson,YvesBéhar,HartmutEsslinger(frog),RaymondLoewy,RichardSapper(ThinkPad),Charles&RayEames(EamesOffice),SoriYanagi,KenjiEkuan(龟甲万壶/新干线语义),Nendo(OkiSato),PhilippeStarck,F.A.Porsche(PorscheDesign),JamesDyson,TeenageEngineering(JesperKouthoofd),SusanKare(界面图标语义)####转译而非模仿(必须遵守)-版式:非对称分栏、超大标题、网格秩序与"破格"、分镜式章节标题-色彩:高对比撞色、三原色几何、工业警示条、渐变/光散射-形态:曲线切割、体块叠合、模块化卡片、纸感与细微纹理-动态:200–300ms的入场/勾勒/滚动反馈;支持`prefers-reduced-motion`的静态回退-语义:极简图形符号、变量字体轴(字重/宽度小幅过渡)、数字/指标的等宽排版-不复刻具体作品的构图、配色、字体组合、标语或品牌元素-不生成与原作高度相似的页面布局或元素组合###2.2.2交互与视觉方案,基于"网站前端设计原则",输出可交付方案:页面结构、组件清单、状态说明(默认/悬停/激活/禁用/错误/空态/加载)、可访问性与动效规范、响应式断点策略。###2.2.3设计系统,给出色彩、字体、栅格与间距系统(DesignTokens),文字描述2–3个关键页面线框。##2.3作为出色的前端工程师完成前端设计,交付代码###2.3.1前端设计基础原则-在理解需求与设计规范基础上,交付完整的HTML/CSS/JS代码。###2.3.2组件化与增强-将复杂交互抽象为可扩展组件(卡片、表格、图表区、导航、表单),遵循渐进增强。###2.3.3前端代码要求-使用HTML5语义结构:header、main、aside、section、nav、footer;标题层级正确。-通过CDN引入GoogleFonts(示例:Inter),并提供中英文混排备用字体栈。-使用FontAwesomeCDN提供图标(或见第5章选用SVG图标库方案)。-三断点响应式;可点击区域不小于44×44px;表格与图表具备小屏策略。-需要图片时必须给出实际链接,不留空白占位:-Picsum:https://picsum.photos/(示例:https://picsum.photos/id/157/800/600)-必备meta:viewport与color-scheme。###2.3.4.主题与风格偏好-色彩与可读性:避免常见的千篇一律紫色或纯蓝主色,优先选择更具辨识度的中性色或高品质品牌色方案,并保持对比度与可读性达标。-内容表现:避免使用emoji!!!当需要图标时,可以生成独特设计的svg图表,或者从引入以下图标库:Lucide、Heroicons、TablerIcons-避免留下任何空白的占位符,该出现图片的地方都应引入开源图片资源

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

链载AI是专业的生成式人工智能教程平台。提供Stable Diffusion、Midjourney AI绘画教程,Suno AI音乐生成指南,以及Runway、Pika等AI视频制作与动画生成实战案例。从提示词编写到参数调整,手把手助您从入门到精通。
  • 官方手机版

  • 微信公众号

  • 商务合作

  • Powered by Discuz! X3.5 | Copyright © 2025-2025. | 链载Ai
  • 桂ICP备2024021734号 | 营业执照 | |广西笔趣文化传媒有限公司|| QQ