Useful-links.html 7.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183
  1. <!DOCTYPE html>
  2. <html lang="ja">
  3. <head>
  4. <meta charset="utf-8">
  5. <base href="../../../" />
  6. <script src="page.js"></script>
  7. <link type="text/css" rel="stylesheet" href="page.css" />
  8. </head>
  9. <body>
  10. <h1>[name]</h1>
  11. <p class="desc">
  12. 以下は、three.jsを学ぶ際に役立つと思われるリンク集です。<br />
  13. ここに追加したいものがあったり、以下のリンクのどれかがもう関連していない、もしくは機能していないと思われる場合は、右下の「編集」ボタンをクリックして、自由に変更してください<br /><br />
  14. また、three.jsは急速に開発が進んでいるため、これらのリンクの多くには古い情報が含まれていることにも注意してください。
  15. 期待通りに動作しない場合や、これらのリンクのいずれかに記載されている通りに動作しない場合は、
  16. ブラウザコンソールで警告やエラーがないか確認してください。また、関連するドキュメントページもチェックしてください。
  17. </p>
  18. <h2>ヘルプ</h2>
  19. <p>
  20. Three.jsは公式の[link:https://discourse.threejs.org/ forum]と[link:http://stackoverflow.com/tags/three.js/info Stack Overflow]をヘルプリクエストに利用しています。何か支援が必要な場合は、ここを利用してください。ヘルプリクエストのためにGithubのissueを作成しないでください
  21. </p>
  22. <h2>チュートリアルと学習コース</h2>
  23. <h3>three.jsを始める</h3>
  24. <ul>
  25. <li>
  26. [link:https://threejsfundamentals.org/threejs/lessons/threejs-fundamentals.html Three.js Fundamentals starting lesson]
  27. </li>
  28. <li>
  29. [link:https://codepen.io/rachsmith/post/beginning-with-3d-webgl-pt-1-the-scene Beginning with 3D WebGL] by [link:https://codepen.io/rachsmith/ Rachel Smith].
  30. </li>
  31. <li>
  32. [link:https://www.august.com.au/blog/animating-scenes-with-webgl-three-js/ Animating scenes with WebGL and three.js]
  33. </li>
  34. </ul>
  35. <h3>より先進的な内容の記事やコース</h3>
  36. <ul>
  37. <li>
  38. [link:https://discoverthreejs.com/ Discover three.js]
  39. </li>
  40. <li>
  41. [link:https://threejsfundamentals.org/ Three.js Fundamentals]
  42. </li>
  43. <li>
  44. [link:http://blog.cjgammon.com/ Collection of tutorials] by [link:http://www.cjgammon.com/ CJ Gammon].
  45. </li>
  46. <li>
  47. [link:https://medium.com/soffritti.pierfrancesco/glossy-spheres-in-three-js-bfd2785d4857 Glossy spheres in three.js].
  48. </li>
  49. <li>
  50. [link:https://www.udacity.com/course/cs291 Interactive 3D Graphics] - a free course on Udacity that teaches the fundamentals of 3D Graphics,
  51. and uses three.js as its coding tool.
  52. </li>
  53. <li>
  54. [Link:https://aerotwist.com/tutorials/ Aerotwist] tutorials by [link:https://github.com/paullewis/ Paul Lewis].
  55. </li>
  56. <li>
  57. [link:http://learningthreejs.com/ Learning Three.js] – a blog with articles dedicated to teaching three.js
  58. </li>
  59. <li>
  60. [link:https://discourse.threejs.org/t/three-js-bookshelf/2468 Three.js Bookshelf] - Looking for more resources about three.js or computer graphics in general?
  61. Check out the selection of literature recommended by the community.
  62. </li>
  63. </ul>
  64. <h2>ニュースとアップデート情報</h2>
  65. <ul>
  66. <li>
  67. [link:https://twitter.com/hashtag/threejs Three.js on Twitter]
  68. </li>
  69. <li>
  70. [link:http://www.reddit.com/r/threejs/ Three.js on reddit]
  71. </li>
  72. <li>
  73. [link:http://www.reddit.com/r/webgl/ WebGL on reddit]
  74. </li>
  75. <li>
  76. [link:http://learningwebgl.com/blog/ Learning WebGL Blog] – The authoritive news source for WebGL.
  77. </li>
  78. </ul>
  79. <h2>Examples</h2>
  80. <ul>
  81. <li>
  82. [link:https://github.com/edwinwebb/three-seed/ three-seed] - three.js starter project with ES6 and Webpack
  83. </li>
  84. <li>
  85. [link:http://stemkoski.github.io/Three.js/index.html Professor Stemkoskis Examples] - a collection of beginner friendly
  86. examples built using three.js r60.
  87. </li>
  88. <li>
  89. [link:https://threejs.org/examples/ Official three.js examples] - these examples are
  90. maintained as part of the three.js repository, and always use the latest version of three.js.
  91. </li>
  92. <li>
  93. [link:https://raw.githack.com/mrdoob/three.js/dev/examples/ Official three.js dev branch examples] -
  94. Same as the above, except these use the dev branch of three.js, and are used to check that
  95. everything is working as three.js being is developed.
  96. </li>
  97. </ul>
  98. <h2>ツール</h2>
  99. <ul>
  100. <li>
  101. [link:http://www.physgl.org/ physgl.org] - JavaScript front-end with wrappers to three.js, to bring WebGL
  102. graphics to students learning physics and math.
  103. </li>
  104. <li>
  105. [link:https://whs.io/ Whitestorm.js] – Modular three.js framework with AmmoNext physics plugin.
  106. </li>
  107. <li>
  108. [link:http://zz85.github.io/zz85-bookmarklets/threelabs.html Three.js Inspector]
  109. </li>
  110. <li>
  111. [link:http://idflood.github.io/ThreeNodes.js/ ThreeNodes.js].
  112. </li>
  113. <li>
  114. [link:https://marketplace.visualstudio.com/items?itemName=bierner.comment-tagged-templates comment-tagged-templates] - VSCode extension syntax highlighting for tagged template strings, like: glsl.js.
  115. </li>
  116. <li>
  117. [link:https://github.com/MozillaReality/WebXR-emulator-extension WebXR-emulator-extension]
  118. </li>
  119. </ul>
  120. <h2>WebGLのリファレンス</h2>
  121. <ul>
  122. <li>
  123. [link:https://www.khronos.org/files/webgl/webgl-reference-card-1_0.pdf webgl-reference-card.pdf] - Reference of all WebGL and GLSL keywords, terminology, syntax and definitions.
  124. </li>
  125. </ul>
  126. <h2>古いリンク(Old Links)</h2>
  127. <p>
  128. 以下のリンクは歴史的な理由で残っています。現在でも役に立つと思うかもしれませんが、リンク先の情報は
  129. すごく古いバージョンのthree.jsの情報を含んでいる可能性があるので気をつけてください。
  130. </p>
  131. <ul>
  132. <li>
  133. <a href="https://www.youtube.com/watch?v=Dir4KO9RdhM" target="_blank">AlterQualia at WebGL Camp 3</a>
  134. </li>
  135. <li>
  136. [link:http://yomotsu.github.io/threejs-examples/ Yomotsus Examples] - a collection of examples using three.js r45.
  137. </li>
  138. <li>
  139. [link:http://fhtr.org/BasicsOfThreeJS/#1 Introduction to Three.js] by [link:http://github.com/kig/ Ilmari Heikkinen] (slideshow).
  140. </li>
  141. <li>
  142. [link:http://www.slideshare.net/yomotsu/webgl-and-threejs WebGL and Three.js] by [link:http://github.com/yomotsu Akihiro Oyamada] (slideshow).
  143. </li>
  144. <li>
  145. [link:http://bkcore.com/blog/general/adobe-user-group-nl-talk-video-hexgl.html Fast HTML5 game development using three.js] by [link:https://github.com/BKcore BKcore] (video).
  146. </li>
  147. <li>
  148. <a href="https://www.youtube.com/watch?v=VdQnOaolrPA" target="_blank">Trigger Rally</a> by [link:https://github.com/jareiko jareiko] (video).
  149. </li>
  150. <li>
  151. [link:http://blackjk3.github.io/threefab/ ThreeFab] - scene editor, maintained up until around three.js r50.
  152. </li>
  153. <li>
  154. [link:http://bkcore.com/blog/3d/webgl-three-js-workflow-tips.html Max to Three.js workflow tips and tricks] by [link:https://github.com/BKcore BKcore]
  155. </li>
  156. <li>
  157. [link:http://12devsofxmas.co.uk/2012/01/webgl-and-three-js/ A whirlwind look at Three.js]
  158. by [link:http://github.com/nrocy Paul King]
  159. </li>
  160. <li>
  161. [link:http://bkcore.com/blog/3d/webgl-three-js-animated-selective-glow.html Animated selective glow in Three.js]
  162. by [link:https://github.com/BKcore BKcore]
  163. </li>
  164. <li>
  165. [link:http://www.natural-science.or.jp/article/20120220155529.php Building A Physics Simulation Environment] - three.js tutorial in Japanese
  166. </li>
  167. </ul>
  168. </body>
  169. </html>