thoughts on final

I really like how my device turned out. 

Thanks to the comments from other people in my tutorial group as well as my tutor i was able to do some changes which i believe makes my device even better.

development 6

4. I have changed a small bit of the navigation of my device.

I have made it that when you are zoomed in on a segments that you have to press the button on the bottom to get back to the home screen

(please note that after the animation which zooms out of the segments and shows you the main screen that you have to press the button again to go back to the main screen. For some reason Flash kept messing up when i tried to make it actually go back to the main screen). 

3. On the clock i have added a black line which is more bolder than the others.

This black line represents what time it is at the moment so it still acts like a normal clock

2. I have made the buttons animate so that the user knows that it is a button. 

For the button the the bottom it will also change colour depending on what screen you are on, plus it will also the colour will change when you move your curser over it. 

And for the segments on the clock. They will expand when you move the curser over them. 

(note that only 2 of the segments will expand in my file)

1. I have made the bottom part of my screen a grey colour to make it look more like a metallic device

After our presentation i have changed a few more things in my flash file to make it look better

development 5

Button_11 is the button on that frame. Each button has a different number next to it.

and (3) means the frame it is going to this is also different in each frame.

button_11.addEventListener(MouseEvent.CLICK, fl_ClickToGoToAndPlayFromFrame_8);

function fl_ClickToGoToAndPlayFromFrame_8(event:MouseEvent):void

{

gotoAndPlay(3);

}

For each of the buttons i had to add code into them to tell them to go to different frames.

Buttons were quite difficult to understand for this project. But i eventually got the hang of them. On my home screen i put my 3 buttons on them which would go to each of my 3 animations. I decided to make the circle on the button left black so that people to make it stand out so people know to push it.

When i had all of my frames done i added just frame which just had the interface on it and no animations  on it. This will be my home screen.

When i had all 6 animations i went into a separate flash file where i would do my final. I created a movie clip for each of the 6 files and added then into different frames in the same file.

To make sure they don't all flash one after another which happens right after you put them all in the same file i added the code stop(); into each of the frames so they stop after each frame.

development 4

The third animation is when you compare the current readings with the overall average power usage.

For this one i had to have 2 clocks in the screen so they are both smaller. And to make sure that the user doesn't get confused at which circle is which i decided to add the words 'today' and 'average' next to the clocks which they represent.

When the red button was done i did the exact same process for the green button.

development 3

After this animation was done i just did the complete opposite to what i did for the first animation to get back to the original screen.

In Flash i put a white boarder around the main layout of my device. This was to help me see exactly what would happen on the screen.

In my Flash file there is a separate layer behind the circle which is just red. The animation is when you click on the red part which is missing the image on the screen will zoom in on that part. The red layer behind it will slowly start to fade away and then words will appear in the space missing. These words will be the different rooms in the house and the colours will depend on how much power is being used in each room.

I took the first circle and and took it into photoshop and got rid of the red part of the circle first

I started with the red button first

development 2

Once i had all of my images i could bring them into flash. 

I am going to have only 3 buttons on my device which will work for this presentation.

I am going to have 6 animations overall which means 2 animations for each button.

The first animation for each button will be what happens when you first click it. And the second will be going back to the main page.

I also had to add colour to a second clock which will be used for my average readings.

I wanted some of the readings to be similar and have some slight changes because in a household i think that there wouldn't be much change of power usage from day to day

The next thing i did to the circle was add colour to it to represent their power usage

I also added the times on the clock. I didn't want to have all the hours because that is not the main part of my device.

Part B development

The two circles within the main circle are where i am going to have the times for the clock

After that i made the 24 hour clock.

To make the clock i had to make all the lines on a angle 30 degrees greater than the line before it to make it all even

I first started on making my interface layout on illustrator