2014 - 8 - 4 / 11:52 am / general
News is spreading fast that the famous Dan Adelman has left his job at Nintendo to pursue helping indie game development teams with business development and marketing. How awesome is that! What's even more awesome is that I got to make Dan's new website for him. Check it out!
The site is actually created as a custom Tumblr theme which ended up being pretty straight forward to set up. I find it way easier to work with than WordPress, although you don't have as much freedom to host it yourself. Working with Tumblr definitely has its kinks though. The work flow can get pretty weird towards the end of the development... I ended up having to copy and paste the entire template for the site over and over again to update things which is pretty strange, but hey it works!
This is also the first site I've done with any sort of real responsive design. Check out how the site changes when the screen width changes.
It can be squeezed down pretty far in case you're viewing it on a Game Boy.
I had a lot of fun making this site! Haven't really taken on any web development work in awhile, so I had to shake a lot of the rust off, and I got to learn a lot of new things along the way.
2014 - 6 - 29 / 4:59 pm / general
My break from game development ended up lasting a little bit longer than I expected, but I had a good vacation in the world of web design and development. Unfortunately the stuff I worked on is totally top secret, and will be for a little while still, but when it comes time to finally reveal it I'll be sure to post about it here.
There were a few more things that I learned or picked up that came in handy during this last project and I thought I would just share a few of them again.
Tumblr Custom Theme Documentation
This lastest web project involved using tumblr as the content management system. I haven't done any work with tumblr before, but it turned out to be pretty straight forward and overall really easy to work with. Unlike Wordpress I never have to even venture into php territory. Tumblr seems to use some kind of built in templating system that takes care of everything behind the scenes. The official documentation on how to build a tumblr theme actually ended up being the best resource for getting started on it. A lot of the other tutorials I found on theme building were already outdated, so I just stuck to using control-f on the documentation whenever I needed to know something.
This is a quick and simple tumblr theme that implements all of the essential tags. This was a great place to get started and see how the various tags work along side some HTML and CSS. There was one guide that recommended starting with this, and I used it as a guide when I was starting on a custom theme.
Open Graph Protocol
If you want posts to be shared around properly on Facebook then having open graph meta tags in your HTML is essential. You're able to define things like the preview image, description, and title of your articles, which can be very important for when your awesome web page finally goes viral with all the kids. Facebook and other social media things can parse some things from your site automatically, but sometimes the layout of your site will cause it to parse the wrong things so these tags are a way to overcome that.
Social Media Templates
Related to the Open Graph tags, here are templates that cover the rest of the core social media tags. The meta tags for Twitter and even Google+ are available here to copy and paste into your web zone. Once again just useful for controlling what info shows up when people share your site across various social media sites.
Tumblr Static File Upload
When working with a custom tumblr theme you have two main options when it comes to hosting resources. You can either host them all remotely on a separate web server, or you can just upload all of the files to tumblr and have them worry about it. I found that my work flow was best when using a remote server for awhile, and then when things were more concrete I migrated over to the tumblr server. Using the tumblr static file upload you can host all of your files directly on tumblr, but it comes more of a pain to modify and reupload files (like css, font files, images, etc.) Ultimately I think using tumblr's servers for the final product is the best bet.
Firefox Cross Domain Font Fix
This one is pretty technical, but is super important when it comes to using the @font-face properties in CSS with a custom tumblr theme. Firefox cannot load fonts across domains without explicit permission from the host domain. Since the tumblr servers do not have this permission properly implemented, any custom fonts you try to load with the @font-face property will just not load on Firefox. Apparently this is the correct behavior, but kind of annoying since Chrome doesn't seem to care at all where fonts come from. The fix is simple enough though. By encoding fonts as base64 data directly into the style sheet Firefox is able to load the font no problem.
I think that's all for now! Hopefully today I can dig back into game development work, but I had a lot of fun brushing up on the latest web development action.
2014 - 6 - 20 / 12:43 am / general
Things have been pretty quiet around here for a couple of days! I'm still working on video games, but recently I decided to take up some (hopefully) quick web design work! Although I can't share the details of what I'm working on, I can share some resources that came in handy for prepping me for the new world of web design.
My work flow for sites is terribly outdated in the modern world where 55% of web traffic apparently comes from mobile devices. Then on top of that, some desktops are now reaching resolutions of 2000+ horizontal pixels with retina displays and just plain ole huge monitors. The web is always changing, and it has changed a lot since I've really buckled down for a design project.
Web Field Manual
This is a link to a collection of more links! A lot of the stuff here was pretty useful for getting set up with a new work flow, and to catch up on recent trends in web design. Separated by category, I think I looked through almost every link they offered.
About a billion of free to use icons (as long as you attribute the source) for any sort of design needs.
Useful for taking a look at various styles that are designed with responsiveness in mind. See how various templates respond to various mobile device resolutions.
Responsive Grid System
A pretty nifty responsive grid framework to use when developing a responsive site.
Another nifty grid system for responsive design. I used this for the Otter website.
A collection of high resolution totally free to use stock photos, and it's updated frequently.
Pretty straight forward inspiration gallery of recent cool and/or hip websites. Some of these are a little bit too trendy but there's a lot of good stuff here to check out.
2013 - 8 - 26 / 11:57 am / general
Gravity Ghost is now up for pre-orders! A lovely game by one of my house mates Erin Robinson. She needed a fancy pre-order page so I returned to the war zone of HTML and CSS to make some magic happen.
The big screenshot of the site is a little wacky because of some of the parallax scrolling and background positions that I used. Certain elements stay in place when scrolling, and some scroll with some parallax, it's very fancy. I also made use of a lot of the artwork directly from the game for a majority of the elements on the site. I think it turned out pretty well! Check out Gravity Ghost!
2013 - 4 - 30 / 4:28 pm / general
The TIGJam 5 site is now live and registrations are open! Make sure to sign up soon if you want to go to one of the coolest jam events of the year.
(Also ignore the glaring typos on that image of the site for now.)
2013 - 4 - 9 / 1:32 pm / games
Right before GDC my friend Tim Winsky released his first iOS game into the market, Indiana Stone: The Brave and the Boulder. He needed a quick and simple promotional site for the game, so I stepped up to the job.
The game itself is pretty rad too, and you should totally check it out, and then buy it and then tell all your friends to buy it. Viral marketing.
Hi there, my name is Kyle, and I'm a 27 year old kid with adult powers. I'm making video games and living the indie game developer life in Tempe, Arizona. Here you will find my thoughts, games, websites, doodles, and other stuff like that. I worked on Snapshot, Offspring Fling, and a whole bunch of other games. I also created and maintain Otter, a 2d game making framework. If you want to get a hold of me use the form on the bottom of the page, leave a comment, or just tweet at me. I try to post three times a week. Thanks for stoppin' by! You're the coolest.
- alec holowka
- bill pullman
- dev log
- game dev
- game jam
- good times
- kings men
- ninja slash
- offspring fling
- screen sat
- space sushi
- august 2014 (11)
- july 2014 (10)
- june 2014 (13)
- may 2014 (13)
- april 2014 (13)
- march 2014 (14)
- february 2014 (15)
- january 2014 (15)
- december 2013 (14)
- november 2013 (15)
- october 2013 (13)
- september 2013 (14)
- august 2013 (15)
- july 2013 (10)
- june 2013 (14)
- may 2013 (14)
- april 2013 (15)
- march 2013 (13)
- february 2013 (15)
- january 2013 (3)
- december 2012 (1)
- november 2012 (2)
- october 2012 (1)
- september 2012 (4)
- august 2012 (1)
- july 2012 (1)
- may 2012 (1)
- april 2012 (1)
- march 2012 (1)
- february 2012 (1)
- january 2012 (1)
- november 2011 (2)
- september 2011 (1)
- july 2011 (1)
- june 2011 (1)
- may 2011 (1)
- april 2011 (2)
- march 2011 (4)
- february 2011 (4)
Do you want to make a Let's Play of one of my games, or a just a video featuring footage of my games? You have my full permission to do so! Even if you are monetizing your videos, you still have my full permission to use any footage from any of my games. Go for it!