Tuesday, June 2, 2009

flash actionscript 3.0 - random images

wee mei this is for you. if your class anyone of them dont have the script can ask them to copy from here too :)

1. create one movie clip for eg: music_chord_mc.
2. double click on the mc. inside create a few object, one in each frame. i used 3 frames.
3. put it on the stage
4. name those instance. i will name it 'music_chord_mc' and 'music_chord_mc1'. it can be different names too

you can remove all // (instructions) if you think it is too messy on your script.
----


//begin here: as on main stage, i put two items here for you.

stop();

//this part is to make the object appear random first before appearing. if not all your same duplicate mc will come out same object the first time.
//ok this figure u must get it right. if total frame in the mc is 3 then you get this *2+1, if you have 5 frames then you put *4+1. this and the bottom do not need to be the same mc. but mine is the same mc, different instance. so i just change the instance name only.
//add more lines here if you have more objects

music_chord_mc.gotoAndStop(Math.round(Math.random() * 2+1));
music_chord_mc1.gotoAndStop(Math.round(Math.random() * 2+1));


//these few var are for all the random images.
var top_Y:Number=-30;
//meaning i want object to appear -30 above the screen. it depends how tall your images is

var btm_Y:Number=900;
//make this figure slightly more than your document size height, so that the whole image will disappear before it appears again

var speed:int=5;
//the speed set


function moveChords(e:Event) {
// moveChords can name any name, just make sure you put the same name at the end


//your first random object. name it here according to how you name the instance. everything after if it when preparing for the random before coming into the screen

if (music_chord_mc.y>=btm_Y) {
music_chord_mc.y=top_Y;
music_chord_mc.scaleX=Math.random() *1+0.5; //0.5~1.5 .all the first number like 1, 360 is the original size. if you want to change, you change the second number after the + or -
music_chord_mc.scaleY=music_chord_mc.scaleX; //following the scale of X
music_chord_mc.rotation=Math.random()*360-180; // -180~180, so that it doesnt turn more than 1 round, this rotation is for when it appears. this does not make the image rotate on stage. it just appears rotated but stay the same thruout
music_chord_mc.alpha=Math.random()*1+0.2; //0.2~1 // is for transparency, if you do not want your image transparent, remove this
music_chord_mc.gotoAndStop(Math.round(Math.random() * 2+1)); // this is to make the next image appear randomly
} else {
music_chord_mc.y+=speed; //everything after 'else' is what you want to see happen on stage. like below rotation on stage
music_chord_mc.rotation-=1;
}


//your second random object, add more if you need.
if (music_chord_mc1.y>=btm_Y) {
music_chord_mc1.y=top_Y;
music_chord_mc1.scaleX=Math.random()*1+0.7; //0.7~1.7 different from top
music_chord_mc1.scaleY=music_chord_mc1.scaleX;
music_chord_mc1.rotation=Math.random()*360-180;
music_chord_mc1.alpha=Math.random()*1+0.2;
music_chord_mc1.gotoAndStop(Math.round(Math.random() * 2+1));
} else {
music_chord_mc1.y+=speed;
}

this is the same thing... but i dont want the object to rotate on stage so i remove that here. i make changes to some of the random so that it doesnt all appear the same.


//this is the closing of it. any mc or instance you add, just add in the middle before this line.

}
this.addEventListener(Event.ENTER_FRAME, moveChords);

Monday, May 25, 2009

art direction and text organization

moodboard


site map

* are most probably pages i will be working on

flowchart

more research

project definition
This project is to redesign the website of:

www.spsetia.com.my/setia_alam/index.htm

The purpose of this redesigning is to improve the aesthetic and functionality of this website. Research will be based on study of the target audience and their behaviour towards using this site. This ought to increase the percentage of user, and by providing what they need should increase the percentage of sales as well.

---
client's analysis
COMPANY BACKGROUND
S P Setia Berhad is recognised as Malaysia’s leading listed real estate player with a proven track record of innovation-driven and standard-setting developments spanning the full spectrum of the property market from master-planned townships to thriving commercial hubs. S P Setia has also won international acclaim as attested by its three year-ranking as Malaysia’s No.1 developer in The Edge Malaysia Top Property Developers Award and Euromoney Real Estate Awards in 2005, 2006 and 2007. The Group’s core business activity of property development is supported by its construction and infrastructure and wood-based manufacturing divisions to deliver product and service quality of the highest standards to its customers.

VISION
To be in the BEST in all we do

MISSION
We aim to provide superior customer service and satisfy customer needs through a culture of excellence to enhance shareholders’ value. At the same time, to be a caring and responsible employer mindful of our social responsibility.

MOTTO: Q-SERI
Q: quality
S: speed
E: efficiency
R: reliability
I: integrity

