AlternativaGUI - an easy way to create an integrated interface

A library for creating user interfaces AlternativaGUI has been published. Download it from the official website of AlternativaPlatform company in GUI section. The library is free and can easily be used, including in commercial projects. According to the license agreement you only need to specify in the project the page link alternativaplatform.com.

AlternativaGUI provides greater flexibility in terms of creating new components or modifications of existing interface, which is achieved by using only the core classes. The library offers a wide range of user interface elements such as buttons, containers, container line, scrollbar, tools for working with raster graphics and more.

AlternativaGUI Features

• High performance
  Performance is achieved by the efficient work of all components of the interface in a single system. At the base classes implement only the required functional, hence the low consumption of resources.
• Flexibility
  The library allows to create various graphics and can control their properties. Simplicity and clarity of API library allows you to extend all the classes are very easy to add and it is so functional that you need.
• LOD elements
  AlternativaGUI allows you to develop an interface for different screen resolutions. This is accomplished by using different LODs for UI-elements (LOD - Level Of Details) and the correct scaling (for components with raster graphics). Each element has several LOD graphics states. When switching LOD may change the font size, icon size, can be hidden unimportant elements or, conversely, offers additional information. This logic is described by the developer. LOD switching is automatic. A special use of LOD is the development of interfaces for mobile devices with different screen resolutions.
• The quickness of creating unique component
  Through the use of base classes, the creation and management component runs on a deeper level. Base classes do not contain any graphics, and determine only the logic of the components.
• User friendly API
  Working with components AlternativaGUI is like working with the standard classes such as Sprite.

For rapid prototyping interface was developed the skinned library AlternativaGUI Default Theme, which contains the basic components. This library is available with source code.

Download AlternativaGUI
Read documentation
Open demo in a new window

Read more: AlternativaGUI - an easy way to create an integrated interface

How to Add Mouse Gesture Control to Your Flash Projects: Single-Stroke Gestures

I recently bought my first Bamboo, a Wacom tablet that recognises letters from shapes drawn with the stylus. It tickled memories of my first experience with gesture-controlled application: using mouse gestures, web browsers such as Maxthon (and later Opera) allowed users to quickly move back and forth through webpages in the history, switch between different tabs, and so on. I was facinated by its neat user interface, as it takes away traditional mouse clicks. Of course, sophisticated gesture-controlled devices such as the Kinect, iPad and iPhone are now available – but it all started with the good old PC. In this tutorial, you’ll learn how to develop a photo gallery that recognises singular mouse gestures.

---

Final Result Preview

Let's take a look at the final result we will be working towards. To pan the photo galley in the four main directions, click and drag the mouse in the relevant direction. To scale a photo, drag the mouse South-East to scale up and drag the mouse North-West to scale back to the default size.

(Note: this doesn’t snap to center the photo when panning; it’s sensitive to the length of the line that you draw.)

---

Step 1: Tutorial Flow

Here’s what you’ll learn in this tutorial, and the order in which you’ll learn it:

• Vector interpretation of mouse gestures
• Hard coded implementation of mouse gestures
• Class to detect singular mouse gestures
• Sample application (photo gallery) using mentioned class

---

Step 2: Gesture Detection: Vector Analysis

It is important to understand the vector math involved in detecting mouse gestures. Having understood detection of a single direction, one can easily extend the understanding to apply to all eight directions.

The Flash presentation below shows steps of detecting a single mouse gesture to due right. To scroll through frames in the Flash presentation below, (mouse down – mouse move – mouse up) in any of the following directions:

• Eastward to scroll frame forward
• Westward to scroll frame backward
• Northward to jump to last frame
• Southward to jump to first frame

Read more: How to Add Mouse Gesture Control to Your Flash Projects: Single-Stroke Gestures

Effectively Organize Your Game’s Development With a Game Design Document

Have you ever dived right in to developing a game, but found yourself having to constantly change aspects of the design or the gameplay due to a lack of planning? You should consider using a game design document: a guiding vision of the game as a whole, pulling together ideas and plans for the design, development, and business sides of your game.

---

Introduction

To put it simply: we like to tell stories. Some true, some not so much. But the point is that we have been crafting tales for a very long time, and as time went by these tales began to evolve, becoming more complex, with richer details, with more and more fantastic backgrounds and appealing plots. Whole new worlds were born from thin air, hammered into shape in the anvils of the human brain.

And as the stories grew in complexity, so did the tools used in their making. Art diverged into several different categories, music became more elaborated and movies found their way into the world. Technological enhancements allowed sharing of information, spreading art all around the globe. New fantasy worlds were created each day. Worlds so rich made people began to desire becoming a part of them. A new concept was being brought to life.

Although video games were first just about getting the highest score possible when faced with a determined task, developers soon realized the endless possibilities laying ahead of them. Playing a video game is more than simply sitting through another story. For the first time one could have a say in how the tale told itself. Players could take hold of characters and live the hardships of the journey themselves, diving into that particular world and mastering it, making theirs the protagonist’s conquests and failures.

A game has the potential to bond player and story in a way never seen before. This connection can be established in a variety of ways. Be it the fantastic landscapes in which the story unravels, the soundtracks or the well-constructed personality of a particular character. It forces the player to thrive in order to see more of what he wants.

