> For the complete documentation index, see [llms.txt](https://doc.playturbo.cn/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://doc.playturbo.cn/playturbo-an-li-jiao-xue-ji-di/ke-wan-zi-you-bian-ji-qi-an-li/pao-ku-wan-fa-an-li/zuo-you-xuan-ze-pao-ku-mu-ban-zi-you-zhi-zuo.md).

# 《左右选择跑酷》模板自由制作

## <mark style="color:blue;">**一、对比展示**</mark> <a href="#aluje" id="aluje"></a>

我们先来看一下使用**模板自由制作**前后的对比：[迭代前](http://tinyurl.com/yc7c3hh8) VS [迭代后](http://tinyurl.com/4wtn5nap)

<figure><img src="/files/Ziil5aFvsV4tXLMdli3O" alt=""><figcaption></figcaption></figure>

## <mark style="color:blue;">**二、迭代内容概括**</mark> <a href="#zxvfg" id="zxvfg"></a>

模板迭代后的改动，主要在以下几方面：

#### 1.资产替换与新增 <a href="#yjysk" id="yjysk"></a>

1）替换资产——序列帧/静帧图片/文本

2）隐藏资产——原模板为网赚类型，迭代后我们隐藏了网赚相关元素

3）新增资产——场景1新增光芒图片；场景2新增一个跳转按钮

#### 2.动画设置 <a href="#hndzz" id="hndzz"></a>

新增动画——为第二个序列帧球和光芒图片增加退场动画；为场景2的跳转按钮增加缩放动画

#### 3.事件设置 <a href="#ylidl" id="ylidl"></a>

新增事件——在场景1原有事件下新增第二个序列帧球消失的响应事件；为场景2的跳转按钮增加跳转事件

#### 4.多语言翻译 <a href="#cs5zi" id="cs5zi"></a>

将修改及新增后的文本翻译为多语言版本，并微调格式

#### 5.横屏适配 <a href="#gqxtf" id="gqxtf"></a>

对新增资产的横屏排版适配进行调整

## <mark style="color:blue;">**三、迭代内容详解**</mark> <a href="#ypqot" id="ypqot"></a>

接下来，我们将配图详细介绍每一个步骤

### 1.资产替换与新增 <a href="#aqu3j" id="aqu3j"></a>

#### 1）替换资产

注：【替换资产】这一步骤有两种方式可以选择，具体可查看[/pages/uHxCxmIowjNVmk0rKxsz#id-1.-zi-chan-ti-huan-ji-qiao](https://doc.playturbo.cn/playturbo-an-li-jiao-xue-ji-di/ke-wan-zi-you-bian-ji-qi-an-li/pao-ku-wan-fa-an-li/pages/uHxCxmIowjNVmk0rKxsz#id-1.-zi-chan-ti-huan-ji-qiao "mention")

在本案例中，我们选择先使用【换肤编辑器】完成所有资产的替换，再【复制到自由制作】完成后续迭代。首先，选中模板，选择【换肤制作】 - 【普通制作】

<div align="left"><figure><img src="/files/Tu7aETYxqBmKyEPHDoNb" alt="" width="563"><figcaption></figcaption></figure></div>

<mark style="background-color:red;">1-1）图片资产</mark>

* 鼠标悬浮在【+】号图标处，可查看当前图片资产坑位的尺寸要求，按照规定尺寸上传资产可以更好地适配模板哦！

<div align="left"><figure><img src="/files/NqvgBAOIIDgeTfpRcrhf" alt=""><figcaption></figcaption></figure></div>

* 以背景图为例，点击【替换】
* 选择【我的资产库】-【本地上传】，导入我们提前准备好的背景图片
* 点击图片右下角的【+】号，在弹出的图片裁剪窗口确认无误后，点击【确定】即可成功替换

<figure><img src="/files/Dk7JdPpX8XG6Ll1R7MR9" alt=""><figcaption></figcaption></figure>

* 对于不需要的图片(如福利卡坑位)，可以选择隐藏或替换为透明图片

<div align="left"><figure><img src="/files/D7bz6Qb9wX15RcWi9x75" alt=""><figcaption></figcaption></figure></div>

<mark style="background-color:red;">1-2）文本资产</mark>

* 对于不需要的文本(如免责声明)，可以选择隐藏或直接清除文本内容

<div align="left"><figure><img src="/files/Ge1nTdZl2WbCT5LHdqcO" alt=""><figcaption></figcaption></figure></div>

* 对于需要调整的文本，可直接在文本框修改文本内容
* 点击文本旁的笔刷图标，可微调该文本的样式

<div align="left"><figure><img src="/files/XIKxaKJTohyrXip59DyW" alt="" width="563"><figcaption></figcaption></figure></div>

本案例需要替换的资产类型主要是图片及文本，按照以上操作方法，依次替换所有资产即可。

完成替换后，我们点击右上方的【···】，选择【复制到自由制作】，点击确认后即可进入自由编辑器进行后续内容的制作

<figure><img src="/files/8KE823Ad6wq5N67PADy7" alt=""><figcaption></figcaption></figure>

需要注意：【左右选择跑酷】模板是基于21点玩法制作的，在【换肤编辑器】中的卡牌坑位有重叠，导致“X8”和“X32”无法同时替换，需要进入自由编辑器对其中一个图片坑位另做替换

* 点击【玩法模板】 - 【玩法编辑】
* 选中【Level\_2】组下的图层【6】，点击【替换】，完成“X32”图片的替换
* 然后【返回项目编辑】即可

<figure><img src="/files/sAQljzBJH4ezYBdP3o1g" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/7BIoz0aPzi4IzG48C05F" alt=""><figcaption></figcaption></figure>

#### **2）新增资产**

**2-1）场景1新增资产：光芒过渡图片**

* 选中原有图层\[player\_card\_light]，删除其"透明度缓动"动画
* 复制该图层到图层\[xlz\_Player\_card\_5]之下，然后隐藏原图层

<figure><img src="/files/7d339V8lVamkRvLiZGcg" alt=""><figcaption></figcaption></figure>

**2-2）场景2新增资产：跳转按钮**

* 点击打开【项目资产】窗口，上传跳转按钮图片
* 添加到场景2中，并调整位置及大小
* 新增文本“DOWNLOAD”，并在右侧调整其内容和样式
* 将新增按钮编组，并拖拽放置于\[pop-ups]组内

<div align="left"><figure><img src="/files/qa7m7jopBcnI9JnXFErB" alt=""><figcaption></figcaption></figure></div>

### 2.动画设置 <a href="#ssrbm" id="ssrbm"></a>

#### 1）为第二个序列帧球和光芒图片增加退场动画

* 选中场景1中的图层\[xlz\_Player\_card\_5]，添加动画-退场动画-淡出。参数设置如下：

<figure><img src="/files/LvKk2dtBuQvdWJLfqkXc" alt=""><figcaption></figcaption></figure>

* 选中刚刚复制出来的图层\[player\_card\_light\_end]，添加动画-退场动画-淡入淡出。参数设置如下：

<figure><img src="/files/PPbSPw3dBpzJer4SVZb9" alt=""><figcaption></figcaption></figure>

#### 2）为场景2新增的跳转按钮增加动画

* 选中原有按钮组\[btn\_last]，点击上方复制按钮
* 再选中新增按钮组\[btn\_download]，点击上方粘贴按钮，选择【仅粘贴图层动画】，即可快速完成动画的设置

<figure><img src="/files/DRmS3xozQ0NXTDuw2MMP" alt=""><figcaption></figcaption></figure>

* 因我们想实现两组按钮交替缩放的动画效果，可通过调整其中一个按钮组的“脉冲向前”动画来实现
* 如将新增按钮组\[btn\_download]的起始比例由“1”调整为“1.1”，结束比例由“1.1”调整为“1”即可

<div align="left"><figure><img src="/files/qrk5XJ1NjRz10XVIqTLx" alt=""><figcaption></figcaption></figure></div>

### 3.事件设置 <a href="#xhudq" id="xhudq"></a>

#### 1）场景1新增响应事件

* 点击场景1的【事件】
* 在【第2次奖励反馈】下添加响应事件-从头播放全部动画，依次选择图层\[xlz\_Player\_card\_5]和\[player\_card\_light\_end]即可

<figure><img src="/files/mf8queKLlTFCeCrpQadE" alt=""><figcaption></figcaption></figure>

#### 2）场景2新增跳转事件

* 同动画，可通过\[复制-粘贴]功能快速完成
* 上一步骤，我们已经复制了按钮组\[btn\_last]，所以直接选中\[btn\_download]，点击粘贴按钮，选择【仅粘贴图层事件】，即可快速完成事件的设置

<figure><img src="/files/ELWm6lX4MQPvkaEJio8K" alt=""><figcaption></figcaption></figure>

### 4.多语言翻译 <a href="#fgprf" id="fgprf"></a>

完成以上内容的调整后，我们可对有修改及新增的文本进行多语言翻译

* 点击【全局设置】，在【默认语言】处点击笔刷图标，调起文本翻译窗口
* 选择目标语言英语，在此只勾选有修改和新增的文本即可，然后点击【翻译】按钮进行智能翻译
* 若对翻译结果不满意，可直接在文本框内进行微调，调整完毕后点击【提交】，多语言翻译即生效
* 选中文本图层，在右侧参数设置区可微调文本样式

<figure><img src="/files/XgoxQWSFx198yo79et9G" alt=""><figcaption></figcaption></figure>

* 若想新增语言，点击【添加语言】即可
* 翻译步骤同上

<div align="left"><figure><img src="/files/NPZPR6QfJE5YbW9Q10io" alt=""><figcaption></figcaption></figure></div>

### 5.横屏适配 <a href="#sl2ai" id="sl2ai"></a>

对新增资产的横屏排版适配进行调整

* 选中新增按钮组\[btn\_download]，点击右侧【复用竖屏位置尺寸配置】，一键调整
* 然后分别调整两个按钮组到适当位置即可

<figure><img src="/files/h1HA8yyKzM0lyoj6CCiX" alt=""><figcaption></figcaption></figure>

### 6.**整体预览** <a href="#ozdcc" id="ozdcc"></a>

全部调整完成后，我们对不同机型/不同语言/横竖屏进行整体预览试玩

<figure><img src="/files/fwSZV88FzNFmcxsCYlcg" alt=""><figcaption></figcaption></figure>