GUIDING VALUES: Values That Guide Our Work
• We uphold quality as our first priority
• We are customer-focused
• We are effective and efficient at our tasks
• We practise continuous improvement
• We provide reliable and timely service
• We embrace Information and Communication Technology (ICT)
• We are also profit-orientated

---
project analysis
TAGLINE
Setia Alam... In Touch with Nature

- live . learn . work . play
Setia Alam is one of the many projects of SP Ssetia Berhad. Setia Alam is an integrated development spanning over 2,500 acres of freehold land slated to become one of the biggest and best-planned townships in the Klang Valley. Consisting of residential, commercial and institutional parcels, this township is well supported by functional features and facilities that combine an eco-sensitive lifestyle living truly “In Touch with Nature”.
Located in Shah Alam, one of the most modern cities in the country, Setia Alam is destined to become a vibrant community where man and Nature co-exist in serenity and splendid harmony. The township will be your sanctuary where you will be able to enjoy the simpler pleasures of life - your family, your neighbours and Nature in all its glory.
Setia Alam is centrally located with easy accessibility whichever way you are traveling from. It is well served by an extensive network of highways, making traveling to Kuala Lumpur, Subang, Shah Alam and Klang just a breeze.
The newly opened NKVE-Setia Alam Link connecting Setia Alam to km3.3 of the North Klang Valley Expressway (NKVE) affords effortless access to the thriving township. It now takes only 10 minutes to reach Damansara, 20 minutes to Kuala Lumpur and 45 minutes to the Kuala Lumpur International Airport (KLIA).
Other upcoming highways in the vicinity include the West Coast Expressway, the Shah Alam-Batu Arang Highway and the New North Klang Valley Expressway (NNKVE) which will significantly improve future accessibility.

---
target audience
Extended decision making is the response to a high level of purchase involvement. An extensive of internal and external information search is followed by a complex evaluation of multiple alternatives. Factor influencing the purchase includes convenience – location and facilities, space, price, aesthetic, reliability of the developer, peers opinions

WHO?
1. Older married couples with dependant children
- reason of puchasing: looking for a bigger place for the family, wants a more comfortable to spend the next season of his life.
- process of decision making will probably be to fulfill the needs of the family. Even though the whole family play a role in this decision making. Ultimately the parents will probably be the final decision maker who most of the time is looking for something more conventional and stable, as they tend to see more in long term satisfaction. Most of the time purchaser is ready to increase the budget if necessary since he intends to stay there till he retires.

2. Young married couples
- reason of puchasing: a new home to start a family.
- process of decision making will normally have to work around a budget since weddings and everything else happened at the same time. Most of the time couples plan to stay in this house for the next 5-10 years or up to two kids before they move to a bigger home.

3. Young capable singles
- reason of puchasing: a young bachelor/bachelotte who is in their 26-30s, who has enough savings and would like to start investing in property.
- process of decision making might be about status/image and profit. Peers opinions and media play an equally important role because user is still new in this.

WHAT ACTIVITY ARE THEY DOING ON THIS SITE:
- shopping for houses
- comparing prices, pros and cons with other options from this website itself
- comparing prices, pros and cons with other options from competitor website
- checking progress of their property

---
current site's analysis
missing:
- "print this page function"
- "sent this page function"
- interesting images and interior of the houses, to help stir up excitement in buyer to visualise their dream home
- "search from the right home", to help locate options base on needs and eliminate those those options that doesn’t fit

Monday, May 18, 2009

webpage revamp

client:sp setia









competitors
1. sime darby


2. pj development


3. campion real estate


4. wall estates



nice websites
1. discover trails edge

+ point: it feels very at home. nice images attracting the eyes.
- point: flash might waste a lot of time of the user since their main purpose is to search for data.

2. bda global

+ point: very organize, simple but it looks very dynamic at the same time.
- point: similarly flash might not be necessarily for target audience.

3. wedding website


4. 13 creative.com

+ point: the loading time for this page is fast. the javascript loading of images make it looks dynamic.


javascript and tutorials
1. w3 avenue
study more and more css.
2. dezwozhere.com
css, accessibility and stadards.
3. web developer handbook
a library of all kind of questions and creative links.
4. A list apart
all css site seems to link a lot to their entry. so i guess if i want to conquer css.
5. 40 oustandings css techniques
this is a quick read for all i need to know.


design and tutorials
1. css remix
- all the nice css website as reference. love this.
2. well designed css sites
- this is good, going through nice websites and realised that i cannot do it in css and javascript is a waste of my time.
3. best web gallery
- more, more, more gallery.
4. colour lovers
- all about colour pallete.
5. design shack gallery
- another library of more nice sites.

Friday, April 10, 2009

user testing


please be very kind to visit my latest work here and let me know what you think about it. fill up the poll on the side and feel free to comment. i only have half a day left only, so would appreciate if you will company me through these last hours hahaha...

Thursday, February 19, 2009

DIY website layout

main page


step by step


final product1


final product2


final product3

Friday, January 23, 2009

moodboard