Skip to main content

Posts

Corona - Reloading a scene with transition effects

Corona has a quite nice composer library allowing you to work with scenes and moving between them without too much effort. If you're not already using the composer library in your Corona made app or game you should definitely start doing so right away. One thing that I do miss in the composer lib is the option to reload the same scene while still making use of the provided transition effects such as "fade" and "slideRight". What happens when you call composer.gotoScene() to reload the current scene is that the scene will be hidden immediately without any transition effects before it's reloaded. One way to create a smooth transition while reloading a scene is to handle it manually with a little help from the transition lib. For example, to create a fade out/in effect you could do something like the this: Create a black rectangle filling the entire screen. Make sure it's inserted above all other graphics. Set it's alpha to 0 to make it invis
Recent posts

Collecting feedback from mobile game beta testers

Ok, so you've almost finished your game and want to take it for a spin by distributing a beta version. Let's assume that you're quite satisified with the design and functionality, and you have also somehow managed to get a solid amount of testers interested in your game. That's aweseome, but a few big questions still remain unanswered: When are you planning to collect feedback from your testers? How are you going to collect it? What kind of feedback and statistics do you want to collect? These are not easy questions to answer, but if you want to get the most out of your beta testers you need to think about them. Hard. I don't have the knowledge or experience to say what works best, what you should/must do, etcetera. But I did think about this a lot while planning the beta testing for my iOS game Ice Trap recently, and I'll try to explain what I did and why. Let's get started. When to collect feedback When I discuss the issue of when to

Compressing PNG images recursively with pngquant

Do you have a large amount of PNG images and need to reduce the file sizes? Try pngquant , it's great! Especially for mobile apps and games it's really important to keep the final download size down. This because you can't rely on people around the globe having access to high-speed Internet connections and unlimited amounts of free mobile data. In it's simplest form you can just run the following command to compress all the PNG images in the current working directory: $ pngquant 256 *.png One "problem" with this command is that it creates new image files instead of overwriting the existing ones. This might be nice sometimes, but is usually not what you want. To overwrite your files, just add the --ext and --force options like this: $ pngquant --ext .png --force 256 *.png Ok, that's nice, but what if you have your images structured in a directory tree? Going into each directory to run pngquant can quickly become a tiring task if you have

Creating animated GIFs on Windows the easy way

As a game developer you often want to show off parts of your work, for example on Twitter or Facebook. Sometimes plain images are enough, but other times you might have a cool game sequence that requires animation to come alive and get the proper attention. You could record video clips and share them with your followers on YouTube etcetera, but most of the times you're probably better off by just creating an animated GIF instead. Creating animated GIFs is of course nothing new, and not only useful to game devs. From my experience it's an excellent way to quickly demonstrate new features and ideas no matter what you're developing, without the need to have a working prototype. It took me a while to find my favorite tools that allow me to create GIFs of decent quality quickly and without hassle. Which tool to use depends on what you need to do. Basically, there are two different scenarios where animated GIFs come in handy. 1. Record an actual video sequence (e.g. gamepla

React Native v0.44 - Unable to resolve module react/lib/ReactComponentTreeHook

I have this app built with React Native v0.44. The current version is 0.48 but I haven't had time to upgrade during the summer, and when I tried to do so I got all kinds of weird dependency errors so I decided to stick with 0.44 for a little while longer. Yesterday I bought myself a new Macbook to finally put my old choking Macbook Air from 2012 out of its misery. I cloned my git repo, ran npm install, but when I tried to launch the app in the iOS simulator it stopped with the following error: Unable to resolve module ReactComponentTreeHook from node_modules/react-native/Libraries/Performance/Systrace.js I tried to clean up and reinstall a couple of times since that usually solves quite of lot of dependency errors, but this error persisted and I had no clue what was causing it. After searching the Internet for a little while I found this page presenting a couple of possible solutions worth trying . The first solution suggests using react-native-git-upgrade, and that's t

Falling leaves with Corona SDK and transition2

The latest addition to my transition2 library for Corona is the convenience function fallingLeaf() . I was working on my iOS game  Ice Trap , trying to create a "confetti cannon" effect when the player completes a level and achieves three stars. While playing around with the existing transition functions I managed to reach a quite decent result by combining several different transitions. It took me a while to get there, so I realized that it would probably be nice to turn that combination of transitions into its own convencience function. At its simplest use, you only need a few lines of code to create a leaf that falls smoothly towards the bottom of the screen following a seemingly random pattern: local transition2 = require ( "transition2" ) local leaf = display.newImageRect( "leaf-64px.png" , 64 , 64 ) leaf.x, leaf.y = display.contentCenterX, 0 transition2.fallingLeaf(leaf, {}) Simplest possible use of fallingLeaf() Ok, so that l

transition2.zRotate(): Rotate Corona display objects in the z dimension

I just added another transition function called zRotate() to my transition2 library for Corona. You guessed it, it rotates a display object in the z dimension around either the x or y axis. It requires the display object to have a path with four nodes (x1, y1) to (x4, y4), like images and rects do. If you want to know more about what transition2 is, you can read this blog post . A simple vertical rotation could look like this: transition.zRotate(coronaLogo, { degrees = 360 , time = 3000 , iterations = 0 , transition = easing.inOutSine, reverse = true , }) A little more complex example of a horizontal rotation with a color effect at the end of each iteration. Note that this example utilizes two new params: iterationDelay and onIterationComplete (which is not the same as onRepeat). transition.zRotate(coronaLogo, { degrees = - 1440 , time = 4000 , iterations = 0 , transition = easing.inOutQuad, perspective = 0.75 ,