Josh Marinacci 的文章
-
如何用网页制作 VR,新的视频系列
介绍 Josh Marinacci 的一个新的 7 集视频系列:如何在浏览器中使用 three.js 和 WebVR 制作虚拟现实项目。这些简短的教程展示了如何在 WebVR 中创建一个交互式 3D 生日贺卡,您可以在桌面网页浏览器、VR 头戴设备或智能手机设备上分享和查看。您所需要的只是一点时间和一点 JavaScript 知识。
-
WebVR 游戏的性能调优
应用程序越小,加载速度越快。以下是如何减小我最喜欢的 WebVR 游戏的大小,优化字体、音频和图像文件以达到我的目标:VR 头戴设备的 10 秒加载时间。
-
使用 Firefox 形状路径编辑器让您的网页布局突破矩形
CSS Shapes 让您的网页设计突破矩形网格。使用新的 CSS 标准,文本可以流动,图像可以圆角化,甚至只是一些不平行的线条也可以让您的网站脱颖而出,使您的品牌与众不同。在 Firefox 62 中,使用形状路径编辑器,您可以直接从 CSS 检查器中直观地编辑形状,使用 Firefox 开发者工具选择要修改形状的元素。
-
在 Mozilla Hubs 中分享您最喜欢的图像和视频
Mozilla Hubs 是一个 VR 聊天系统,它允许您与朋友在 VR 中行走和交谈,无论他们在世界上的哪个地方。现在,您可以通过粘贴 URL 将几乎任何类型的媒体与 Hubs 房间中的每个人共享。您共享的任何内容都会成为一个虚拟对象,每个人都可以与之互动。从图像到视频到 3D 模型,Hubs 允许跨设备(笔记本电脑、手机、头戴设备)和操作系统进行共享和协作。
-
网页上的 360° 图像,轻松易行
如今,VR 最流行的用途之一是 360° 图像和视频。这些内容很容易在线发现和分享,您不需要学习任何新的交互方式来探索 360° 体验。但是,构建 360° 视图并不像探索它们那样容易。在这篇文章中,Josh 向您展示了如何使用 A-Frame 和 Glitch 轻松构建 3D 导览。
-
使用 A-Frame 和低多边形模型构建沉浸式游戏
在本教程的两部分中的第一部分中,Josh Marinacci 使用 A-Frame 构建了一个沉浸式 WebVR 游戏,并介绍了添加物理引擎、管理碰撞以及添加 3D 模型和效果的关键概念和代码。
-
使用 A-Frame 和低多边形模型构建沉浸式游戏(第 2 部分)
在本教程的两部分中使用 A-Frame 构建沉浸式游戏的第 2 部分中,Josh Marinacci 展示了如何在第 1 部分中开发的简单游戏中添加照明、音频、响应性和润色。
-
用于 UI 布局的 CSS Grid
在本文中,我将向您展示如何使用 CSS Grid 来改进需要响应和适应用户交互和不断变化的条件的应用程序布局,并始终使您的面板正确滚动。
-
Meta 2 AR 头戴设备与 Firefox
如今,开发沉浸式 WebVR 体验的最大挑战之一是沉浸感会让您远离开发者工具。有了 Meta 的新款增强现实头戴设备,您现在可以在无需戴上或摘下头戴设备或将开发者工具连接到远程设备的情况下,体验和开发 WebVR 内容。