9753行:土拨鼠日

            如果您长时间玩立方体
            它们会变成

查看游戏Lines 9753的名称,您可能会认为这个故事是关于著名游戏Color Lines的9753rd克隆的,您需要连续制作5个相同颜色的球。是的,它是一个克隆。好吧,还有什么新的呢?我将分享我的想法以及在HTML + CSS + JavaScript中实现的一些细节。我将告诉您9753是什么意思,我将提出一种方法来查找其他数字组合并查看游戏的变化。它将变得更加有趣或无聊-您决定。您猜9753是什么意思吗?然后,请在猫下。

多种游戏选择


有没有想过在原始游戏中9x9尺寸来自何处?不仅可以选择游戏的尺寸,而且还可以选择其他参数,这真是令人惊讶。它很有趣:颜色数为7,连续的球数为5,每转出现的球数为3。这4个参数都放在游戏名称中-Lines 9753总体而言,正是这四个因素决定了游戏的复杂性,这很可能并不适合所有人。


也许有人会喜欢另一套。例如:

  • 3333-孤独,像单人纸牌游戏,您不必害怕陷入死胡同,一次尝试尽可能多地击倒球(5个仍然很容易,6个更难,7和8个几乎不现实),适用于根本不想思考的情况;
  • 5643-在5x5的板上,单元格不小于9x9,因此在电话上玩起来很方便,但难度似乎比9753略高;
  • 5543比5643稍微容易一些,因为不同颜色的数量更少,这意味着它更有可能制作一系列相同颜色的球;
  • 4443-在复杂性上可与5643媲美,但球甚至更大-屏幕的短边只有4个球。



我认为每个人都会为自己找到合适的游戏选择。请勿断开网络连接,我们将能够一起在该网站的表格中看到最受欢迎的选项。

移回


允许后退。曾几何时,当树木高高的时候,我还是一个学生,我不得不玩彩色线条。我真的很喜欢这个游戏。有一次,在其中损失了半天时间,并且获得了数千分,我陷入了停滞。意识到这是偶然的,球成功掉了出来,在不久的将来我走不了那么远。为了打破自己的记录,我将不得不杀死十次以上的时间,然后如果我幸运的话。从那时起,我已经很长时间没有玩过这款游戏了。普遍的不公正感深深地存在于我的灵魂中。它一直坐在那儿,直到阴险的复仇计划得以落实-制作相同的游戏,但具有倒带功能至少可以追溯到一开始。对我而言,正是这种选择促使我以自己的方式编写游戏。

固定随机性


一些球员说,有时赛车故意在不舒服的地方放球,使通道复杂化。尤其是当剩余的自由单元非常少时,就不可能在正确的位置等待正确的球。换句话说,游戏中的随机性远非随机性。有了向后倒退的新机会,每次提供新球的地方都不合逻辑。因此可以来回移动直到正确的球出现在正确的位置。因此,在游戏中,机器的所有移动都被确定,并且随机地取决于移动次数和球在球场上的位置。而且,每个人都玩同一游戏。也就是说,游戏以相同的安排(赛车的第一举动)开始,然后赛车的举动取决于玩家的下降方式:如果玩家以相同的方式行走,然后在场上他们将有相同的球排列。这使您可以客观地,不计机会地比较不同的解决方案。有些人喜欢衡量谁是下一个,谁是更快。...一系列玩家移动的形式的决定会发送到服务器。汽车的移动是根据相同的随机算法计算的。无法欺骗服务器,检查整个序列的正确性,然后将结果输入到表中。所有记录与玩家移动顺序一起保存。然后,我们分析并发布得分9999分的人的最佳决策。有必要提出选择最佳标准的标准。汽车的移动是根据相同的随机算法计算的。无法欺骗服务器,检查整个序列的正确性,然后将结果输入到表中。所有记录与玩家移动顺序一起保存。然后,我们分析并发布得分9999分的人的最佳决策。有必要提出选择最佳标准的标准。汽车的移动是根据相同的随机算法计算的。无法欺骗服务器,检查整个序列的正确性,然后将结果输入到表中。所有记录与玩家移动顺序一起保存。然后,我们分析并发布得分9999分的人的最佳决策。有必要提出选择最佳标准的标准。


在统计信息中可以找到一些标准,可通过单击右侧或底部计数器来获得这些标准。如果您提出其他有趣的标准,请给我发送,我将尝试将计算形式化并添加。

提示


显示了以下球的位置和颜色。由于游戏可以向前和向后倒退,因此隐藏下一个动作是没有意义的。可能会显示一些前进的动作,但是它并没有出现在一个简单的界面上(请注意,如果由于玩家的动作而占用了单元格,则汽车的动作会发生变化)。

计分


根据经典公式N *(1 + N-DIMENSION)进行计分,其中N是线中球的数量,DIMENSION是运动场的尺寸。即,收集在一起的球的5、6、7、8分别给出5、12、21和32点。对于游戏选项3333,当3、4、5和6个球崩溃时,将获得3、8、15、24。

平面艺术


图形只是矢量-我不喜欢缩放伪像,尤其是模糊的边框。动画的主要图形元素:老式的录音机和带有高光和渐变照明的弹跳球。它们使用CSS制成,并用JavaScript片段调味。最初,制作了深色方案。您可以通过在设置中将其打开来尝试。但是,一切看起来都令人沮丧。我更喜欢光。

三维球


听起来很矛盾,但是从三个相互嵌套的矩形中,可以获得一个三维球:


  1. 在屏幕上指定大小和位置的容器
  2. 圆角正方形,创建二维形状,在弹跳过程中收缩和拉伸
  3. 一个带有椭圆渐变填充的正方形,该正方形定义了球的颜色和照度,并增加了三维尺寸。

