zachstronaut: newest posts http://www.zachstronaut.com/ en-us Fri, 06 Feb 2015 11:07:19 -0800 Newest posts on zachstronaut. <![CDATA[GGJ2015 Game: Actual Working Time Machine]]> http://www.zachstronaut.com/posts/2015/02/06/ggj2015-game-time-machine.html http://www.zachstronaut.com/posts/2015/02/06/ggj2015-game-time-machine.html Fri, 06 Feb 2015 11:07:19 -0800 Zachary Johnson http://www.zachstronaut.com/posts/2015/02/06/ggj2015-game-time-machine.html#comments I teamed up for Global Game Jam 2015 with Mike Waterston and Tori Kamal so that we could bring to you a fully functional, honest to goodness, working Time Machine. This is not a simulation

How to Time Travel

  1. Open your mind
  2. Click link to Time Machine Software

Here is a little screen capture for the timid:

Continue Reading Post…

]]> <![CDATA[</2014> Annual Review]]> http://www.zachstronaut.com/posts/2015/02/05/2014-year-in-review.html http://www.zachstronaut.com/posts/2015/02/05/2014-year-in-review.html Thu, 05 Feb 2015 12:49:36 -0800 Zachary Johnson http://www.zachstronaut.com/posts/2015/02/05/2014-year-in-review.html#comments Every year on New Year's Day I find myself wondering how it was I actually spent the last trip around the sun. And then every year, several weeks or months after New Year's Day, I finally publish a blog post answering that question. I do it for the benefit of myself, but maybe you'll find something interesting here, too.

January

February

More recap after the jump!

Continue Reading Post…

]]> <![CDATA[Web Standards vs JavaScript MVC]]> http://www.zachstronaut.com/posts/2014/12/28/web-standards-vs-javascript-mvc.html http://www.zachstronaut.com/posts/2014/12/28/web-standards-vs-javascript-mvc.html Sun, 28 Dec 2014 21:00:26 -0800 Zachary Johnson http://www.zachstronaut.com/posts/2014/12/28/web-standards-vs-javascript-mvc.html#comments Web standards pioneer Eric Meyer recently wrote a blog post asking folks to share what excites them about the web right now and what has their attention for 2015 and beyond. As many of you will know, Eric has been facing some significant life challenges, and he has reached out to the web community to find his way back into the flow. Eric's a great guy and generous person who has given a lot to the web community such as the An Event Apart conferences, the books he's authored, and he graciously supported the Minneapolis web scene by being an inaugural keynote at the very first MinneWebCon -- something that I quite personally appreciate.

Naturally, I was quite eager to reply to his post. As I began to write my comment, I discovered that a major theme had been bouncing around in my head unexpressed for awhile. My comment turned into a small essay. Eric Meyer's unique position in the industry and his history with web standards both make him the perfect audience for these ideas. I think what I had to say is important for all of us in the web community to consider, so I decided to reproduce an excerpt of the comment here on my blog as well.

So, please read on to see my thoughts on Web Standards vs JavaScript MVC. But also remember to head over to Eric's blog and share with him your own thoughts on what will be big in the web world in 2015.

Continue Reading Post…

]]> <![CDATA[Cycho - IGF Game Submission]]> http://www.zachstronaut.com/posts/2014/10/22/cycho-webgl-eyeball-game.html http://www.zachstronaut.com/posts/2014/10/22/cycho-webgl-eyeball-game.html Wed, 22 Oct 2014 09:58:18 -0700 Zachary Johnson http://www.zachstronaut.com/posts/2014/10/22/cycho-webgl-eyeball-game.html#comments Cycho is Alfred Hitchcock meets Tron light cycles. Two players compete for survival as they maneuver on a giant moving eye. The two players can fight for control of the eye, or a third person can play as the eye and menace the two cycles. It might just be the weirdest game of "snakes" you'll ever play. Eye think you should try it.

I submitted Cycho to the 2015 Independent Games Festival. This is the first time I've submitted one of my games to IGF.

Cycho is based off of a 48 hour solo project that I created during the 2014 Global Game Jam. I used a WebGL bulge filter to create the 3D effect on the eyeball. The awesome music and sound are by Dan Knoflicek.

Browser WebGL Version

Tron rules apply... don't hit yourself, the other player, or the edge of the box marking the arena. Google Chrome gives the best experience. Xbox controllers recommended. There is an instructions screen in the game.

Continue Reading Post…

]]> <![CDATA[NES Glitch Study - WebGL Pixel Shader]]> http://www.zachstronaut.com/posts/2014/04/12/zelda-nes-glitch-webgl-shader.html http://www.zachstronaut.com/posts/2014/04/12/zelda-nes-glitch-webgl-shader.html Sat, 12 Apr 2014 11:11:37 -0700 Zachary Johnson http://www.zachstronaut.com/posts/2014/04/12/zelda-nes-glitch-webgl-shader.html#comments

