Raybeem is the first VR project from Sokay. It’s not 2D. It’s not a game. Yet, it’s as close to my heart as any of the previously released Sokay products. I spent 2017 working full-time on Raybeem. I can describe it as a whirlwind, which was hard to make sense of while I was in the middle of it. I’m writing this mess to dump what’s been going on in my head into a huge blog post.

Raybeem is a virtual reality project that started out as a desire to listen to my favorite Drum & Bass station, Bassdrive.com, in Virtual Reality. As an adolescent, I spent dozens of hours of my life gazing at Winamp visualizers. Switching through visualizations to find my favorite, tweaking settings, and downloading new ones. This was the prime way of listening to music for Bryson in the year 2001.

This was my dream for 2017, listening to Drum & Bass music in VR. In a world of my creation.

Raybeem’s been a large project for me so I’ve had a hard time figuring out what to say about it. At it’s core, I consider Raybeem to be a VR music visualizer. That was the starting point for the concept, anyway. I just wanted to create an application for listening to music in VR. The different visualizations in Raybeem are thought of as “Themes.” The way I imagined, a Raybeem theme is any environment that reacts to music in some way. So a theme could be anything – realistic or abstract, interactive or non-interactive.

When I started working on Raybeem, I had a strong idea of what I was trying to build. As it turned out, even with all the notes, sketches and prototypes, I fooled myself into thinking it would be less work than it was. Here’s a brain-dump of a lot of the things I figured out on my Road to Raybeem’s release. Continue Reading…

Unity GUI has a great drag and drop interface for calling public functions from your code when certain events are triggered. You can see this when using a UGUI Button script, it has an interface for calling your functions when the button is clicked. I was looking into a way to replicate this kind of drag and drop interface for my own projects and found that Unity has this functionality built in. There’s no need for custom UnityEditor scripts. I figured this out while digging through the source code for the Unity UI system.

An Example of UGUI Button OnClick events

The beauty of having this drag and drop functionality is that it makes it easier to modify the logic of your project without having to dig into code to make changes. By partnering this with a set of specialized components, you can easily create a system for modifying aspects of your project without having to dig into code.

It’s actually quite easy to setup something like this for your own project. This is great for UI Events but also for game events (collecting items, level complete, etc.). To accomplish this all you need is to make use of the UnityEvent class. Just to be clear, these aren’t the same as the standard C# Event system.

So you’re interested in VR development with the Samsung Gear VR. Fortunately, it’s not too difficult to get a build up and running on the Gear VR with Unity. It can, however, be an exercise in patience to figure out the steps to get started. I did some UI development work at Oculus and got accustomed with some of the hoops you need to jump through. I decided to write this guide as an attempt to clarify some of the details.

Please don’t take this guide as the absolute truth. The tools are constantly changing so some stuff may have been correct at some point but wrong at the present. Also, in the future, some things will definitely change. This is only intended as a starting point, a primer. If anything’s wrong, please let me know. There’s a lot to learn!

The Hardware

Here’s a quick rundown of the hardware that you may need and what role they play in development.

Samsung Gear VR

The Samsung Gear VR consumer edition

You probably already know this by now, but the Gear VR is a VR headset in which you plug a specific Samsung phone into and it becomes a standalone VR device. With hardware manufactured by Samsung, and software by Oculus, it was first introduced Fall of 2014 and a few models have been released since then.

There are 3 versions of the Gear VR:

First Innovator Edition: Compatible with the Samsung Note 4 phone.

Second Innovator Edition: Compatible with the Samsung Galaxy S6 and S6 Edge phones.

Gear VR Consumer Edition: Compatible with the Samsung Note 5, the S6, the S6 edge and the S6 edge+ phones.

I recently wrapped up a project I worked on for the fine crew at Wildlife. It was a web application involving compositing a user’s name and photo into a video in realtime, so I’m describing this as realtime compositing! My bad if this sounds misleading to ya! Read on if you’re interested in finding out what this is all about.

The Spell Caster

Created for the TV show, Witches of East End, the spell caster allows users to create a spell with their favorite character from the show. After the user logs in with their Facebook account, the application plays out like an interactive video. The user selects an ingredient to mix, their photo is added to the cauldron and stirred by the user, and finally presented with a potion bottle that displays their name on the bottle.

To create the illusion of the user’s photo and name being in the video we developed a sort of realtime compositing system. This isn’t too unbelievably different from something that you’ve probably seen in Flash before but that didn’t make it any less difficult. The goal was to make this seamless with the live action video and visual fx, also handled at Wildlife. With this project I got up close and personal with the quirks and limitations of HTML video — especially with regards to cross platform and cross browsers compatibility.

In Javascript, I developed a system that basically functions as a custom video player. It generates a playlist based on the user’s selection, with certain videos being tied to tracking data that’ll draw the user’s photo and name into the scene as a texture.

