back to main account page
Flash homepage designs and animations

Homepage animation opening animation sequence. V. 1

The animated intro v1 design is based on the idea of the O in boston spinning around until it comes to a stop in the middle of the scren. Once it is still, it will have flashed of scenes of Boston and music beats in the background. Then the O splits into the 2 O's as the word Boston fades in and we are then brought to the homepage with the 2 scenes of Boston in the O's.

Remember this is only the beginning, as it will evolve and change as I continue to create the rest of the animations, sounds, and designs...

See the animation...

Homepage animation opening animation sequence. V. 2 and the transition to "Who are you?" and "What do you do?"

The animation intro has been adjusted a bit since last time. I have also included that once the word BOSTON is spelled out, after a few seconds the first transition occurs to Who are you... and the navigation appears as well on the bottom. I have the job titles scroll through in a nice clean and sophisticated manner, while a nice image of the boston skyline flips on the screen while the benefits of this area as faded over the foreground of the image. I envision using all different images of boston in this benefits region, with the burnt orange blow and black background. The transitions also are designed to feel like you are turning a page, or scrolling along the presentation with nice sound and animation effects. Remember this is still a work in progress and may still have a few bugs up to this point...

See the animation...

 

V. 3 and with the latest updates posted in the notes

This is now the latest update to the flash file. I have added the sound options. (I currently have 4 choices for music, but I am not sold on all of them, I think the way I have it set up is the best way for the user to control what type of music they'd like to hear. I also went ahead and have started to build all the sections. So far I am letting you view the first 3 sections, so you can take a look at them.

See the animation...

V.4 and with the latest updates posted in the notes

This updated version now has all the navigational areas working.. though I still need the final copy for most of the sections. It also has to it an arrow that will skip the intro and go right to the first part of the presentation. I have also added Boston above STC - I think it looks best here.. I tried it at a few other spots but feel this worked the best.

See the animation...

V.5 and with the latest updates posted in the notes

Here are the latest update for 1/09:

  • Changed "benefits" on each page to the new titles for each sections
  • Made the transitions from page to page automatic (with sufficient time for people to read each one), stopping at "Where do you go from here?"
  • Made the Os in BOSTON on each page the same size as the other letters (unlike the opening page).
  • Made the scrolling list under the question on each page scroll much faster and with only 1 line between each entry; scrolling should continue in a permanent loop until you leave the page.
  • Changed the sound on the "renew membership" to match the others
  • Left music as if for now

    Still left to consider and discuss
  • We still need to discuss the transition pages, right?
  • Print all the pages? Something like "Print this brochure" or something? (We want people to be able to print this, too)
  • When you zoom the window to fill the screen, some of the elements (green borders, lines, etc.) don't go all the way to the edge? Can we make sure that they do (at least up to resolution of, say, 1024x768?

See the animation...

 

V.6 and with the latest updates posted in the notes

  • We would like a little more space between the lines that scroll in the
    left part of each page. (The Who are you? parts)
  • What do you produce? has the wrong content on that page. It should say:
    documentation, templates, online help, etc. Check the file we sent yesterday
    again.
  • I don't have the maximize option, but Hans does. I told him about our
    discussion for that and he's fine leaving it as is.
  • Depending on the remaining work and budget, making a printer friendly
    version might be something we'll have to do on our own. It is a nice to have
    and something that while we don't want to do ourselves, we'll consider doing
    if we run down to the wire.
  • Transition pages (text before the renew and join and hub pages launch):
    Instead of adding all the stuff I sent you, one of the links pretty much
    contains it. We'll just send them to the link with all that pre-written
    stuff. (https://www.stc.org/join_online.html) and
    http://www.stc.org/Renewal01.asp and www.stc-boston.org. Perhaps in the
    right side we'll say, "In about 5 seconds you will see the Join STC form
    found on our national site, etc."
  • I'll try to get you a test .wav file this weekend/next week for the one
    quote per page idea
  • Remove right choices, learn more, etc. Where do you go from here top left.
    Small type in bottom right...& Back. (put url)
  • Control over buttons. Maybe slow down the arrows or not use them to auto
    change the pages perhaps using a spiffy animated arrow to remind people to
    click.) I want your opinion on this. Is it better to have the automated flow
    with some way of pausing? Or better not to be automated?
  • Remove Can in What We Do.(right side text) We want the font for these
    vertical labels bigger so need to make the labels shorter (now that we see
    it).
  • Make the help one into just "How We Help" --> makes it bigger.
    "How we support you" (lose the growth)
  • In the page, Where we go from here, why is that vertical label darker than
    the ones on all the other pages?
  • Forward button needs to go away on the last page since it goes nowhere.
  • Weird bug Hans found: If you change the music and then right click and
    decide to rewind and play again, both music tracks run concurrently.
  • Background STC/and vertical label's descenders have no contrast. Can we
    fix that somehow -- whether it is nudging the STC background away or
    changing some shading or color on one of them?
  • For the one quote per page what do you recommend about when the voice
    should play? Early, after the text loads?

See the animation...

 

V.7 and with the latest updates posted in the notes

  • > >> a.. Can we change the hub text to reflect that it will be a
    > link to the Boston STC web site and not the national
    >
    > - Sure we can

    On these transition pages, please remove the >> arrow (upper right) and put
    in a << (back) in the upper left. We want people to understand that if they
    click <<, they can go back to the "Where to go from here?" page. Let's
    change the text to read:

    "The Boston STC [or whatever the option is they chose] Web site will open in
    a new browser window in 5 seconds. To go back to this presentation instead,
    click <<."

    How's that?

    >
    > >> b.. Also, those don't seem to be working.
    >
    > - Yeah they only work on certain machines properly - I am still
    > on it, and will get that fixed soon
    >
    > >> c.. For the link that worked the program closed. Can't we
    > keep it open? and just launch a separate browser?
    >
    > -- Hmm, I haven't seen it close the program - what usually
    > happens is it will open a browser, or open in a currently opened
    > browser, and switch to that screen - however it always put the
    > screen in front of the flash movie... If I am reading you right,
    > you want the STC Movie to always be in the forefront?
    >
    The program opens the link the same window as the Flash animation, replacing
    the movie. It does not go to an open browser window, or open a new one
    (which it should). The STC movie doesn't have to stay in the foreground, it
    should just stay open in a separate window (behind).


    > >> d.. Hans, do you think the timing is too long now between the
    > left text and the right text? I am thinking yes. But I would like
    > your input.
    > - Let me know - this will be easy to change
    >
    No, I think the timing between the left text and right is fine. The right
    text comes in when the first line of scrolling left text reaches the top.
    That's OK in my opinion. However, the scrolling is very uneven, at least on
    my machine. Is that a function of the machine it's running on?

    Other stuff:

    - Several of the pages (for example, how do you grow?) go completely white,
    except for the >> button, just before the transition to the next page. This
    never happened before. What's up with that?
    - Can we change the "how we help"/"who we are" vertical text back to a shade
    of gray (for example, same shade as "C" in logo above? That's how it was
    before and it's better, I think. White is too stark.
    - On the "What do you produce?" page (I hate to do this now, but...), please
    change the last bullet on the right-hand side to read: "Annual STC
    International Conference held in a different city each year (May)."

See the animation..v.7