I've been working on a study of glitches in the NES rendering/sprite system. Here's a video showing realtime glitching of a Legend of Zelda screencap. What you see is a completely procedural and randomized effect rendered in realtime through a WebGL pixel shader written in GLSL with a driver program written in JavaScript.

Continue Reading Post…

]]> <![CDATA[Procedural Website Glitch Script]]> http://www.zachstronaut.com/posts/2014/04/11/html-web-glitch-js.html http://www.zachstronaut.com/posts/2014/04/11/html-web-glitch-js.html Fri, 11 Apr 2014 10:56:03 -0700 Zachary Johnson http://www.zachstronaut.com/posts/2014/04/11/html-web-glitch-js.html#comments

I wrote a little program in JavaScript that procedurally glitches out any website's HTML. It is fun to watch! My friend Floriaen put my script on his site. Go there and click the red "Glitch my website!" button in the top right corner.

The effect is also potentially quite dangerous on API driven sites, and so if you're crazy enough to try the script out for yourself, then please note:

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

Continue Reading Post…

]]> <![CDATA[Eye Cycle - Global Game Jam 2014]]> http://www.zachstronaut.com/posts/2014/01/29/eye-cycle-ggj2014.html http://www.zachstronaut.com/posts/2014/01/29/eye-cycle-ggj2014.html Wed, 29 Jan 2014 21:24:53 -0800 Zachary Johnson http://www.zachstronaut.com/posts/2014/01/29/eye-cycle-ggj2014.html#comments Make sure to check out Cycho -- a more recent and more polished version of my GGJ 2014 project.

If you're like to learn about the original Global Game Jam project, then read on!

Continue Reading Post…

]]> <![CDATA[Global Game Jam 2014 Redux]]> http://www.zachstronaut.com/posts/2014/01/27/global-game-jam-2014.html http://www.zachstronaut.com/posts/2014/01/27/global-game-jam-2014.html Mon, 27 Jan 2014 13:00:54 -0800 Zachary Johnson http://www.zachstronaut.com/posts/2014/01/27/global-game-jam-2014.html#comments Global Game Jam 2014 was this weekend. I jammed with everybody at the IGDA-TC location. This year's GGJ had people participating at 485 locations in 73 countries. I think there were close to 80 people at our location, and several of them stayed on-site for the entire 48 hours. I think one person stayed there and stayed awake for the entire 48 hours. No, it was definitely not me. There are twelve of our games on the website, but I know many other games and prototypes were worked on by the attendees. I ended up making the game Eye Cycle.

Jam Memoir

This year's theme was the sentence, "We don't see things as they are, we see them as we are." I was pretty stumped in terms of game ideas from that theme, although I will say it left me pretty deep in thought about the nature of games themselves. Surely, the way we perceive other peoples' games often says more about ourselves than those games. And definitely the games we make say something personal about ourselves. The best games are maybe the most personally meaningful... even if that meaning isn't explicit to the player.

After the theme was announced, GGJ kicked off like it always does with a group brainstorm where people share their game ideas. This has always been one of my favorite parts of GGJ, because I love to see everybody's creativity and riff off the ideas that are shared.

Continue Reading Post…

]]> <![CDATA[</2013> <2014>]]> http://www.zachstronaut.com/posts/2014/01/11/year-in-review-2013.html http://www.zachstronaut.com/posts/2014/01/11/year-in-review-2013.html Sat, 11 Jan 2014 12:41:31 -0800 Zachary Johnson http://www.zachstronaut.com/posts/2014/01/11/year-in-review-2013.html#comments Photos from 2013.

Wow! What a year! I marked the second year anniversary of my company Zachstronaut LLC. Since starting my own company to work for myself, the challenge has always been finding meaningful work and balancing consulting/business partnerships with creative/artistic interests. These two things are not mutually exclusive, and they overlapped wonderfully in 2013!

December/January are the time of ennui and self-reflection. "Did I accomplish anything this year?" I wonder to myself. How did those New Year's Resolutions turn out? Well, read on, because that's what this post is all about...

Continue Reading Post…

]]> <![CDATA[Deathmastree Data Visualization]]> http://www.zachstronaut.com/posts/2013/12/23/data-visualization-game-deaths.html http://www.zachstronaut.com/posts/2013/12/23/data-visualization-game-deaths.html Mon, 23 Dec 2013 10:45:02 -0800 Zachary Johnson http://www.zachstronaut.com/posts/2013/12/23/data-visualization-game-deaths.html#comments

For xmas I made a Panta Claus mini-episode for my game The Legend of Equip > Pants. This episode is the first in my game to introduce player death, and it is pretty challenging. I've been capturing players' paths through the level as well as where they are dying.

