Reworking a flash site - suggestions welcome

Discussion in 'Web Design and Development' started by agwah, May 7, 2008.

  1. agwah macrumors newbie

    agwah

    Joined:
    Sep 25, 2007
    #1
    Hi guys,

    Made this photography site some time ago and is now in the process of making a similar concept for a client. The new site will be for a fashion designer - it is going to be a a grid of fashion design thumbnails that pops out to a large picture.

    The question is if the design/navigation/whatever could change in any way. Whatever kind of suggestions you have will be appreciated. Or maybe you have seen another solution that is inspiring somewhere else.

    It will have to be a bare bones design again as the guy is a minimalist.

    Thanks
     
  2. macsrules macrumors regular

    Joined:
    Feb 26, 2008
    #2
    agwah,

    I like it, the site tells you that he/she is into photography. If those are images that he/she shot maybe something that lets the viewer know these are his/her folio. I like the intro, it creates interest through movement at the start. I also like the model shot, she has a nice bod ;)

    1. Your right about the navigation though, I would say maybe something like this, since you are using the flash photo concept instead of doing text navigation across the top and the address, have a cool looking graphic across the top that indicates that it is navigation and when the person runs over it, all the different sections pop down. I would also create the text navigation and give it a div tag and position that off the screen for people with disabilities and for google indexing bots. Last, I would also create a form email contact page instead of just a link. Somebody could not be at there home computer when viewing your site, also unless you mask that link bots on the web can harvest it.

    These are just my suggestions, maybe good maybe not, I think your concept is good though, less is more.
     
  3. snickelfritz macrumors 65816

    snickelfritz

    Joined:
    Oct 24, 2003
    Location:
    Tucson AZ
    #3
    The thumbnails definitely should have rollover effects.
    One neat effect I've developed: On rollover, all other thumbnails blur and shrink slightly.

    Here's an actionscript(3.0) that does this using event propagation.
    (all movieclips contained within "thumbnailGroup" will be targeted by the thumbnailGroup event listeners, and the thumbnail instance name is passed to the "if" conditional within the rollover function.)
    Here's a working example of the code below:
    shrinkNblur

    PHP:
    stop();
    import gs.TweenMax;
    import fl.motion.easing.*;

    thumbnailGroup.addEventListener(MouseEvent.MOUSE_OVER rolloverfalse0true);
    thumbnailGroup.addEventListener(MouseEvent.MOUSE_OUTrolloutfalse0true);

    var 
    targetThumb:String "";
    var 
    thumb1:MovieClip thumbnailGroup.btn1;
    var 
    thumb2:MovieClip thumbnailGroup.btn2;
    var 
    thumb3:MovieClip thumbnailGroup.btn3;

    function 
    rollover(event:MouseEvent):void {
        
    targetThumb event.target.name;
        if (
    targetThumb == "btn1") {
            
    TweenMax.allTo([thumb2thumb3], .2,{scaleX:.8scaleY:.8blurFilter:{blurX:4blurY:4quality:3}});
            
    TweenMax.to(event.target.2, {scaleX:1scaleY:1blurFilter:{blurX:0blurY:0quality:3}});

        } else if (
    targetThumb == "btn2") {
            
    TweenMax.allTo([thumb1thumb3], .2,{scaleX:.8scaleY:.8blurFilter:{blurX:4blurY:4quality:3}});
            
    TweenMax.to(event.target.2, {scaleX:1scaleY:1blurFilter:{blurX:0blurY:0quality:3}});

        } else if (
    targetThumb == "btn3") {
            
    TweenMax.allTo([thumb1thumb2], .2,{scaleX:.8scaleY:.8blurFilter:{blurX:4blurY:4quality:3}});
            
    TweenMax.to(event.target.2, {scaleX:1scaleY:1blurFilter:{blurX:0blurY:0quality:3}});
        }
    }

    function 
    rollout(event:MouseEvent):void {
        
    TweenMax.allTo([thumb1thumb2thumb3], .2, {scaleX:1scaleY:1delay:.2blurFilter:{blurX:0blurY:0quality:3}});
    }
    Also, "load" and "unload" transitions for the large images would be nice.

    I like the topnav concept for this type of site, although I don't like the links to span the entire browser when the window is resized; Keep the elements in a static configuration.
    ie: the underlying topnav background color should span the browser window on resize, but the links, logos, etc... within it should remain where they are in relation each other.

    Maybe a darker gray for the topnav background, as well.
     
  4. yagran macrumors 6502a

    Joined:
    Jan 8, 2007
    Location:
    Brighton, East Sussex, UK
    #4
  5. Trip.Tucker Guest

    Joined:
    Mar 13, 2008
    #5
    Must you use Flash? Really? Flash?

    Why not use a little ajax sparingly to add some zing and as the site is minimalist and streamlined, it will go over a whole lot better. Not to mention be able to degrade gracefully, or if you code it correctly, upgrade elegantly. Try a little unobtrusive javascript before jumping on the *gag* Flash bandwagon.
     
  6. snickelfritz macrumors 65816

    snickelfritz

    Joined:
    Oct 24, 2003
    Location:
    Tucson AZ
  7. yagran macrumors 6502a

    Joined:
    Jan 8, 2007
    Location:
    Brighton, East Sussex, UK
    #7
    He quite obviously wants to use flash, and flash can be a great tool when used properly. no need to jump on *gag* flash haters bandwagon

    well said sir
     
  8. SrWebDeveloper macrumors 68000

    SrWebDeveloper

    Joined:
    Dec 7, 2007
    Location:
    Alexandria, VA, USA
    #8
    BTW the carousel idea was a good one such as via DHTML which means integration of HTML, JS, CSS and the DOM, as follows:

    Example image carousel using JS only (DHTML)

    I always felt a web site should never cater to one technology (as others here explained passionately) but if its going to be Flash, it is supported in 98% of the browsers out there if you ask Adobe. Of course of that 98% only 44-55% are using the current version, but even with that limitation can you think of any other third party cross platform authoring tool that's also W3C compliant and on such a large scale?

    I'm still tryin' to figure out unobtrusive JavaScript, though.

    -jim
     
  9. snickelfritz macrumors 65816

    snickelfritz

    Joined:
    Oct 24, 2003
    Location:
    Tucson AZ
    #9
    I digress...

    [digression]
    Flash is IMO the "Mac" of internet technologies.
    It is shunned by mainstream programmers, and embraced by artists.:cool:

    Flash is an extraordinarily flexible and empowering platform for artistic expression, mainly because the graphical tools (Flash IDE) are so well integrated with the "code" aspects, and the websites always display correctly regardless of the browser or platform.
    (I have experienced no deviations at all in any of my Flash projects, except with regard to the HTML shell in which it is embedded)

    I did not work in Flash, I doubt that I would even bother doing websites at all.
    [/digression]
     
  10. agwah thread starter macrumors newbie

    agwah

    Joined:
    Sep 25, 2007
    #10
    thanks guys for all the good ideas,

    and yes, my knowledge of java or ajax or even html is limited so flash makes it easier to get to interesting solutions cross platform, I wouldn't know how to plow through the different needs of all the different browsers,

    flash is absolutely supported by a 100% of all the people that this site is designed for, as long as it is backwards compatible say to version 6 when not displaying movies, I go to 8 and use on2 vp6 when it is time for movies -version 9 and h264 has to wait a year or so for me

    i guess this makes me belong in the "mac" category of programmers

    when it gets time I will consider doing something about the rollover issue and the address bar on top, thanks
     
  11. uMac macrumors 6502

    Joined:
    Mar 27, 2007
    Location:
    Canada
    #11
    Devils' Advocate...

    Google hates flash, just so you know.

    Also when I load your site, it flashes a bunch of pictures at me, quite annoying as I pick up on each one and suddenly don't want to look at details (small thumbnails).
     
  12. snickelfritz macrumors 65816

    snickelfritz

    Joined:
    Oct 24, 2003
    Location:
    Tucson AZ
    #12
    Just to clarify: embedding Flash or any other multimedia format into an HTML page, does not in and of itself cause problems with Google or SEO.
    It is the lack of structure and content in the HTML shell that causes most Flash sites to be difficult to index.

    It is entirely possible to use javascript to hide a complete (fully indexable, text-only) webpage within the HTML shell of a Flash website.
     
  13. agwah thread starter macrumors newbie

    agwah

    Joined:
    Sep 25, 2007
    #13
    i am gearing up for a major overhaul, am considering the different ideas and will probably use some of the suggestions but for now I have been busy with clients projects and haven't been able to focus on the site much, did indeed add a top title bar and a bit of navigation and a bio etc
    here is how it looks now

    also acquired two different spellings of the same name and again

    any suggestions and replies are always highly appreciated

    oh yeah, i was trying to figure out how to have a script that will allow me to have a much larger flash movie like 600 by 1200 pixels that will open with exact size, but if the screen resolution of the visitor is smaller than that, the flash movie would resize to a smaller format, anybody know a place to find that code
     
  14. snickelfritz macrumors 65816

    snickelfritz

    Joined:
    Oct 24, 2003
    Location:
    Tucson AZ
    #14
    regarding http://www.patrikandersson.com/

    I noticed there are no page-out transitions, although it appears that have included fairly elaborate page-in transitions. You might want to include at least a cross-fade to mitigate the abrupt white strobe effect that occurs when the links are clicked.

    A clickable email link or custom email form would be a nice touch.

    AFAIK, Flash SEO no longer (since June 08) requires a list of keywords and html page structure to be embedded in the index.html page.
    The spiders crawl the SWF just like a person would, executing links and harvesting/indexing text content from the stage.

    BTW, it's a good idea to "hide" your navigation button labels by nesting them inside of movieclips or sprites.
    This prevents the search engine spiders from erroneously indexing them as stage text content.
     
  15. agwah thread starter macrumors newbie

    agwah

    Joined:
    Sep 25, 2007
    #15
    thanks

    did a little bit of research on this thing of html versus flash, i sure am no expert on SEO, but it seems that the spiders do not crawl the flash in some cases where the movie is loaded by javascript as it is when flash spits out the code

    "Googlebot does not execute some types of JavaScript. If your webpage uses JavaScript to load a Flash file, we may not be able to discover and index the contents of that file." link

    a list apart might have a suggestion about getting rid of the javascript link

    oh and BTW here is the site that was built similar to the photography site shamask
     
  16. snickelfritz macrumors 65816

    snickelfritz

    Joined:
    Oct 24, 2003
    Location:
    Tucson AZ
    #16
    I believe this is referring to "SWFObject" embedding method which is currently a popular third-party SWF embedding solution.
    I suspect it will be fixed before FlashCS4 is released, since SWFObject will be the default (Adobe sanctioned) embedding method for CS4.
     

Share This Page