Inspiration

A couple of websites that are worth the look. Keep in mind though, most of these sites require Flash 8. This should definitely be a factor to keep in mind when designing our site.

Jen Sheroky click here

Shane Fleming click here

Stoav click here

Adobe Experience click here

3G work...

All work made for first assignment (3G website) can be found here: 3G Technology.

Springs: Elasticity

The physics behind it:

We will take the example of a mass attached to a spring. Let's say that the normal state of the system, that is to say when nothing moves, in other words the equilibrium, happens when the spring has a length l. If you move the mass by dx, making so that the spring has now a length l', the force will then be

-k.dx = -k(l'-l)
k is a specific to each spring, and it is <1
All this to show you what you already know : the more we pull on the spring, the faster it will go. Here, pulling hard means big dx, hence a big force, and a high speed.

But we must not forget about inertia. The mass always tends to go back to equilibrium, but it has a certain speed when it does, so it doesn't just stop there.

The ActionScript code:
This code goes inside the Actions panel of the mass, which has to be a movie clip.

onClipEvent (load) {
// inertia relates to the quantity of energy that
// the spring will carry
// inertia = 1 would mean that the spring doesn't
// loose any energy, and that it will oscillate
// forever
inertia = 0.9 ;

// k relates to the spring, and how "hard" it will be.
// The higher k the faster the mass will come back.
k = 0.1 ;
}

onClipEvent (enterFrame) {

// We calculate the distance to the mouse
x = -this._x + _root._xmouse ;
y = -this._y + _root._ymouse ;

//We calculate the amount by which the mass will to move
xp = xp * inertia + x*k ;
yp = yp * inertia + y*k ;

//We move it
_x += xp ;
_y += yp ;
}


For further information, click here.

Gravitation

Force = mass * g
g is a constant equal to 10 meters per second per second (m/s2)

acceleration = g

speed = g * t + starting_speed
t is the time elapsed since the beginning of the free fall


FLASH
onClipEvent (load) {
gravity = 2 ;

// This sets the _y position of the floor
floor = 500 ;

// Bounce is a number < 1 but close to 1
// The closer to 1, the higher the ball will bounce
bounce = 0.92 ;

// We set the speed of the ball when it is released.
speedx = 0 ;
speedy = 0 ;
}

onClipEvent (enterFrame) {

speedy = speedy + gravity ;

this._x += speedx/5 ;
this._y += speedy/5 ;

// If we are beyond the floor, invert the speed
if (this._y > floor) {
this._y = floor ;
speedy *= -bounce ;
}
}

Physics & ActionScript

ActionScript is most certainly a powerful programming tool for artists. To aid filesize reduction in our final website, I've decided to research physics-related effects and transitions. There are various site which cover the basic laws of physics, and how they can be incorporated into Flash. Flash 8 Professional provides a lot of new tools such as blend modes, which are not so fascinating to Photoshop users, but still provide a lot of new possibilites in the Flash realm. I have been taking a look at this site for quite some time now, and has given me a lot of inspiration for various effects in our 3G site. It should prove an invaluable resource in the coming weeks!

Site Storyboard

Idea behind this design is the evolution in the way information has been presented us over the ages. Starting from traditional, hand-written data & information on paper, to web/mobile technology. The idea is to have a harmonious blend between the two. There's also an option to flip the main page, so that it opens up to a futuristic time portal , where the family tree transforms into a timeline (an reference of this can be found here); bringing the old generation to the new.

Mockup

This is what I came up with today. The "family crest" for the 3G family, and a mockup of the layout for the flash-based website. If you look closely enough, you'll see that there are three G's connecting with one another in the middle of the crest. Pretty complex ay? Haha, not really. It's rather simple, and easy to do. I created the crest in Flash, using only vector lines! I also used a texture from CGTextures for reference. Down below are the first two stages of the flash site. The splash page, and the page that occurs after a link (or family member in this case) is clicked on. Please comment on the designs. What should we add? What should we take away?

Theme: Family Tree {3 Generations}

I came up with an idea for the navigation of our website, maybe even the layout; a family tree. We can create three {fake} generations of family members, and different family members will contain different information about 3G. I suggest that the third-generation of the family contain all the current info about 3G. The first and second generations can include the history and evolution of 3G technology. We could even have mixed couples to emphasize multi-culturalism. I think this idea is gold! Just got to wait for Chantelle and Astrid's approval lol. I wouldn't have to wait so long if they were in class! Hahaha...

Complimentary ideas

Have family tree transform into a timeline.

Have the ability to scroll left to right by hovering the cursor over the edge of the frame/page.

Paper background/texture (click here).

Have a family crest (click here).

Flash Content Management System (fCMS)

Here is an interesting thing I found on Dope Awards. Organizing a site with lots of information can be a daunting task. Hence the creation of Content Management Systems. The fCMS is a Flash CMS component (Flash Content Management System) that allows you to update text, images and SWFs directly on a live Flash website without ever leaving your browser window. The website developer or their client has no need for a separate administration panel for managing the content of the website and all of the changes can be applied at runtime.

Key Features

Direct updating of content on a live Flash website

No client training required. As easy to use as a word processor

Editable textfields with built-in text editor (allows for multi-page textfields)

Updatable images and SWFs - includes auto size, auto fit, positioning and captions

Customizable font list, font size list and color palette

Hidden login - type blindly a predefined word to access the CMS

Allows for multiple users with different file upload permissions

All data stored in an XML file - suitable for small to medium website content (no database required)

No end user coding or HTML knowledge required

Easy to use and customize

Secure - username and password are securely stored on the server side only

Light weight - adds only up to 20kb to your Flash movies