Scale and position easing (Flash CS6)

By importing easing transitions into a flash actionscript 2.0 document-


import mx.transitions.Tween;
import mx.transitions.easing.*;

I can make objects move and change in scale, shape and position in interesting ways. The two I used were Elastic effects and Bouncing effects.

A square was made so when I moved the cursor over it the square would grow and once it reached the desired size it would almost 'bounce' on its boundaries like a ball dropping onto the floor until it stayed still then once I moved the cursor off again it shrunk and bounced into its original shape.

This was done with the following codes after naming the box 'box':



function easein()
{
new Tween(box, "_xscale", Bounce.easeOut, 100, 200, 1, true);
new Tween(box, "_yscale", Bounce.easeOut, 100, 200, 1, true);
}


function easeout()
{
new Tween(box, "_xscale", Bounce.easeOut, 200, 100, 1, true);
new Tween(box, "_yscale", Bounce.easeOut, 200, 100, 1, true);
}

box.onRollOver = easein;
box.onRollOut = easeout;


It can also be done so when the cursor moves over other objects or movie clip 'symbols' the box can change by having another object with the same code but it just has to have another name and be in the same function.

If you want another symbol to act independently then you must name the function 'function easing2() so it doesn't interfere with the first object, in this case the square.
The next shape I made was a circle which I named simply 'circle' and instead of a Bounce effect I had an Elastic effect which is very similar to the Bounce but instead of bouncing it wobbles a bit once made smaller or bigger. I did it like this:



function easein2()
{
new Tween(circle, "_xscale", Elastic.easeOut, 100, 300, 1, true);
new Tween(circle, "_yscale", Elastic.easeOut, 100, 200, 1, true);
}


function easeout2()
{
new Tween(circle, "_xscale", Elastic.easeOut, 300, 100, 1, true);
new Tween(circle, "_yscale", Elastic.easeOut, 200, 100, 1, true);
}

circle.onRollOver = easein2;
circle.onRollOut = easeout2;


This time I made the xscale grow bigger so when the whole shape grows it stretches along the xscale.

It is important to note there must always be a line of script for the yscale and xscale unless you only want a specific scale to be affected. If you want to only move the position of the shape you can remove the 'scale' from the code.

The 1 before true); on each line of code represents how many seconds it takes for the change to happen.

Slideshows in Flash CS6

Easy 4 page site with buttons and slideshow on page 1:

Each red button takes you to each page (each page is on 1 slide) like this:


stop();
Btn1.onPress = function()
{
 gotoAndStop(1);
};

Btn2.onPress = function()
{
 gotoAndStop(2);
};

Btn3.onPress = function()
{
 gotoAndStop(3);
};

Btn4.onPress = function()
{
 gotoAndStop(4);
};

The stop(); and gotoAndStop(number); makes sure it stops on that specific page (or frame). As you can see the first images are on the first page. All four images are on the first frame and the left and right arrows underneath the image change what images is on screen.

I did this by going inside the image so it is in its own library (double clicking the image).

once here I am given a fresh timeline, so I can give this image its own timeline. I place a different image on each frame, four in total of characters from a video game.

I made the buttons go from left to right by naming them individually and placing their name in this code:


stop();

nextBtn.onPress = function (){


nextFrame();



}
backBtn.onPress = function (){


prevFrame();



}

This was placed in frames two and 3 only because it would not loop the images when i got to the end of the left or right. For that I had to change what the buttons did on the two ending frames, 1 and 4.
On frame 1 the small change was:

PrevFrame(4);

Making the left button go from frame 1 to frame 4 while the right button stays the same.

On frame 4 it is the other way around, the difference being:

gotoAndstop(1);

making the right button go from frame 4 to frame.

Doing this gives the slideshow a smooth feel of an endless cycle through these four images

Slide 1 and 4 on the actionscript timeline had to have their own coding while frames 2 and 3 shared the same frames so they had the same effect of going left and right normally.

Once back into the main scene he timeline goes back to normal. Its like a timeline within a timeline.

Mouse following effect in Flash CS6

Recently I found out how to get objects to follow the mouse on the x and y axis at the same time so i can freely move the object around the screen at different speeds.

I made each object a movie clip and named each on Btn1 - Btn5, this smallest being Btn5.

With the following codes on a separate timeline alongside the timeline that had the circles i was able to get the all the objects to follow the mouse.

onEnterFrame = function ()

{

obj._x -= (obj._x - _xmouse)/17

obj._y -= (obj._y - _ymouse)/17

obj2._x -= (obj2._x - _xmouse)/15

obj2._y -= (obj2._y - _ymouse)/15

obj3._x -= (obj3._x - _xmouse)/13

obj3._y -= (obj3._y - _ymouse)/13

obj4._x -= (obj4._x - _xmouse)/11

obj4._y -= (obj4._y - _ymouse)/11

obj5._x -= (obj5._x - _xmouse)/9

obj5._y -= (obj5._y - _ymouse)/9

};

