文/透明的星尘
总觉得好像搞了个很不得了的大新闻,不过本站最活跃的站长木綿与后台技术总监白隼都已经略有了解——
模仿Fate系列圣杯战争设定的,属于宣传部的英灵资料展示,命运·七彩神话,F7C的初版,终于完成了:
http://skyfalco.club/lrm/hero7
—1—
从Krkr到XML
已经不记得历经多久,大体上是从我搬到杨老师的办公室903之后的几天开始的吧。在那之前,刚刚把HTML,CSS,JS,PHP,XML等一系列脚本狼吞虎咽地啃了一遍,想着眼高手低终究还是学不会,所以就产生了这么一个无比中二的想法。
大四毕业的前,我曾经用Fate的引擎Krkr做过一个小游戏的雏形,当时的人物介绍是用的PS直接做的图。且不说图片占用很大空间,修改,补充,删减都会产生巨大的工作量,而且是大量重复的工作量。这不是一个程序员应该负担的。所以我决定以XML构建数据库(现在看Json配合JS应该更好些,不过数据结构+算法的思路没有太大区别就是了),采用网页展示的方式,将当时制作的英灵展示复刻一下。一来可以作为练习,二来6年过去,大家也都有不小的变化,也的确应该更新一下了。大家都已经不是当年的自己,然而有些东西会在时间中积淀为永恒。
想法很容易得到,行动才是最难的。这大概是我第一次从一张空白的HTML开始,去写一个完整的网站。一开始才发现,自己连简单的css都没有很熟练精确地掌握,基本上用了一个晚上的时间,才彻底理解了position的几个属性,padding和margin的区别这些其实非常基础的东西。好在弄明白之后,效率就高了很多,很快就用HTML和CSS做出了介绍自己的那一页。至此算是完成了整个网站的基础视觉设计。其实你们点击上边的链接看到的,和当时那单独的一页,60%是一样的。只是不能切换到别的角色。
然后就是比较技术的工作了,就是如何利用JS去读取XML里存储的信息。由于Chrome默认会禁止跨域加载,读取本地XML会被block掉,花了很久,反复调用控制台,才解决这个问题。看到点击侧边栏的人名,会更换头像之后,不觉长舒一口气。最核心的算法是没有问题的,只要把原HTML里的元素删掉,换成用JS读取的内容就可以了。这期间,还解决了很多关于XML规范的问题。一开始我是用4个文件分别存储人物基本信息,宝具,技能,被动。想着有重复地技能可以直接读取。然而在写完建站三元老的资料之后发现,根本没有完全一样的技能。哪怕效果一样,备注也不一样。最后索性把所有的文件合并成一个大的hero.xml(现在看,每个人一个单独的xml会更好一些,现在已经接近2000行了)。然后就是不断调试JS,一步步去读取xml里的数据到主页上。先是基本资料,然后用循环语句写升成技能和被动的HTML语句。至此,最核心的技术问题已经全部解决。
—2—
从2个人到11个人
看起来已经解决了90%的问题,然而行百里者半九十,接下来才是最花时间的。很多时候,我都是用了一些时间去证明了自己可以做到某件事,而不愿意真的花更多的时间把这个事情做出来,导致自己什么都会,又好像每件事都不是那么极致。这个网站算是对自己的一个磨练吧。当网站已经可以在2个人的资料之间来回自由地切换的时候,就已经证明了我可以做一个10几个人的资料展示网站。但是如果就此停下,我永远得不到一个可以展示十几个人的资料的命运·七彩神话。所以我就逼着自己一定要把它完成,而且要尽量做到最好。
人忙起来就想不务正业。搬到903之后,NT18大会的事情也就自然多了起来。且不说所有的设计,大大小小的杂事就已经够一个白天折腾的了。然后每天吃完晚饭安静一些的时候,开始做大会的相关设计。根据做的进度,决定要不要写一部分XML,差不多2-3天可以new出一个新角色来。于是这一个月以来,就一直过着三点一线的生活,NT18的任务告一个段落就设计一会F7C。虽说有一点点睡眠不足,但是做自己决定的事情,并不会觉得很累。就是过得太与世隔绝,每过一段时间都有一些恍如隔世的感觉,还把相亲认识的大姐姐冷落了>
XML的易修改易扩展的确带来了不少方便,就这样一边设计新角色,一边对之前的角色进行补充,主页的设计也偶尔进行一些小的修改。陆续添加了单击立绘可以切换卡面,传记旁边内置播放器可以播放角色歌,设计网站Banner等一系列功能。图片也进行了压缩,提高了加载效率。
差不多在上周末,网站的设计已经定稿,只差3个英灵的资料。然而NT18也到了最后的冲刺阶段,单是会议的事情,每天就要忙到3点多。只能在吃饭的时候构思一下,忙完会议的事情,匆匆把想到的事情写在XML里,写个半小时左右就赶紧回去睡觉。终于在今天完成了最后一个英灵的设计。这个事情也可以简单地告一段落了,当然有新的想法再进行修改也比较容易,比从无到有快多了。
—3—
从2008到2018
写完事件的始末,才发现是这么漫长的一件事。转眼间已经到了告别的时候,昨天是暮雪他们的毕业典礼,忙于会务的我,几乎没有意识到这件事。下个学期,还在扑腾的估计就只剩我们们三个建站元老了吧,真是时光飞逝。
我也不知道做这个网站意义何在,单纯作为脚本的练习,我完全可以做一份电子简历。然而我就是想把这些存在于妄想之间的镜头展现出来,想把当年与你们在一起的种种,以一种抽象夸张充满浪漫地方式展示出来。对我来说,真正的救赎也许就是专注于一件想做的事,不计代价地把它做到最好。
选在这个时间点做这件事,也许是受了一些毕业季的熏陶吧,实在做不出第二个感动整个08级的燕园灵梦录,不如用这种独特的方式感谢一下一直以来用各种方式陪伴着我的朋友们。七彩神话并非偶然,而是和你们在一起就必然会产生的奇迹。写到这里,突然想用一句中二的话作为帖子的结尾:
这一定是命运石之门的选择!
El Psy Congroo...
----------------------------
编辑:木綿
下面给大伙截两个例子,木綿表示把所有人的传记技能看了一遍以后笑成了inu……一定要去看11人完整版啊!
领取专属 10元无门槛券
私享最新 技术干货