V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
nekocode
V2EX  ›  分享创造

用 PixiJS 构建一个自己的小岛~

  •  4
     
  •   nekocode ·
    nekocode · 2020-06-08 14:40:40 +08:00 · 4294 次点击
    这是一个创建于 1648 天前的主题,其中的信息可能已经有所发展或是发生改变。

    之前在某个宝岛人做的网站(由于 zz 原因就不公布细节了)上看到了用 RPG 游戏来进行宣传的创意。后来又在 PixiJS 官网的 Gallery 上看到 https://www.sido.fr/ ,作者很用心地用 RPG 游戏的形式来介绍自己,太有创意了!

    本着学习的心态,我也花了点时间弄了个小型的 RPG 「 neko 岛」放在我的个人站上,用到了下面一些技术:

    • 使用 PixiJS 来渲染画面、播放背景音乐
    • 使用 Tield Map 格式来构建地图
    • 使用 PathFinding.js 来进行寻路

    最终成品:

    18 条回复    2020-06-11 11:28:52 +08:00
    dullwit
        1
    dullwit  
       2020-06-08 15:06:30 +08:00
    支持键盘操作就好了
    nekocode
        2
    nekocode  
    OP
       2020-06-08 15:08:56 +08:00 via iPhone
    @dullwit 我是考虑到要兼容移动端,所以选了鼠标操作。其实键盘操作代码上会简单很多
    kop1989
        3
    kop1989  
       2020-06-08 15:15:40 +08:00
    不错,但是感觉一个是视角高度太矮,一个是有很强的暗角,而且暗角还遮挡文字。再加上这个配色,给人很强的压抑感,感觉有点喘不过气来😄
    fy
        4
    fy  
       2020-06-08 15:36:21 +08:00
    太强了
    nekocode
        5
    nekocode  
    OP
       2020-06-08 15:48:11 +08:00
    @kop1989 感谢反馈。滤镜方面是想着实现像素化和做旧的效果,是会有点压抑感 hhhh
    ohao
        6
    ohao  
       2020-06-08 15:52:49 +08:00
    有产权吗,有建筑许可证嘛 23333
    没的话违建,拉去填海去
    nekocode
        7
    nekocode  
    OP
       2020-06-08 16:07:40 +08:00
    @ohao 哥,我错了<_<
    timqian
        8
    timqian  
       2020-06-08 17:25:02 +08:00
    有趣
    lneoi
        9
    lneoi  
       2020-06-08 17:50:25 +08:00
    厉害厉害
    lneoi
        10
    lneoi  
       2020-06-08 17:51:02 +08:00
    素材是怎么弄的?
    Mark24
        11
    Mark24  
       2020-06-08 17:56:09 +08:00
    有意思啊
    nekocode
        12
    nekocode  
    OP
       2020-06-08 18:12:10 +08:00
    @lneoi 网上有很多免费的 tiled map 素材
    qilishasha
        13
    qilishasha  
       2020-06-09 12:13:30 +08:00 via iPhone
    很感兴趣 我也要开发房地产 我也要建设维斯特洛大陆 相关素材蛮多的
    Smash
        14
    Smash  
       2020-06-10 01:55:51 +08:00
    这个 BGM 听着很有感觉。我 10 月份结婚,一直想做一个类似的像素风网页,有婚礼地点时间介绍就行了,但一直苦于不知道左成什么样,看了楼主分享的成品,感觉脑子里面终于有一些火花了。

    还有楼主怎么不待知乎了,我在知乎还关注了你的。
    Smash
        15
    Smash  
       2020-06-10 01:56:15 +08:00
    @qilishasha @nekocode 能给个关键词吗?素材相关的关键词。
    nekocode
        16
    nekocode  
    OP
       2020-06-10 11:53:58 +08:00
    @Smash 我收藏了一些资源网站,可以看看:
    * https://opengameart.org/art-search?keys=tiled&page=1
    * https://itch.io/game-assets/free/tag-2d

    不呆知乎是指离职知乎?当初离职有各种原因吧,不过主要是想回广东生活哈哈哈哈
    另外感谢关注,预祝新婚快乐!
    Smash
        17
    Smash  
       2020-06-11 04:59:27 +08:00 via Android
    因为没写过游戏,请教一个技术问题,你是怎么实现动态遮挡的,也就是主角走到树后面后,人物被树遮挡住了。

    是用的 tilemap 的分层实现的还是动态计算设置精灵的 zorder 实现的?
    nekocode
        18
    nekocode  
    OP
       2020-06-11 11:28:52 +08:00 via iPhone   ❤️ 1
    @Smash 我用的是分层
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2265 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 23ms · UTC 15:54 · PVG 23:54 · LAX 07:54 · JFK 10:54
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.