As a bit of thematic layering, and with data visualization in mind, I made the episode map itself in the shape of a Christmas Pantsmas Tree. I knew then that I could capture the data and play it back... and with a little smart use of shapes and colors... I could have the player map data visualization come out as a lovely holiday themed animation.

I titled this data visualization "2000 plays. 6000 deaths. 40 seconds." I think it turned out really great, so I wanted to share it with all of you.

Update: Turns out Kotaku thinks it is cool, too!

Continue Reading Post…

]]> <![CDATA[The Legend of Equip > Pants]]> http://www.zachstronaut.com/posts/2013/11/27/adventure-rpg.html http://www.zachstronaut.com/posts/2013/11/27/adventure-rpg.html Wed, 27 Nov 2013 16:14:03 -0800 Zachary Johnson http://www.zachstronaut.com/posts/2013/11/27/adventure-rpg.html#comments The Legend of Equip Pants.

I'm very pleased to announce my first commercial video game release! The Legend of Equip > Pants is a pantsventure RPG taking place in an alternate universe where an old man in a cave would hand Link some wooden underwear instead of a sword (if there were old men living in caves). The game unveils itself as a series of brief episodes, because who has the energy to stay invested in 40 hour long RPG plots anymore? I sure don't.

Currently available for free for iPhone, iPad, and iPod touch. Coming soon to Windows/Linux/Mac on the Chrome Web Store. GoGetYourPants.com

Please try it out! Episodes 1 and 2 are now playing.

The Legend of Equip Pants

Continue Reading Post…

]]> <![CDATA[Beemo - Adventure Time iOS App]]> http://www.zachstronaut.com/posts/2013/07/24/beemo-ios-app.html http://www.zachstronaut.com/posts/2013/07/24/beemo-ios-app.html Wed, 24 Jul 2013 19:45:57 -0700 Zachary Johnson http://www.zachstronaut.com/posts/2013/07/24/beemo-ios-app.html#comments #falling-rocket { -webkit-transform: translateZ(0); /* prevent bizarre footer wiggle */ } .beemo { position: relative; overflow: hidden; } .beemo > img { float: left; } .beemo .beemo_home { position: relative; } .beemo .beemo_blink { position: absolute; left: 24px; top: 100px; width: 250px; } .beemo .carousel { position: relative; float: left; width: 300px; height: 576px; background: url(/posts/beemo/iphone-template-300.png) 0 0 no-repeat; overflow: hidden; cursor: pointer; } .beemo .carousel .crop { position: absolute; left: 22px; top: 95px; width: 256px; height: 384px; overflow: hidden; -webkit-transform: translateZ(0); /* prevent annoying flicker */ } .beemo .carousel ul { list-style: none; margin: 0; width: 2000px; -ms-transition: -ms-transform 300ms ease-out; -webkit-transition: -webkit-transform 300ms ease-out; -moz-transition: -moz-transform 300ms ease-out; -o-transition: -o-transform 300ms ease-out; transition: transform 300ms ease-out; -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } .beemo .carousel li { float: left; -webkit-transform: translateZ(0); /* prevent annoying flicker */ }
Beemo Screenshot. Beemo blink animation.

Mathematical Opportunity!

Ham in the Fridge and Cartoon Network.

I had the joy and privilege of working on the Beemo - Adventure Time iOS app. I'm a huge fan of the cartoon, so this was a special project for me.

The app was produced by Cartoon Network and designed by Ham in the Fridge. My company Zachstronaut LLC was hired by Ham in the Fridge to program the app for iPhone, iPad, and iPod touch.

Continue Reading Post…

]]> <![CDATA[Oculus Rift: First Inspirations (Updated x2!)]]> http://www.zachstronaut.com/posts/2013/06/14/oculus-rift-first-inspirations.html http://www.zachstronaut.com/posts/2013/06/14/oculus-rift-first-inspirations.html Fri, 14 Jun 2013 12:59:12 -0700 Zachary Johnson http://www.zachstronaut.com/posts/2013/06/14/oculus-rift-first-inspirations.html#comments As I've already written about, I had the pleasure of trying out the Oculus Rift for the first time last night at IGDA-TC. I spent about 3-5 minutes in the so-called Tuscany Demo of 90 year old grandmother tries the Rift fame. I found the experience very inspirational. I thought I'd share some of the ideas and aspirations for VR that sprung to mind through my experience. If you'd like, you can also check out my post about my first impressions of the Rift itself.