Unfortunately, since a game is composed of so many different elements, different experts from different areas are required in its creation, making the coordination of the development process a rather tricky job. In order to help developers do their job, a document known as a GDD, or Game Design Document, is often employed.

A GDD is a tool that helps merging the components of a game together. It registers the general ideas of every aspect of it, from graphics design to story line. In short it registers the game concept, creating the closer feeling of the finished product.

Although the writing of a GDD is not a vital part of the creation process, it is of major help to the team of developers, especially when in major projects, involving large amounts of personnel. Also, there is not only one way of writing a GDD. In fact, GDDs differ vastly among game development companies, but as a general rule, most games are built around these documents.

So without further ado, here is what you need to know about this important tool [...]

Read more: Effectively Organize Your Game’s Development With a Game Design Document

Create a QR Code Generator in Flash Using AS3

QR codes are everywhere these days: magazine advertisements, billboards, even TV commercials. Chances are you have a phone in your pocket that can read a QR code and decode the URL or message contained within. In this tutorial, you’ll learn how to create a SWF that can reverse the process: create a QR code from a URL or message. Read on!

---

Final Result Preview

Let’s take a look at the final app we will be working towards:

---

Step 1: Brief Overview

Using pre-made graphic elements we’ll create good looking interface that will be powered by several ActionScript 3 classes.

The code will make good use of a QR Code Encoder class, created by Jean-Baptiste Pin.

---

Step 2: Flash Document Settings

Open Flash and create a 480 pixels wide, 480 pixels tall document. Set the Frame rate to 24fps.

Create a QR Code Generator in Flash Using AS3

Design Tactics – Select Single

The other day I was coding a particular UI implementation and realized that I had coded the same thing in multiple languages multiple times. I knew exactly how I was going to go about it and did what I usually do and, as usual, it worked just right. I started wondering how many examples like that exist, and that it would be good to occasionally document them, if not for my own sake, then for the sake of others.

These things aren’t necessarily so broad in scope that I’d call them design patterns. I might call them a design strategy, but that still has the connotation of being broad in scope, and could be confused with the strategy pattern. So I thought of naming them design tactics. Kind of like hand-to-hand combat with your code.

The first one, and the one that sparked my interest in the subject, I call the Select Single Tactic. I’m sure you’ve done this plenty of times yourself. It’s basically the functionality of a radio button, a list, a menu or other navigation. You have a number of items, of which only one can be selected. When the user selects one, it usually changes its state to show that it is selected, and the other associated items will change their state as needed to show that they are unselected.

The most common scenario is that the user will click on an item to select it, so we’ll go with that idea. A common first start is to code the item so that it responds to the click directly, changing its state to selected. See the following snippet, kept in pseudocode as it can apply to just about any language:

// constructor
Item() {
        this.addEventListener(click, this.onClick);
}

void onClick() {
        this.setSelected(true);
}

Here, the item responds to its own click by changing its visual state to show that it has been selected. In some cases, this is fine, but there’s probably a more elegant way. However, we’ll leave it like this for now [...]

Read more: Design Tactics – Select Single

Flash Game Dev Tip #14 – How to create a Flixel plugin

Tip #14 - How to create a Flixel plugin When Adam created Flixel 2.5 he added support for plugins. Probably due to my constant harassing him on GTalk about it, but he did it all the same! And lots of my Flixel Power Tools take advantage of them. But it's not always easy to know when you [...]

Flash Game Dev Tip #14 – How to create a Flixel plugin

21st Century Game Design - Part I

21st Century Game Design, by Chris Bateman and Richard Boon, 2005.

Part I - Games exist primarily to satisfy the needs of an audience

ch1 - Zen game design

Zen Buddhism can not be learned, it can only be experienced. There is no objective perspective on anything. Hence zen game design's tenets: game design reflects needs + there's no single method to design + there exist methods to game design. These methods are:

• first principles: what you want to do -> game world abstraction -> design -> implementation
• clone and tweak: most common method. existing design -> tweak -> implementation
• meta-rules: goal = provoking debate. meta-rules -> design -> implementation
• expressing technology: in teams without actual game designers. technology -> game implementation
• Frankenstein: art or technical materials -> design -> implementation
• story-driven: narrative -> design -> implementation

Participants in the game project: audience, publisher, producer, programmers, artists, marketing/PR, license holder. Example: saving for causal audience is vital; for hardcore audience, it should not break gameplay; for programmers, it's a technical detail; for producer, it's looking at how other games do it.

ch2 - Designing for the market

The commercial success for a medium clears the way for artistic expression, not the way around

A game design is successful when the target audience is satisfied. This justifies the need for an audience model. Existing models: simple distinction hardcore/casual, distinction by genre (but genres are too vague), EA's model, and ihobo's model.

Simple hardcore/casual distinction

hardcore	casual
plays lots of games	plays few games
game literate	game illiterate
plays for the challenge	plays to relax, kill time, and just for fun
segment can be polarized: many can buy the same title	hard to polarize, diverse and disparate

EA's model:

EA's model take-away: do not ignore hardcores because they are the ones pushing a game to broader segments. Corollary: no TV ads are needed if the game is not made for casuals.

iHobo's model [...]

21st Century Game Design - Part I