每周教育游戏或英语时间杀手尝试

根据Steam统计,我花了数百个小时在游戏中,如果在所有平台上都算了,我就花了数千个小时。 但是令我震惊的是在某些情况下的时间比例。 我花了8.5个小时才能完成出色的《生化奇兵:无限》,但Sacura Clicker花了12分钟多。 Clicker Heroes有40多个小时,与Torchlight 2几乎相同。窍门是我想起并很了解大型游戏的时间。 但是这些小玩具并没有完全让人想起,它们偷走了我的时间而被人们忽略了,花了五到十分钟,长达数周甚至数月。

当我意识到这一点时,我认为将涡轮机拧到这位芭蕾舞演员上会很好。 就是说,做一个有用的时间杀手-一个简单的游戏,不会偷,但要花我五到十分钟的时间。 例如,在英语词汇中。



一次,我买了一堆用英语单词的卡片,并在去办公室的路上用小巴阅读。 然后他离开办公室,这个习惯消失了,我忘记了卡片。 他必须摇晃他的背包,当用风扇从上侧口袋里掉出不同的单词时,我意识到-这是比赛2! 您需要配对的游戏(与第3场比赛不同,他们需要三对或更多)。

长期以来,以“结对情侣”为原则的杀手ers已广为人知,例如,电脑游戏麻将纸牌(不要与洪金宝在香港动作片中扮演的经典赌博中国游戏相混淆)。


KDE游戏麻将

麻将纸牌是麻将连接的简化版本,其中的筹码以简单的布局布置,没有卷曲的金字塔。 您可以在Wikipedia上阅读名为Shisen-Sho的信息,但是如果您要搜索Google样本,则更适合使用名字。

我怀疑第一个版本是由像我这样的程序员制作的,他没有编写具有复杂布局的成熟麻将的经验,但是游戏突然变得流行起来并产生了自己的克隆分支。


KDE Games Shiseen-sho或Mahjong Connect流行

看一下单词卡和麻将连接-它们完美地结合在一起-并且有几对。 剩下的只是将每张卡变成一对芯片。

芯片和游戏设计


每节课中有五个新词,而前几个又有几个重复的词-这就是我的想法。 这意味着游戏中至少应包含20个筹码。

在每个芯片上,必须放置至少一个具有良好可读性的单词。 纸卡可以放置很多文本,但是具有这种比例的筹码将太大。 此外,我真的很想保持“仿佛麻将”的感觉,这意味着一个游戏筹码的形式和文字都应该非常紧凑。 如果将麻将的指关节旋转90度,您将获得足够的文本空间。

在图形编辑器中用这样的关节为游戏布局建模(Fireworks 2003,如果您很好奇),我发现游戏看起来很无聊。 再次查看了麻将的屏幕截图后,我尝试添加不同的图形元素来使图片生动。 然后它突然出现在我的身上-您可以在每对眼镜中添加一颗宝石。 然后,它不仅可以用作动画元素,至少与休闲玩具具有相似的外观,还可以作为提示。


比赛场地的草稿版本,提供不同的筹码选项

最终版本结果是这样的-10到11对单词的三个宝石。 这暗示了大约25%的随机重合的可能性。 如果您忘记了单词-您可以使用相同的单词查看筹码。

可以加快定位的另一个设计元素是用一个(俄语)语言标记所有单词的灰色标记。 最初的想法是标记一对中的一个元素,而不是一个国家标志,所以我没有做三色或类似的事情。



看起来几乎是作弊,但我不想参加考试或全面知识测试。 考试压力很大,我需要最简单,最有趣的游戏方式,以便在游戏过程中形成胜利和自信的感觉。 我认为这是像Bejeweled或Zuma这样的邪教杀手的最重要素质之一。 玩家沿着自己的技能和无能之间的最佳界限,玩得开心,一次又一次地回到游戏中。

规则又如何呢?我从麻将连接中简化了又一步,让我可以制作成对的任何匹配芯片,而不仅仅是成对的芯片。 发生这种情况的原因有两个。 首先是我手头没有现成的麻将代码,而我只测试了配对。 第二个原因是,我发现带有不同语言单词的筹码本身会使游戏玩法复杂化,并且将它们配对可以创造出游戏的感觉。

展望未来-如果您使用相同的芯片进行全面的连接和麻将,实际上将变得更容易玩。 事实是,对筹码的额外限制将缩小选择范围,玩家只能检查所有适用于免费宝石的宝石的筹码-这将使重合的概率从25%急剧增加到50甚至一百,这取决于布局。

但是,无论玩或作弊多么容易,此类游戏的主要目标仍将实现-玩家的大脑将不断匹配其母语和外语中的几个单词。 如果有人设法制造出这样的时间杀手,那么无论他们如何作弊,其中数十个小时的时间都会为玩家带来好处。 尽管有意识的学习肯定总是更好。