The /number on the end of each line gives a delay in the movement of the object named at the start of the line when it follows the mouse, the bigger the number the slower it moves. With the smallest moving the fastest it gives an almost 3d effect of a worm like creature moving around the screen.

Market Research

   Companies that do the most market research in the interactive media industry are often the most successful because they know what their target audience wants and what they would buy. Market research is crucial and must be done by interactive media industry companies to give them a very good images of what potential buyers like, dislike and what they would spend money on. Companies who don't undertake research, often primary research, are not so successful because they are pretty much running blind and hoping somebody is actually going to buy their product even though they don't know what people want to play and what they would buy so quite often they don't sell much at all.

   There are two types of research that people can use, Secondary and Primary. Secondary research is information and statistics taken from another source from books or online for example. Primary research is done directly by the person(s) themselves. Primary research is better because the information is fresh and directly from potential buyers whereas secondary research could be out of date, out of context and may not have all the information the company needs to reach full potential.

Types of primary research:
Questionairres
interviews
surveys


Types of secondary research:
Internet
books
newspapers
magazines

   Both methods of research are useful in different ways. Primary research is often done to find out information on their own products whereas secondary is done to find out about the market and what they should be aiming to do with their product.

   The companies in the interactive media industry should use surveys or questionnaires to conduct their primary research. Potential buyers should be directly interviewed or it should be done online on the companies website so people looking for their products can tell the company directly what they want.

   An interview often produces qualitative data which is opinions and words from the interviewees. This data is useful because the company can get into the minds of the target audience and know what they like and dislike and what they want to see in future products whereas quantitative data (numbers data), often taken from surveys only gives a rough idea of what the audience wants unless the questions give good results. Quantitative data shows how many people dislike or like things but doesn't say why. Qualitative data gives answers and reasons but the data is hard to keep track of.

Some secondary research we did included looking at apps for the Apple and Android phones. Below is a graph showing how Android's sales passed Apple's and is still rising. Although android started off small they suddenly grew in 2011.

Android was predicted to become almost level with Apple looking at the graph below but they were not expected to overtake them so drastically.

In these two graphs it shows that Apple and Android are the two leading competitors far ahead of all other competition. The bar chart below shows this the best. It is interesting to see the percentage of free apps on Android is much higher than apple in March 2011. Maybe this is why Android overtook Apple? It is hard to tell because these graphs are old and from separate sources.

   Our research on what makes a good flash game included a quick questionnaire including questions like:

What do you like and dislike about these games? - Qualitative data

What would you change about these games? - Qualitative data

How much are you willing to pay for a small flash game? - Quantitative data

What platform would you play on? - Quantitative data

   We asked these questions to get a good idea of what people think about the game and quick data on what people use and what they would pay for such games. A good balance of quantitative and qualitative data is always good. This data is primary research.

   The results we got from these questions gave us the impression most people like simple, challenging, fun and colourful uniques art styles. Qualitative data like this gives us an idea of what people want to see in our game and how much they would pay for it. Without this primary research  we could have made an overpriced game nobody wanted. Secondary research would not have helped here because that data would have been targeted at another company who may not be making a similar product and it may old data that is not relevant anymore.

   With this information we improved our game by making it more colourful with different backgrounds, better characters and obstacles were easier to avoid and more obvious because of the colour scheme.

This presentation shows our progress:

http://prezi.com/xbtopt6zx7wf/our-reskinned-game/

Some smooth flash sites

I found some cool site that are quite interesting such as the following:
http://www.artisticodopeo.com/indexdynamic.html


This site uses basic but smooth ways of having text come into the screen in a very satisfying way.






http://htcsense.dk/#/sense/


I like the way this site is very fluid and stylistic. Very easy to get around and have a look at everything the site has to offer.






http://apmdesign.co.uk/#/Our-Profile/


This is a good self promotion site with nice transitions between pages and how text boxes drop down and pictures open up partially before you open them, it all adds up to a fluid moving website.

Flash coding

Getting started with coding in flash is pretty basic, all you need to know is a few basic codes. As long as you keep practicing with these codings it will come as second nature soon enough.
Here I have been creating buttons that send me to other pages once clicked on with the following codes:

stop();
Btn1.onPress = function()
{
 gotoAndStop(1);
};

Btn2.onPress = function()
{
 gotoAndStop(2);
};

Btn3.onPress = function()
{
 gotoAndStop(3);
};

Btn4.onPress = function()
{
 gotoAndStop(4);
};

This allows me to travel to and from all four pages by clicking the corresponding buttons.

I had to make sure to name every individual button like Btn1 so I could add coding to them.

Each page is on a different frame. The command gotoAndStop(#) was needed to make that button take me to the frame that was in the brackets like gotoAndStop(1) which would take me to frame 1 (or page 1).

the commands had to me between the {} with a ; at the end to make sure that command was for the one button only and it would not carry on the effect through all the pages. Some incorrect codes would send me through all the pages uncontrollably. The ; is there to end the code.