使用容器,一切都很简单。其CSS属性的位置,左和顶部指定了球在场上的坐标,而font-size设置了相对于其他两个正方形缩放的大小。就像绝大多数的圆形一样,在我们的网页上,圆形正方形就是带有最大圆角的正方形。当我们用鼠标单击它时,它会讨人喜欢,从上方挤压并扩大侧面。如果单击的结果与单击鼠标的速度一样快,则球开始弹起。


@keyframes flat {
            0%   {height: 1.0em; width: 1.0em; top: 0; left: 0em;}
            100% {height: 0.9em; width: 1.05em; top: 0.1em; left: -0.025em;}
        }

@keyframes jumping {
            0%   {height: 0.9em;   width: 1.025em; top: 0.1em;   left: -0.0125em;}
            10%  {height: 1.02em;  width: 1.0em;   top: -0.02em; left: 0em;}
            40%  {height: 1.008em; width: 1.0em;   top: -0.18em; left: 0em;}
            50%  {height: 1.01em;  width: 1.0em;   top: -0.2em;  left: 0em;}
            60%  {height: 1.0em;   width: 1.0em;   top: -0.18em; left: 0em;}
            70%  {height: 1.0em;   width: 1.0em;   top: -0.1em;  left: 0em;}
            90%  {height: 1.0em;   width: 1.0em;   top: 0em;     left: 0em;}
            100% {height: 0.9em;   width: 1.025em; top: 0.1em;   left: -0.0125em;}
        }

颜色最大数量为15。


即使在良好的显示器上,并非所有的颜色都具有相当平滑的渐变,所以我选择了适合眼睛的颜色。颜色越多,在球场上按颜色区分球就越困难。看来15种颜色就足够了。

计数器


计数器的主要秘密在于带有数字的磁带中。每个功能区都隐藏在一个矩形内,通过该矩形只能看到一位数字。该矩形的边缘略微变暗以产生舍入效果,好像里面没有磁带,而是磁盘。滚动动画的速度与计数器的剩余增量成比例,并受到一些合理值的限制。最后一位旋转1秒。


声音


声音(爆炸和跳跃)是合成的。它们是由简单的数学公式生成的。当游戏中的大多数声音是使用单频频率发生器生成时,这会产生80年代的回味。这些优点包括程序的紧凑性:用JavaScript编写的这种声音效果的简单生成器比mp3文件小得多。对于每个球,选择自己的一对lowFreq和highFreq音符(请参阅Wikipedia),然后像这样填充音频缓冲区:

    var soundUpBuffer = audioCtx.createBuffer(1, frameCount, sampleRate);
    for (var i = 0; i < frameCount; i++) {
      var x = i / frameCount; // from 0.0 to 1.0
      var time = duration * x;
      var volume = Math.sin(x * Math.PI);
      var freq = lowFreq + Math.sqrt(x) * (highFreq - lowFreq);
      buffer[i] = volume * Math.sin(2 * Math.PI * freq * time);
    }

这里从lowFreq频率变化到沿着曲线X highFreq ½,体积SIN(πx)的。

爆炸时,体积根据公式1 /(1 + 10 * x + 1000 * x * x)衰减,并且频率是从第一个到第五个八度音程随机选择的。

自适应对话框大小


实现了用于选择对话框大小的算法,以使其占用尽可能多的空间,并且不会超出可见区域的边界。问题在于,在不同的设备上,对话框的大小是不同的-有时结果太小,有时却无法进入屏幕。我使对话框的大小取决于字体大小(CSS单位em)。接下来,我对字体大小进行排序,以使对话框占据不超过任何屏幕尺寸的95%。因此,我不必为自适应CSS辩护。


程序小


整个游戏适合一个大小约为150Kb的html文件。大约3000行源代码(当然,没有服务器端)。没有使用JavaScript库和框架-一切都是自然的,就像石器时代一样。有时,您只是不想使用第三方API,有时,了解多少框架可以简化自行车发明者和新的耙子测试仪的工作很有用。首先提出自己的实施方式或想法,然后与其他人进行比较,这很有用。例如,Android版仅需250Kb。它由一个薄的WebView包装器和一包用于不同电话分辨率的png架子组成。顺便说一下,可以将png-shki替换为一个向量xml-koy。事实证明,这完全符合极简主义的精神。

论坛


该论坛phpBB 运行该帐户允许您:

  • 将您的成就保存在服务器上,以便在更换手机或计算机时不会丢失它们
  • 在一台设备上交替播放,然后在另一台设备上播放
  • 留言并向其他玩家或开发者提问。

i18n和l10n


国际化和本地化。游戏已被翻译成俄语和英语。只有35个简短的短语。我不会拒绝免费协助翻译成几种更流行的语言(中文,德语,...)。

无广告


您经常会听到这样的观点,即如果该程序是免费的且没有广告,则意味着特洛伊木马,后门程序,病毒……换句话说,免费的奶酪只在捕鼠器中。否则,为什么呢?为什么有人愿意免费为他人做某事?我不知道一般答案。不仅如此,我不知道自己为什么要这么做。我只是好奇。如果您喜欢某些东西,那么我经常想知道作者是如何成功的。我想尝试做同样甚至更好的事情。有时候,我喜欢所有东西,除了一些细节外,我希望做这样的事情,但要用二十一点和指尖。

结论


目前为止就这样了。我希望您能像我对创建游戏感兴趣的那样尽情享受游戏。我将很高兴收到任何评论。

参考文献



All Articles