Icon Sizes Needed For Android and iOS

icon_size_for_ios_androidHere is a good list for the icon dimensions required for making an app for iOS and Android. I made this list for our latest game Blockwick 2. Note that the largest sizes are for the respective marketplaces.

Android

  • 512 × 512
  • 192 × 192
  • 144 × 144
  • 96 × 96
  • 72 × 72
  • 48 × 48
  • 36 × 36

iOS

  • 1024 × 1024
  • 180 × 180
  • 152 × 152
  • 144 × 144
  • 120 × 120
  • 114 × 114
  • 76 × 76
  • 72 × 72
  • 57 × 57

Blockwick 2: Why Premium?

small_blockwick_2_puzzle

For the past five years we’ve experimented with a bunch of revenue models for apps, free-to-play, freemium, ad-supported, and of course, premium. So why have we returned to premium when most of the top grossing apps are using different models? The short answer: It is a better experience. We are far more interested in design, gameplay, and user experience than using psychological tricks to try to boost revenue. It’s the kind of experience that we prefer as users ourselves.

Why compromise a beautiful design with gaudy and distracting ads and/or constantly pulling a player out of the experience and bothering them with in-app purchase requests and other annoying pop-ups? Maybe free-to-play does work, but it’s not the kind of experience we enjoy, and it’s not the kind of experience we wanted to make for Blockwick 2. We made something we are proud of. Hopefully enough of you feel the same way.

Help us spread the word about Blockwick 2 and quality puzzle games; share this post!

Sticky Block Tutorial

Of all the specialty blocks introduced in Blockwick 2, sticky blocks often present the biggest challenge. They cling to everything and won’t let go without careful maneuvering. Here’s a video that demonstrates some of the techniques for manipulating sticky blocks.

Making 3D Flip Blocks Fit into the 2D World of Blockwick 2

blockwick_2_flip_blocksBlockwick 2 is rendered completely with 2D sprites except for one special block type, the Flip Block. With so many possible arrangements of colors and animations, using 2D sprites would have been far too complicated and tedious to implement. Using a 3D asset made the most sense as we need to be able to select a color for all six sides and animate the block flipping over as it rolls around the board. The animation is especially important as it allows the player to understand that with each move the block is rolling rather than sliding.

First, our designer, David, modeled the 3D asset in Blender. Once in Unity, we needed to rotate the Flip Block around the X-axis to match our the angle of three dimensional illusion from our 2D sprite.

blockwick_2_flip_blocks_in_unity

Since our 2D tile grid is non-square, even with the flip block rotated, it still lines up perfectly with all the 2D sprites. Now we light the Flip Block(s) with a single directional light rotated an angle based upon the length of the block shadows. It’s a good start, but our shading if far too dark and not at matching the style of the rest of the scene. So we crank our ambient light color all the way to pure white and adjust the intensity of our directional light. This is now essentially mimicking the screen shader used to render the normal Color Block sprites. Finally, we adjust the specular colors for materials that are applied to the faces of the Flip Block for a bit of fine tuning.

http://kiefferbros.com/blog/wp-content/uploads/2015/06/blockwick_2_flip_block_in_unity_2.png

There you go, a 3D-lit object mimicking the style of the 2D game. Check out blockwick.com to see it in action.

The Colors of Blockwick

colors_of_blockwick

Here is a comparison between the colors used in the original Blockwick and Blockwick 2. It’s apparent that the sequel’s colors were based on the original, but we wanted to go a bit more vibrant. We also decided to use two less colors. To see the game visit Blockwick.com.

 

Making Better Puzzles for Blockwick 2

We wanted to make the difficulty progression in Blockwick 2 a bit smoother and slower than in the original, so after building near 250 puzzles, we decided to enlist a band of fearless puzzles testers to help us sift though them and rate them according to difficultly and enjoyability.

blockwick_2_beta_ratings

After solving a puzzle, a screen would pop up that asked the player how difficult and fun they thought the puzzle was. We then waited about a month to let the puzzle testers have at it. After this testing period, we gathered all the ratings into a spreadsheet along with time spent on each puzzle, moves per puzzle, and other related info, and filtered it through two algorithms designed to suggest each puzzle’s difficulty and likability. We then color-coded this data for easier analysis.

blockwick_2_beta_ratings_analysis

It’s often surprising which puzzles are found difficult or easy. We can be quite certain a puzzle will be rated very difficult only to find most players had no trouble at all with it (and vice versa). Same goes for enjoyability. I think this comes from just being too close to a project; you lose perspective. Getting outside feedback is essential.

Blockwick 2 is now available on the iOS, Amazon, and Google Play.

A big thanks to everyone who helped us play through the early versions of the game and rate puzzles! We really appreciate your feedback!

Making Glyphs for Blockwick 2

blockwick_2_glyphs

Those little symbols on the floor are called glyphs (pictured above on the left). If you can solve a puzzle (by bringing each color group together) and are able to get all three of the glyphs covered up with the color blocks you’ve achieved “illumination” (pictured above on the right).

In the original game, Blockwick, we used glyphs to identify block type. There were 12 different block shapes, and each shape had it’s own specific color and glyph. Every chapter introduced another block shape with it’s own glyph, shown here:

blockwick_2_glyphs_2

The problem with having a glyph for every block shape in Blockwick 2 was that we substantially increased the number of shapes (from 12 to 70), so putting glyphs on every block type seemed overly impractical. Thus we came up with the idea of making the glyphs a little more integrated into the actual gameplay. Putting them on the floor adds an extra challenge, and another layer of replayability.

So when it came time to design the aesthetics of glyphs, we knew we wanted draw from the original game but obviously stay within the simpler minimalist framework of the new game. The original Blockwick’s glyphs have a soft, organic feel to them. They are hand drawn, a tad sloppy, but definitely still mysterious. Blockwick 2 is crisp and minimal. It’s cleaner with less fuss. An obvious reference point for us was the font Futura. We had used it in the original game and were planning on using it in the sequel. We still used the same symbols from Blockwick, but for Blockwick 2 they are cleaned up, geometric, and very much informed by Futura.

blockwick_2_glyphs_3

Above in this comparison you can see how Futura’s weight and simplicity inform the Blockwick 2 glyph. The glyphs do however maintain their own identity, specifically by their use of rounded corners and unique structures.

blockwick_2_glyphs_4

Blockwick 2 is coming out this Thursday, March 5th. Check out the trailer here.

Blockwick 2 Rounded Corner Collisions

To make dragging blocks user-friendly, rounded corners for our collision objects are key. Getting stuck on a corner is frustrating and detractive. We want people to solve puzzles not fight with the game.

blockwick_2_rounded_corner_collisions

As this was our first project using Unity 3D, I was excited to use the built-in physics and save some time. Setting up the shapes and mechanics was simple enough, but after a week of prototyping, it was clear that standard game physics were not going to cut it. Physics instabilities, catches on invisible corners, extra processing for things like rotations, forces, collision event callbacks, etc. It was too general a solution for a specific problem.

All of the above considered, it was necessary to create a custom physics solutions that only took into account what we needed: rounded corners and non-overlapping collisions.

I just need two types of collision shapes, edges and corners. An edge is simply a box with a normal vector. A corner is a circle and box that defines what quadrant of the circle to use. The one constraint of the system is that blocks should never move farther than the radius of a corner. That’s pretty much it!

Now, all we have to do is move the selected block towards the touch location and iterate over the collider arrays, moving the colliders away from each other based on edge normals and corner quadrants. To move blocks faster do more physics steps each frame.

Blockwick 2 is coming to iOS and Android next Thursday, March 5th. Check out Blockwick.com for more information.