The obvious application of the Oculus Rift is 3d first person style environments. There will be an endless supply of first person shooter "hardcore" video games for the Rift, and that really is its self proclaimed target market and audience. It is so obvious that it is not even particularly interesting to me, perhaps compounded by the fact that my once love of FPS and "hardcore" games steadily fades away. I think there will be some good first person, immersive exploration and puzzle games that I would enjoy on the Rift. I also think some of the racing/simulation games could be really fun.

But none of those games are why I am excited about the Oculus Rift. To me, the experience of immersion when you've put on the Rift is itself the most compelling part of the product. It is an experience you fundamentally cannot get anywhere else, and it will be truly new to almost all of us. I now believe that even a fixed 2d television-like display experience that completely fills your field of view like the Oculus would be a novel and interesting product itself. However, when you add in the 3d view and nearly perfect head tracking of the Rift, the immersion becomes complete and you've got something special. It is the difference between an omnitheater movie about the Amazon, and actually standing in the Amazon yourself. Well... if the Amazon were pixelated, and without smells or anything you could touch, but still. Let's remember this is a very early product, and technology moves fast...

Continue Reading Post…

]]> <![CDATA[Oculus Rift: First Impressions]]> http://www.zachstronaut.com/posts/2013/06/14/oculus-rift-first-impressions.html http://www.zachstronaut.com/posts/2013/06/14/oculus-rift-first-impressions.html Fri, 14 Jun 2013 12:57:17 -0700 Zachary Johnson http://www.zachstronaut.com/posts/2013/06/14/oculus-rift-first-impressions.html#comments I had the pleasure of trying out the Oculus Rift for the first time last night at IGDA-TC. I spent about 3-5 minutes in the so-called Tuscany Demo of 90 year old grandmother tries the Rift fame. The experience was significant enough that I felt like I should record some thoughts on it for myself, and I figured I might as well share them. I also found the experience very inspirational. I've written up some of the ideas and directions that sprung to mind in a separate post, Oculus Rift: First Inspirations.

I was actually sitting in a chair at a bar when I put the Rift on. My big glasses got in the way a little bit, and made what I'm otherwise convinced would be a remarkably light and comfortable headset put some pressure on my face. This is easily fixed with contacts, smaller glasses, or cheap plastic lens inserts that pre-bend the light for my correction. Anyway, a new world instantly came into focus. The 3d effect was instantaneous and completely transparent to the experience, and the immersion was total. Your entire field of view is filled with the environment. It's not like watching a 3d movie at all. It's like being inside a 3d game, but with better 3d. The head tracking was for my purposes flawless. I immediately and quite naturally found myself turning my head to look around this new world I was in. I looked straight down... no feet! I guess for some people it is quite unsettling to be missing their body. For me, it just made me aware again that I was sitting in a chair looking at a simulation. It broke the illusion for a split second.

The display isn't very high resolution, but this is a dev version and the consumer version will be better. You can see the pixels, well really the lines between the pixels, which is sometimes called the screen door effect. My awareness of the pixels and this grid would come and go as I looked around and moved around the environment. It was pretty easy to forget it was there, but I definitely look forward to much higher resolutions in the future.

It was very hard not to lose yourself in the experience. I kept forgetting myself and where I was. I wouldn't quite say that this other place I found myself in felt real, but I also wouldn't say that it felt not real. And I felt like I wasn't exactly sitting in a chair in a bar anymore...

Continue Reading Post…

]]> <![CDATA[Fixing the UX of Infinite Scroll]]> http://www.zachstronaut.com/posts/2013/04/15/infinite-scroll-ux-fix.html http://www.zachstronaut.com/posts/2013/04/15/infinite-scroll-ux-fix.html Mon, 15 Apr 2013 18:08:32 -0700 Zachary Johnson http://www.zachstronaut.com/posts/2013/04/15/infinite-scroll-ux-fix.html#comments

Infinite Scroll aka Endless Scroll sucks. It's that feature where you can scroll down forever on Twitter or Facebook and more content keeps loading. It's a brilliant UI idea in theory, but it creates all sorts of obnoxious problems for the user in practice... like breaking the Back button, and creating mortal dread around clicking things for fear of losing your spot...

I presented a session at MinneWebCon 2013 titled "Fixing the UX of Infinite Scroll" (view the slides). In the presentation, I think through the User Experience issues we need to address, and I dive into the HTML5, CSS, and JavaScript features we can use to code up a better Infinite Scroll... one where you don't lose your place when there is an error or when you click a link or your Back button... one where you can skip back in time fast without having to scroll forever... an infinite scroll solution that embraces the web and how browsers work!

I integrated my Infinite Scroll fix ideas into a basic install of WordPress. View the Proof of Concept Demo. It's a little rough around the edges, but a solid demo nonetheless. The fix largely comes down to using scroll events and the HTML5 History API.

Here's my main.js file with patch code for jQuery/WordPress Infinite Scroll.

Continue Reading Post…

]]>