Earlier this year I jumped into Windows Phone 8 when I got a Nokia Lumia 920. I’d been using an iPhone 3G for about 4 years and was ready to move on to something a bit more… modern. While Windows Phone has its crappiness (you mean I can’t save image attachments from e-mails???), iOS had its fair share of crappiness early on as well (no copy & paste???).

It was great to have a new fancy phone but I had an empty place in my heart because I couldn’t play my Sokay Games on my phone… 🙁

A couple weeks ago I tested out the WP8 exporter by doing a quick port of Donut Get! I got it working within an hour. I still need to polish it for release, but it was surprising how little extra it required me to get it running. In this post I will cover some of the process and the gotchas I encountered along the way.

I got a lot of feedback from my friends testing our new mobile game The Crazy Program. One thing that came up a few times was a request to have a high scores table to compete with your friends. I created a quick Facebook App version of Donut Get! last Fall and knew it wouldn’t be too much work with Facebook’s built in high scores functionality.

Facebook allows you to save high scores for your app without needing any backend. The caveat is that you can only save one score per user. So this works decently for a global high score for your game, but not so well if you have different levels and different modes. Facebook’s scores API will also return a list of your friends that are playing, in order of rank. This makes it very easy to hit the ground running with some social features.

Prime31 Social Networking Plugins for Unity

I decided to purchase the Prime31 Social Networking plugins to handle the communication between Facebook and Unity. I had a good experience with their in-app purchase plugins and the support was good. There were other options for Facebook plugins but they either weren’t for both Android and iOS or I couldn’t tell whether or not they could handle posting high scores. Some plugins seemed to just handle basic Facebook connect features, or at least this was the impression I got.

Prime31 Social Networking demo scene

I started development on Android. The example scene is straightforward and I got connected with my Facebook App fairly quickly.

Since using Unity, I’ve been trying to replicate a pipeline that’s similar to Flash. Being able to use Flash’s environment for hand-polished 2d animation just can’t be beat, unless you count custom developed tools. LWF from GREE shows promise in allowing you to bring your Flash animation into Unity, but there is some work involved in getting it to work!

With the mobile version of DONUT GET!, I tried a homemade Sprite Animation approach. This worked reasonably for the requirements of the port but it was more trouble than anticipated given the size of the texture sheets needed for so many frames of animation. Sprite sheets ate up RAM like nobody’s business and easily crashed lower-end devices.

Late last year GREE announced a godsend, LWF. It’s an Open Source tool to export Flash animation from SWF’s into Unity or HTML5. This was around the time I released DONUT GET! on mobile (which was GREE integrated) and I was excited to try it out. Unfortunately, the first release required you to compile it yourself and the only info I could find was in Japanese. Later on I found out that GREE posted more information and a super helpful video walkthrough on the Unity forums.Continue Reading…

The Demo

I’ve been messing around with CSS3’s 3D Transform ability recently. I was looking for a way to achieve some primitive 3D visuals strictly with HTML. I wanted something that would also run on phones and tablets.Continue Reading…

We recently released Donut Get! on iPhone and Android. It was originally developed in Flash and we made the mobile ports in Unity. One of the challenges of porting was figuring out how to bring the game’s Flash animation into Unity. Here’s the “quick ‘n dirty” solution I came up with.Continue Reading…

Shortly after I posted my tutorial on creating a Starfield with Away 3D Lite I tried to see how much I could improve performance with Away 3D 4.0, which was Flash 11 and in Beta stage at the time. I got caught up with finishing Donut Get! and working on Unity stuff and forgot about making a post about the demo. Here’s a post about that Away 3D 4.0 demo I made.

This was inspired by playing Kid Icarus on 3DS. During the flying segments, you’re always flying through clouds which is a great effect. I think they do something similar to this, where the clouds are 3d slices of a cloud which you pass through.

I created the clouds with noise. To get “3D slices” I used a 3d Perlin noise generator by Ron Valstar. The regular Flash noise class lets you generate noise on X and Y axis, this allows you to move in the Z axis to create slices.

I used Sprite3Ds for the cloud slices, hoping that that would allow me to use a greater amount of cloud slices. In this demo I’m using 12 separate Sprite3D instances. It takes a while to generate the noise at the beginning, I don’t think this noise generator anywhere near as fast as Flash’s internal one unfortunately. I spent a long ass time adjusting the Generator and settled on this result which I felt was looking pretty good, rather than just settling for something that was fast to generate.

Sprite3D displays like a billboard/plane in 3D space that is always pointed towards the camera. The problem with Sprite3D is that it’s displayed as a point in space, and if the point isn’t within the camera viewport, it doesn’t display at all. You can see this issue as you rotate the camera to the side. I tried a list minute fix to change it to planes but I couldn’t get the planes to display. It may have something to do with the scale of the scene, the slices are like 15,000 width. Not spending any time trying to figure it out so good luck with it if you wanna try!Continue Reading…