Upgrade to Pro — share decks privately, control downloads, hide ads and more …

3D Voxel Worlds with voxel.js

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for vladikoff vladikoff
September 10, 2013
Technology
2.1k
1

3D Voxel Worlds with voxel.js

Avatar for vladikoff

vladikoff

September 10, 2013

More Decks by vladikoff

See All by vladikoff
The state of end-to-end testing for modern web apps
Avatar for vladikoff vladikoff
0
100
SmashingConf 2020
Avatar for vladikoff vladikoff
0
44
dotJS 2019 - Into WebAssembly
Avatar for vladikoff vladikoff
0
37
3D + the Web Platform
Avatar for vladikoff vladikoff
0
460
7 years of three.js
Avatar for vladikoff vladikoff
0
170
node.js @ GA 2015
Avatar for vladikoff vladikoff
0
490
JS Testing Stack - Full Stack Toronto 2014
Avatar for vladikoff vladikoff
1
850
Node.JS Intro - General Assembly
Avatar for vladikoff vladikoff
3
520
CSS Preprocessor Workflow with Grunt
Avatar for vladikoff vladikoff
3
2.8k

Other Decks in Technology

See All in Technology
文字起こし基盤の信頼性
Avatar for abnoumaru abnoumaru
0
120
なぜ、あなたのAPIは使われないのか？ AX時代の設計原則、ガードレール、運用体制
Avatar for Yoichi Kawasaki yokawasa
1
210
AI時代の開発生産性は、個人技からチーム設計へ
Avatar for Atsushi Nakatsugawa moongift
PRO
4
2.5k
仕様駆動開発、導入半年。「本当に速くなってるの?」にデータで答える / AICon2026_hirakawa
Avatar for Rakus_Dev rakus_dev
0
320
論語・武士道・産業革命から見る　かわるもの、かわらないもの
Avatar for nakamichi ichimichi
2
120
それでも、技術なブログを書く理由 #kichijojipm / Why I Still Write Tech Blogs Even Now
Avatar for ShinkuFencer shinkufencer
0
500
Webの技術とガジェットで子どもも大人も楽しめるワクワク体験を提供する / Qiita Tech Festa Day 2026
Avatar for you（@youtoy） you
PRO
1
190
41歳でAWSが好きすぎてITエンジニアになったおっさんの話
Avatar for Yuuki Yamashita yama3133
1
740
kaonavi Tech Night＃1
Avatar for 株式会社カオナビ kaonavi
0
160
複数プロダクトで進めるAI機能実装 ── 実践から得たリアルな学びとロードマップ実現への挑戦 / AICon2026_yanari
Avatar for Rakus_Dev rakus_dev
1
270
10年目を迎えた「ABEMA」がどのように AI 活用を推進して、AI 駆動開発にシフトしているのか / How ABEMA, entering its 10th year, is promoting the use of AI and shifting toward AI-driven development
Avatar for Yusei Yamanaka miyukki
0
370
GoでCコンパイラを作った話
Avatar for repunit11 repunit
0
150

Featured

See All Featured
Fantastic passwords and where to find them - at NoRuKo
Avatar for Phil Nash philnash
52
3.8k
Game over? The fight for quality and originality in the time of robots
Avatar for Wayne Barker wayneb77
1
230
Exploring the relationship between traditional SERPs and Gen AI search
Avatar for Ray Grieselhuber raygrieselhuber
PRO
2
4.2k
Accessibility Awareness
Avatar for Sarah Abderemane sabderemane
1
160
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
Avatar for Akihiro Kokubo akihiro_kokubo
PRO
72
40k
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
Avatar for Dr. Kim W Petersen kimpetersen
PRO
0
390
Understanding Cognitive Biases in Performance Measurement
Avatar for Philip Tellis bluesmoon
32
3k
A Modern Web Designer's Workflow
Avatar for Chris Coyier chriscoyier
698
190k
Information Architects: The Missing Link in Design Systems
Avatar for Michelle Chin soysaucechin
0
1k
The B2B funnel & how to create a winning content strategy
Avatar for Katarina Dahlin katarinadahlin
PRO
1
420
Principles of Awesome APIs and How to Build Them.
Avatar for Keavy McMinn keavy
128
18k
Producing Creativity
Avatar for Steve Smith orderedlist
PRO
348
40k

Transcript

  1. 3D Worlds with voxel.js Vlad Filippov

  2. @vladikoff

  3. Rendering voxel worlds in web browsers

  4. github.com/voxel

  5. voxel?

  6. voxels!

  7. None

  8. Explore 3D worlds! - blockplot.com

  9. Explore GitHub in 3D - achiveroom.net

  10. voxelbuilder.com

  11. voxel.js plugins & components

  12. More examples at voxeljs.com

  13. Getting Started - creator.voxeljs.com

  14. Getting Started - Your Game! ⬢ git clone http://github.com/maxogden/voxel-hello-world ⬢

    cd voxel-hello-world ⬢ npm install ⬢ npm start ⬢ open your browser on http://localhost:8080

  15. Hello Voxel World!

  16. voxel-hello-world

  17. package.json

  18. beefy test.js:bundle.js browserify test.js > bundle.js

  19. None
  20. None

  21. voxel events

  22. voxel with three.js

  23. voxel.js & jQuery

  24. Into the real world!

  25. Into virtual reality with voxel-oculus Ship Model by @bigfootbro at

    http://www.planetminecraft.com/project/the-ray--a-minecraft-cruise-ship-finished-at-sea/

  26. Thank You! voxeljs.com