Posts tagged "Fireworks"

January 27, 2013

Building a Memory Game: Time Lapse Video

This is inspirational. Watch developer Jesse Warden build out a game in 12 hours using Flash Professional, Audition, Fireworks, Photoshop, and Sublime Text. He is using the Corona SDK for development targeting mobile.

It’s great to see that the Creative Suite workflow is applicable even when targeting something non-Adobe like Corona! The big take-away though is what can be accomplished in such a short amount of time. I’ve learned much from short game jams and such – students can gain lots of experience across applications doing the same. Game development is a great way to teach workflow and get students familiar with the tools and platforms.

I built a Memory game (like Simon Says) in Corona SDK in 12 hours over Memorial Day weekend, recorded it, and compressed it to 7 minutes here. I used Adobe Flash, Fireworks, and Photoshop to do the artwork, Audition to do the audio, and Sublime Text 2 to code the Lua in with Ansca Mobile’s Corona SDK. I use Tower to check the code into Github.

If you want to get involved immediately – join the One Game A Month initiative! You don’t have to make anything complex… just hone your skills by building simple concept games. That’s what I’m doing. I know there are a few other AELs who have joined #1GAM / #OneGameAMonth as well – be heard in the comments and tell everyone how useful an effort like this is!

It’s easy to get started.

2:33 PM Permalink
January 24, 2011

Designing a WordPress Child Theme Using Adobe CS5

I’ve been wanting to take control of my personal blog theme for some time in order to both simplify how everything was being displayed, and to obtain a greater degree of flexibility over time. There are a lot of great themes out there for WordPress, and I’ve been fairly happy with many of those I’ve tried – but they still were not exactly what I wanted.

I decided to come up up with something of my own by creating a child theme of the default WordPress “TwentyTen”. Seeing as how I don’t need many features on here, and that “TwentyTen” is a modern design that supports all the new 3.0 features, a child theme sounded perfect. I also tend to shift these around over time, and this would allow that as well.

Adobe Fireworks

Adobe Fireworks

The first thing I did is sketch out on paper a sample of the sort of layout I was looking to create. I then created a basic measured layout in Fireworks, followed by a number of textured image segments for the navigation menu, page background, and content area. Fireworks is great for stuff like this, due to the robust texturing system available.

Adobe Dreamweaver

Adobe Dreamweaver

Dreamweaver CS5 has extended support for PHP-based CMS and blogging systems like WordPress. During prerelease, I was playing around with these features quite a bit but had actually never done any work with the final release. It’s actually very convenient to be able to view and interact with the live website files (on my testing server, of course) while designing and tweaking elements of the theme. Dreamweaver can also be enabled to provide code-completion for core WordPress functionality, although I didn’t need it in this case.

Most of what I did was remove a lot of the header stuff I didn’t need, and create a custom navigation menu along the top of the page. The rest of the work was just a lot of CSS hack and slash to get things looking right, setting up new elements, and skinning everything with my exported images. It actually went a lot more smoothly than anticipated.

Adobe BrowserLab

Adobe BrowserLab

Most of the cross browser rendering checks were done on my local machine using Chrome 8, FireFox 4 beta, and Internet Explorer 8. I have other machines I could log into and check browsers like Opera or the IE9 beta, but don’t have a way to test on OSX from my home. Anyone familiar with DropFolders knows the snails-pace I take when it comes to doing any Apple stuff… So I fired up BrowserLab and was able to check my basic design rendered on what must have been nearly 20 different browsers across Windows and OSX.

It is interesting to see how relatively similar the design rendered across browsers. The most trouble that I noticed was lack of support for my embedded fonts in older browsers. You can also see in the above image that we definitely have some shifting going on in regard to the positioning of elements on the page, but nothing so terrible to render the design unusable.

I’m very pleased with both the resulting design, and the simple, unified workflow involved in getting to this point. There are lots of little things that will probably come up which I’ll modify in the future… but it’s great to know now how very simple it will be to do so.

Check it out over at http://inflagrantedelicto.memoryspiral.com/!

8:39 PM Permalink