今天我们来尝试使用无代码编程的方式，设计一款具有三国杀主题和像素风格的角色卡牌游戏。
第一步：使用 Deepseek 进行初步设计与信息生成
我们首先利用 Deepseek AI 模型，根据以下提示词（参考网上网友的思路）来生成卡牌角色的基本信息和设计概念。
“请帮我设计一系列像素风格的游戏角色卡牌，模仿参考图片的游戏角色卡牌设计案例，设计一系列《三国杀》主题的像素风格游戏角色卡片。要求卡片保持像素风格的特点，并融入了中国三国时期的元素，包括角色穿着汉服、铠甲或符合时代的服饰；卡牌中的角色信息（如角色名、势力、体力、技能名及描述）要用中文呈现。接下来，继续为我设计更多不同身份或特点的三国风格角色卡片，形成一个系列。设计以下角色：1.屯田兵 （对应邓艾 - 强调后勤）2.男运粮官 （对应程昱 - 强调运输）3.军中医师 （对应华佗）4.锦帆水贼 （对应甘宁）5.铸剑匠 （对应蒲元）6.行商贾人 （对应张世平）7.庖厨 （对应厨师/美食家）8.谋士 （对应诸葛亮）9.宫廷舞姬 （对应貂蝉）10.水战都督 （对应周瑜）11.攻城都尉 （对应关羽-转为军事工程职能）12.轻骑兵（对应吕布）13.虎豹骑（对应曹纯）”
Deepseek 根据提示词反馈了各个角色的设定信息，包括名称、势力、体力值以及技能描述等。
第二步：使用 AI 生成 HTML 卡牌页面
接下来，我们要求 AI 根据上一步生成的信息，使用 HTML 来实现这些卡牌的可视化页面。
“根据上面信息使用HTML页面实现各个上述卡牌”。
初次生成的代码运行后，效果可能并不完美，例如卡牌上的文字和素材可能没有完整显示。这时，我们需要对提示词进行修正和迭代。
修正后的提示词可能如下：
“修改如上代码：文字和素材没有在卡片上完整的显示，请修正后重新输出一个完整的HTML”。
经过修正后，卡牌的显示效果得到改善，但可能仍然缺少关键的卡牌图像。
第三步：使用 Gemini 进行设计与 SVG 图像生成
我们尝试使用 Google Gemini 模型，并输入与 Deepseek 相同的初始提示词。Gemini 的输出也可能存在类似的问题，即生成的卡牌缺少图像。
为了解决图像缺失的问题，我们尝试引导 Gemini 使用 SVG (可缩放矢量图形) 来设计卡牌上的图像元素。输入新的提示词：
“修改如上代码：图片元素可以使用SVG设计，需要根据卡片内容和特性进行相应SVG图片的设计，补充完整卡片图片后输出一个完整的HTML”。
Gemini 根据这个思路生成的卡牌页面效果，包含了 SVG 绘制的像素风格角色图像，整体效果更佳。
第四步：使用百度 Comate 进行对比
最后，我们使用百度的 Comate AI IDE，输入相同的初始提示词进行测试。
经过多次优化尝试，Comate 在本次测试中未能正确生成包含图像的卡牌页面，其效果相对较弱。当然，这可能与特定模型的训练数据、对提示词的理解方式或当前版本的能力有关，不排除通过其他方法或更精细的调优可以实现更好的效果。
总结： 比较下来，Gemini 在结合 SVG 生成卡牌图像方面的表现相对更出色。
补充知识：无代码编程方式设计卡牌游戏
近年来，无代码编程 (No-Code Development) 工具的兴起，为那些即使没有深厚编程知识背景的人们也提供了设计和开发自己游戏的机会。以下是如何利用无代码方式设计卡牌游戏的一些关键方面：
一、确定基础设计
- 明确主题和类型：
首先要确定卡牌游戏的主题（如奇幻、科幻、历史、三国等）和核心类型（如角色扮演、策略对战、卡牌收集与交换等）。同时，要考虑目标受众的年龄和喜好。 - 规划游戏机制：
定义核心玩法规则，例如是回合制还是实时对战，如何判定胜负条件（消灭对方所有卡牌、达成特定目标等）。 - 构建故事背景：
一个引人入胜的故事背景、独特的世界观以及鲜明的角色设定，可以大大增加游戏的趣味性和代入感。
二、无代码工具选择
市面上有许多专为游戏开发（包括卡牌游戏）设计的无代码或低代码平台，各有特点：
- GameSalad：
基于可视化拖放界面，内置丰富的行为和属性模块。拥有素材库和活跃社区，支持快速搭建游戏原型，并能发布到多个平台。适合初学者快速实现创意，制作相对简单的卡牌游戏。 - Buildbox：
强调快速创建游戏，操作界面简单易用。支持通过简单的逻辑设定实现基本的卡牌交互（如拖动、出牌、弃牌等）。适合快速验证游戏概念和开发可玩原型。 - Stencyl：
提供积木式的编程界面，通过拼接代码块来构建游戏逻辑。有丰富的模板和教程，降低了学习门槛。适合希望深入理解游戏逻辑和实现细节，但编程基础薄弱的开发者。 - 其他通用无代码平台：
一些通用的无代码应用搭建平台（如 Bubble, Webflow, Glide 等）虽然不专为游戏设计，但也可以通过其逻辑引擎和数据库功能，构建出具有卡牌展示和基本交互逻辑的应用原型。
三、卡牌设计
视觉设计
- 色彩搭配：
选择符合主题的色彩方案，增强视觉吸引力，建立统一的视觉体系。 - 图像选择：
使用高质量的图像和插图，确保与卡牌功能和主题相符。可以自行绘制、使用 AI 生成，或从授权资源库选择。 - 排版设计：
确保卡牌上的文字信息（名称、描述、数值等）清晰易读，字体、大小、颜色与背景形成良好对比。
内容设计
这是卡牌游戏玩法的核心，需要为每张卡牌设计清晰且相互关联的内容元素：
- 卡牌名称：
独特且能反映卡牌特性或角色。 - 卡牌类型：
根据游戏机制分类（如角色卡、技能卡、装备卡、事件卡等）。 - 属性值：
为不同类型的卡牌设定相应的属性（如攻击力、防御力、生命值、消耗、持续时间等）。 - 特殊能力/技能：
为卡牌赋予独特的效果或与其他卡牌组合产生联动，增加策略深度和趣味性。
布局设计
规划卡牌在游戏界面中的排列和展示方式，影响玩家的操作体验和视觉感受：
- 网格布局：
适合展示大量卡牌，如卡牌库、商店界面。 - 堆叠布局：
模拟手牌、牌库、弃牌堆等，营造真实感。 - 侧边栏/焦点布局：
用于展示当前选中卡牌的详细信息。
四、功能设计
使用无代码工具提供的事件处理、条件逻辑、变量和数据管理等功能，为游戏添加交互逻辑：
- 核心交互：
实现抽卡、出牌、弃牌、卡牌效果结算、回合轮转、资源管理等核心操作。 - 选择目标与进攻：
允许玩家在战斗中选择攻击对象和方式。 - 反馈系统：
提供清晰的战斗信息反馈（伤害数值、状态变化等）和操作反馈（点击音效、视觉提示等）。
五、测试与优化
- 游戏平衡性测试：
确保没有过于强大或弱小的卡牌，保持游戏的公平性和策略性。 - 玩法流畅性测试：
检查游戏节奏是否合理，操作是否顺畅，规则是否易于理解。 - 收集反馈并迭代：
邀请他人试玩，收集反馈意见，持续对游戏进行优化和完善。
六、发布与推广
完成开发和测试后，可以将游戏发布到相应的平台（如 Web、移动应用商店等）。同时，利用社交媒体、游戏论坛等渠道进行宣传推广，吸引玩家。
需要更多免费AI工具、最新Ai信息、详细使用和丰富Ai教程、Ai变现方法的小伙伴可以加入 路上侠客的知识星球！
一年会员，原价199元，现在只需 99元！