程式设计


对于这个项目,我使用了常规的JavaScript和Phaser.io 2.10.2游戏引擎。 HTML5游戏为何如此出色-它们使您可以快速提供测试和运行原型的访问权限。 我已经设法在其他项目上确保创建跨平台游戏HTML5的方法不是很好(明显的弱电话手机FPS下降,跨浏览器兼容性问题,在某些情况下需要考虑桥接到本机API的问题)。 但是,作为构建网络原型和网络玩具的工具,这是一个不错的选择。

就像后核大篷车一样 ,我开始通过编译游戏状态模型来开发游戏-即数据类,其中的字段仅反映了玩家当前的进度。

function GameState() { this.pairKey = "ru-en"; // Key   ,    this.pairJsonUrl = "somePath/ru-en.json"; //        this.matched = 0; //       this.gold = 0; // .   ,      this.errors = 0; //   //    //  =   //  Phaser.ArrayUtils.numberArray   - ,    this.portions = Phaser.ArrayUtils.numberArray(Balance.PORTION_AMOUNT-1) .map(function (portion, index) { return new PortionSaveData(); }); this.portion = 0; //   //  this.options = { tutorial: true, //     } } 

为了在基于浏览器的JS中保存和加载游戏状态,在对本地存储进行读写时,只需简单地序列化和反序列化此模型就足够了-因此我们只需两行就可以将进度保存到用户的计算机上。

在Phaser中放置芯片,处理鼠标单击和触摸屏非常简单。 它具有Group类,该类使您可以根据给定的网格自动对齐添加到其中的所有视觉对象。

但是,只能以这种方式完成常规矩形(或网格,如果设置较大的步长),这看起来很原始。 因此,我编写了布局函数,其中每隔两行就移动一半的筹码-结果就是“砖块”的布局。

 //    -        function layAsBricks(group, offsetBase) { offsetBase = offsetBase || Math.floor(AppConfig.CHIP_WIDTH / 2); var N = group.length; var i = 0, row, col, COLS = getColAmount(N), ROWS = N / COLS; var offsetX, min = Math.floor(offsetBase / 2), max = offsetBase + min; var lastWidth = 0, lastX = 0; var nextChip; for (row = 0; row < ROWS; row++) { if (row % 2 > 0) offsetX = offsetBase; else offsetX = 0; lastWidth = 0; lastX = 0; for (col = 0; col < COLS; col++) { nextChip = group.children[i]; if (nextChip === undefined) break; group.children[i].y = row * AppConfig.CHIP_HEIGHT; group.children[i].x = lastX + lastWidth; lastX = group.children[i].x; lastWidth = group.children[i].width; group.children[i].x += offsetX; i++; } } } 

但是我不得不解决字典的主要问题。

字典和字体游戏


如果他们还没有赶时间的话,第一件事会引起所有人的注意-筹码的长度不足以充分显示字典中的所有单词。 您可以通过根据单词的长度任意更改字体大小来解决此问题。


不同长度的字体大小不同-我认为这有点疯狂

但是这个选项对我来说似乎太糟糕了,因此我决定只过滤字典,在两种情况下(俄语和英语)都只保留不超过9个字符的单词。 在我的情况下,这是允许的,因为我以频率字典为基础-也就是说,其中的单词是按使用频率排序的。 长度超过9个字符的前一千个单词很少,而最常见的前十个单词根本没有。

在检查概念中最常用的单词时,最多可以使用9个字符,但是如果您开发原型,则迟早必须对它进行一些处理。 很有可能改变芯片的比例或增加其尺寸。 对于德语,这甚至必须在第一个最流行的数百个单词的框架内完成-我还想测试德语,记住学年。

第二点是英文和俄文字母的视觉重合。 俄语的“ not”和英语的他(大写)经常恰好与像素重合。 频率词典增强了这种效果,因为这些简短的单词几乎在一开始就以一堂课结束。


大写的俄语NOT和英语HE看起来相同

灰旗无力地帮助了他们,使他们感到困惑。 在测试人员的首次抱怨之后,我将题字的大小写更改为通常的小写字母。 然后我看到了下一个错误-字母开始跳舞,有些单词垂直地飘了整个像素。



原因是因为我使用了一种光栅字体进行输出(形成为一组大小相同的字母图片),并根据需要对其进行缩放。 在大多数情况下,这很顺利,但是圆形字母以小写字母出现-有时会吃掉一个像素,从而产生跳舞的效果。
道德:小文本的光栅字体应立即以正确的大小准备
在准备了单独的字体后,每个人都停止跳舞并严格按照基线站立。



如果您将在项目中使用Phaser或其他HTML5引擎,这是另一个提示:立即以将在游戏中使用的颜色显示光栅字体。 否则,这会给处理器带来额外的压力,这在具有许多动作和效果的游戏中会导致FPS的沉陷。 此外,即使在某些Android平板电脑上的最新移动Chrome中,由位图字体以编程方式指定的“非本机”颜色也可能根本不会显示-输出将是默认设置。

而且,当然,最好将此类游戏的字典作为一个单独的可下载文件进行连接-如果发现错别字或可疑选项,则可以对其进行更新。

例如,我的字典版本似乎是从翻译文本数组中编译出来的,并考虑了上下文,因此该课程的第一堂课中的“内容”被翻译为“那个”。 显然,从这个意义上说,这个问题比问题要经常使用,但是对于没有上下文的学习来说,它是不合适的。

我的主要词汇结论是,与上下文高度相关的质点和其他单词不适合以这种纯对形式学习。 我看到的解决方案选项是将单独的玩具制成颗粒,或创建带有较长文本的筹码。 第二种选择看起来更合乎逻辑,因为您不会只用一个字就能识字,而且您需要借助上下文充分学习该语言,至少要借助小表达式。 这意味着-仍然有很多实验!

讲解


最初,我测试了一款简单地布置筹码的游戏-这很有趣,因为游戏玩法被简化为让人回想起已知的表情,这给人一种轻松胜利的感觉,这是必需的。 但是后来我意识到这对完全不熟悉的语言是行不通的。 因此,我必须添加学习选项-在课程开始之前,游戏会以正确的对数显示筹码,然后将它们混合。



从技术上讲,这是按以下方式实现的:首先按常规方式(即以随机顺序)布置级别。 然后,如果启用了教程选项,则会启动一个功能,该功能可以记住芯片的初始坐标,以工作对的形式向其添加飞行动画和布局,然后一切恢复原状。 由于教程的计算和准备工作是在第一个更新周期开始(重画屏幕)之前进行的,因此在用户看来,游戏首先以正确的顺序显示筹码,然后随机对其进行洗牌。

在Phaser引擎中,Group具有一种混洗方法,其作用类似于混洗常规数组,但同时会更新Z-index。 这是一个非常方便的功能,对于实施成熟的麻将游戏和其他游戏(至少有条件的三维空间且元素相互重叠),无疑会派上用场。

游戏开始的算法看起来很简单-我们从给定课程的成对字典中取出N个对,从它们中形成可视的筹码元素,然后进行洗牌并将其构建为网格-我们得到了伪随机布局。

在教程中进行相反的过程-在芯片阵列上调用sort函数,其中字典对的id参数是一个重要参数-这样,将芯片彼此成对排列,然后将其放置在两列中。

进度


为了监视进度,我在开始菜单和星号中添加了小指示器,当所有级别以一百个单词完成时,应显示星号。 屏幕截图显示了带有测试星的人造情况。



我在Craftpix.net上将苏丹与卡特曼的脸联系在一起-他穿着与钻石相同的免费装备行走。 只是为了增加屏幕​​保护程序的趣味性。 虽然,如果您不喜欢苏丹或卡特曼,我承认这一举动并不是特别成功。

结论与展望


我确信训练时光杀手是真正的时光杀手,而我做的这个原型是不可能的。 当它们大量出现时,世界会变得更好。 至少,数百万人不会浪费数百小时。

如果您手头有一些常规游戏的代码,并且有几天免费使用的时间,请尝试尝试一下,至少要讲几个单词。 您可以在此处获取完成的JSON文件 。 它有上千对,我形成了一个保证金。

所有的match3和match2游戏-包括球,钻石,麻将筹码,鱼和小熊,像大多数游戏一样,具有像Zuma或静态场这样的分形动态布局,这实际上是一项任务,需要进行组合,并根据某些条件选择组。

在目前的游戏中,这个标志没有任何有效载荷,人们只是将红色和绿色的球,半透明的条纹果冻糖果和粘性果酱小熊结合在一起。 但是,如果这些幼崽被健康的维生素所饱和,该怎么办? 我记得我从Fallout和Heroes Might and Magic学到了许多英语单词,这意味着这种维生素存在。

我的游戏原型可以在这里进行测试 。 可以选择不同的数百个和级别,保存,进度和一千个最常用的英语单词。 布局是为台式机显示器或平板电脑设计的。 每个级别的设计时间为几分钟,包含5个新单词和6个与先前单词重复的单词(根据随机采样公式3、2、1)。

更新06.13.18 :在每100个单词中超过最后一个级别时,在数百个单词和致敬词之间添加了过渡。 从词典中也删除了一些上下文对,这些上下文对在单笔翻译中没有意义。 优化内存工作。

Source: https://habr.com/ru/post/zh-CN413391/


All Articles