OK!! First prototype designs are here

Discussion in 'Junky's Jungle' started by ice-9, Apr 5, 2001.

  1. ice-9

    ice-9 Well-Known Member

    Don't blow a gasket now if they don't meet expectations...they are my first try. I know some other folks are going to also come up with an alternate design and they should be forthcoming soon.

    Please comment on the navigation/layout and of course the aesthetic appeal. I was going for a sophisticated yet simple look...lemme know if I succeeded. Of course there are a lof of places where certain details could be improved (for example making the menu bar prettier).

    I have three different prototypes:
    http://virtuafighter.com/prototype/design2.jpg
    <A target="_blank" HREF=http://virtuafighter.com/prototype/design3.jpg>http://virtuafighter.com/prototype/design3.jpg</A>

    My biggest regret is that currently the prototypes are fixed at 600 pixels in width...it may be a little hard to make it have variable width given its design. If anyone has any suggestions on how to pull it off post here.

    Again, a warning: THEY ARE A WORK IN PROGRESS! *Ahem* Thank you very much.
     
  2. Chanchai

    Chanchai Well-Known Member

    I acknowledge this is a sketch. Out of the three designs, I prefer the first one. The sidebar doesn't feel as cluttered when the "general areas" are on a horizontal spread.

    Are there talks or considerations of merging efforts and existing works/archives with any of the following?
    KBCat (Virtua Project--I remember hearing a rumor long ago on this)
    Dodee (THoVF, Tao, archive)
    Rich/GLC ( RSW's Site, archive)

    Anyways, I think the look is pretty nice, taking action on the suggestion (which I acknowledge have been around since day one) of making VFDC represent all VF (well, all arcade VF anyways as opposed to... VF Animation or VF2 on Genesis or even that tigard I-Zone thingy).

    In a nutshell: I liked the first design. Appreciate the "more complete" direction. Curious if there are collaborations.

    -Chanchai
     
  3. Guest

    Guest Guest

    I think it looks very good. Strangely enough, I'm putting together a website of my own (to sell paintings and advance my art career), and your design looks almost like mine! I thought that was funny.

    I just want to add a few thoughts about VFDC. First of all, I can't stress how important it is to design for the 640x480 resolution. Despite the latest technologies, most people surf on a desktop or laptop with a 640x480 and a narrowband modem. And if there's anything they can't stand, it's scrolling sideways. If you have to use a wider screen, then remember to keep the most important information where folks can see it.

    Second, about the color scheme. I love the black-and-blue color scheme on VFDC for one simple reason: it's easy on the eyes. Websites with the standard black text on white background just burns my eyes out; I'm convinced it's only a matter of time before I go blind. I strongly suggest that you keep this in mind with your redesign. There was an excellent article at WebPagesThatSuck.com about this very thing (it's in the article archives). In fact, just read up on everythiing that's at that site; it's arguably the best design site on the Internet.

    Third, Flash. Don't use it. Ever. I don't care how pretty it looks or how cool the animations are, it's simply not worth it. If your computer doesn't support Flash, loading such a page either crashes your server or bogs it down, making you wait forever. For instance, until recently I was using a Pentium 1 laptop with Windows 95 and running AOL. The version of AOL I had didn't support flash, and the computer wasn't powerful enough to upgrade. Needless to say, if I came across any Flash-infected page, I backed out as quickly as I could. The most widely used button after the back button? "Skip Intro." Nuff 'said.

    Fourth, I wanted to add my opinion about the many video clips on VFDC. I couldn't use them on the laptop, but on my new computer (a P3 with DSL), I can't love them enough. The multimedia functions -- the Korean Step Guide is the perfect example -- are essential to a site like this. There simply isn't a better way to learn Virtua Fighter 3 than by seeing it in motion. Considering that most American videogamers haven't seen this game played by anyone who knows the system, having numerous videos available will not only generate a loyal following for VFDC, there will be more seasoned VF players as well. If anything, this site needs MORE videos! But, hey, that's me, and I'm aware of how much time it would take to implement all that into your redesign. Maybe you should just cave in and sell ad space to porn sites to make money (the only on the Internet that makes money -- how tragicomic).

    Anyways, I hope my insights help you out. Everything looks good and I'm sure that the final product will be loved by everyone.

    Daniel Thomas
     
  4. Sudden_Death

    Sudden_Death Well-Known Member

    this is just some ideas :

    i dont like the yellow on it.. keep it dark..
    dont make the site too simple...looks empty.

    videos should be limited to special technique's, only the "hardest"combos, bugs/glitches. videos of matches should be posted on another server..

    do get the virtua project intergraded into vf.com

    all rich's archive files will get you a "complete" vf site. seriously..

    no more step guides, just faqs.

    ..and no specialists :p

    <font color=red>PICCOLO</font color=red>

    [​IMG]
    fuck spelling!
     
  5. ice-9

    ice-9 Well-Known Member

    Thanks for the comments everyone. However, it would help a lot more if the feedback could be primarily focused around how the designs look as this is what the thread is for. Questions about content will be answered later.

    DanielThomas: The current width is fixed at 600 pixels, but ideally you want the site to scale according to the user's resolution, i.e. variable width (90% usually). The reason why the present design won't work very well is because the aoi image is of course unchangeable.

    On a related note, a cool feature of this design is that the images (the Aoi one) could be randomly switched with other predetermined images so the site never looks exactly the same.

    Piccolo: I took your advice and played around with the color scheme. What do you think of this one? <A target="_blank" HREF=http://virtuafighter.com/prototype/design4.jpg>http://virtuafighter.com/prototype/design4.jpg</A>

    Chanchai: Constructive feedback about the aesthetics of the site would be most helpful. I understand that you understand it's a sketch...but does it suck? Is it adequate? Could be better? (How?) Etc.

    Again, if you guys could provide examples of site designs that you wish VFDC could emulate, post them here!

    BTW, don't hesitate to take the images and play around with them to fiddle with color schemes. Send them to me and I can post them up for feedback.

    Lastly, there will probably be a banner ad to this design. The banner ad would probably just go on top of the table. Kinda inefficient huh...
     
  6. ice-9

    ice-9 Well-Known Member

    Goodness, the color is a bit messed up. Strange...I thought I used web colors.

    BTW, Piccolo, when you say the site is too simple, is that too simple in layout or details?

    I also want to stress that this design is not final and that other people are working on alternative schemes.
     
  7. Chanchai

    Chanchai Well-Known Member

    Well of course it could be better (naturally everything could be), but I guess I'll look at it as not a sketch.

    -I assume you'll use either some graphic (simple or complex, though I prefer simple) to distinguish buttons/links from text.
    -Buttons for general areas of the site.
    -Definitely distinguish the links in the vertical menu bar. It looks like plain text, though it is obvious what it's there for.
    -Experiment with the graphical layout of the menu bars. Do you want them simple as they are, classic VFDC kinda simple, or complex? I think it's best for it to be simple, but not lacking either.
    -My mind is still debating about the yellow (in the original sketch)... It looks perfectly fine for me, but I don't know if it's gonna turn out some weird color on a different monitor/card/system and blind someone. I'm personally fine with the original sketch's color choice to a good degree, it's the latest sketch that I'm not crazy about.

    Also, I too personally love the old layout. It's pleasing on the eyes, simple, works. Only thing is, it could easily be perceived as "lacking" or "dull" by many.

    -Chanchai
     
  8. Hayai_JiJi

    Hayai_JiJi Well-Known Member

    If I had to pick a site to emulate it would have to be Rich/GLC's site it is just so pretty is loaded with information. The only thing I dont like about that site is it's obvious bias for Kage but that's understandable.

    Under the surface of the most jaded cynic lies a dissappointed idealist- George Carlin
     
  9. ice-9

    ice-9 Well-Known Member

    Yeah...I really like the "go away" design myself. Maybe I have the URL wrong? <A target="_blank" HREF=http://world.std.com/~opus/>http://world.std.com/~opus/</A>
     
  10. uk_kid

    uk_kid Well-Known Member

    http://www.btinternet.com/~phil_arm

    it will be more of a fan site than a large archive site, but hopefully some of you will check it out when i get some material up. we need more VF sites. i for one am disappointed every time i see one die. this site will be my contribution to online VF. it is called 'Kageyaiba' at present.
     
  11. ice-9

    ice-9 Well-Known Member

    Ah, I thought I had the wrong URL -- thanks.

    I have one more with a different color scheme:
    <A target="_blank" HREF=http://virtuafighter.com/prototype/design5.jpg>http://virtuafighter.com/prototype/design5.jpg</A>

    You know, it's irksome how some people seem to be implying that there is no "info" at this site. I think people need to look around and really take the time to browse the site. Obviously, there are no movelists (VP, RSW and GameFaqs took care of that) but there are a boat load of original guides written specifically for the site, especially about system and techniques that is unmatched by any other VF site. There is obviously a bias towards VF3, as it is the only VF I play well.

    So again, Lonelyfighter, thank you for your helpful comments. I can assure you the "new" site would include movelists from every iteration (exception of VF Kids, maybe). However right now if you really want to provide constructive comments I need info on the *aesthetic* appeal of the site (damn I could've sworn I typed that a message or two ago...oh wait, I did).

    What site would you like VFDC to emulate on an *aesthetic* level?
     
  12. ice-9

    ice-9 Well-Known Member

    Chanchai thanks for the helpful feedback.

    For the horizontal menu I may make it into a more fancy looking text (perhaps I'll give it an outline or something to that sort) but overall it would look like text. Nice text. /versus/images/icons/wink.gif

    For the vertical bar I'm planning to make the VFs roll-overs. Don't worry, it'll be tasteful and fast loading. Basically every time your mouse goes over a VF the number will "jump out" at you. The sub-menu categories, unfortunately, will just be straight HTML text with mouse-overs (i.e. changes colors when your mouse is over it a la the present design).

    Whaddya think? Would that be enough or should I put an arrow type graphic next to the sub-menu categories?
     
  13. Chanchai

    Chanchai Well-Known Member

    Sounds good to me, I'll just have to wait and see. Some things don't lend themselves to well on paper, but turn out great. Nothing beats experimentation and experience/versus/images/icons/smile.gif

    -Chanchai
     
  14. akiralove

    akiralove Well-Known Member

    XBL:
    JTGC
    Personally, I like the 2 most recent designs. I like the cooler color scheme (although everone will have their own idea about this). One of the things I like if vf3 is how each character has their own color background at character select/portrait. Maybe you could implement something like this (i.e. kage's page blues, wolf's page reds etc)?

    I'm not sure if this falls under content or presentation, but I really liked the way Kris Amico laid out his site's character specific pages, with the step-by-step screens from videos with detailed captions. The Wolf ura page with the little video footage is too cool! I'd love see more stuff like this.

    lastly, I basically only use my computer for internet stuff, so i'm not really too savy at it, but whenever I try to print stuff from this site, it's a big pain in the ass since it's all white on black. Somrtimes I can't even read it (even after changing the settings in page setup). And since the recent format change, certain things on the site are displayed almost unreadably small (like this message compose window); even when set on the largest typeface in my browser's preferences. Would it be possible to have links to simple, text only versions of the documents for easy printing? Again, sorry if these issus have more to do with me being a computer moron than site layout.

    Spotlite
     
  15. Sudden_Death

    Sudden_Death Well-Known Member

    "One of the things I like if vf3 is how each character has their own color background at character select/portrait. Maybe you could implement something like this (i.e. kage's page blues, wolf's page reds etc)?"

    now that's an excellent idea!! this must go in.



    [​IMG]
    fuck spelling!
     
  16. ghostdog

    ghostdog Well-Known Member

    I think prototype/design5.jpg works best. Simple, but not too plain. The organization of content works well. Putting the "meat" of the site, which is the characters' movelists, techniques, media/versus/images/icons/cool.gif, etc., into the vertical bracket, while putting everything else into the horizontal bracket is clear-cut and efficient. /versus/images/icons/smile.gif
    And the <font color=red>c</font color=red><font color=orange>o</font color=orange><font color=yellow>l</font color=yellow><font color=green>o</font color=green><font color=blue>r</font color=blue> scheme ain't half bad either.

    What site would you like VFDC to emulate on an *aesthetic* level?
    Have you seen guardimpact.com? Very simple and clean. I also like the eyes at the top of the page.
    What a coincidence! Every character (except the shaolin monk) has that eyes picture, the one on the VF3TB disc cover.

    Well, there's my two cents. I think you'll do a great job with the new site design.

    -GhostDog
     
  17. Chanchai

    Chanchai Well-Known Member

    Spotlite, check to see if there's a "black text" option in the print setup that's loaded from your browser. It's not a universal option, but it's not a rare feature as far as I can tell.

    I liked the direction design 5 is going, but the light blue is evil on my video card (or at least how my monitor interprets my video card).
     
  18. Sudden_Death

    Sudden_Death Well-Known Member

    take some ideas from these sites, actually copy them :p

    guardimpact.com
    shoryuken.com

    i really like the color on those 2 sites. and the layout

    [​IMG]
    fuck spelling!
     
  19. ice-9

    ice-9 Well-Known Member

    My inspiration for the current prototypes comes from two sources: Tekken Zaibatsu and Videogames.com; in the next prototype I will try to emulate GI and SRK more (although to be honest I don't like SRK's design much).

    In either case, for the current prototype I've gotten some very constructive comments. Some people like the yellow-purple combination but some would also prefer to keep the overall tone of the site down.

    Myke made an excellent suggestion at a compromise:
    <A target="_blank" HREF=http://virtuafighter.com/prototype/design6.jpg>http://virtuafighter.com/prototype/design6.jpg</A>

    The colors mimic the classic Versus City look exactly. Are we getting any closer?
     
  20. ice-9

    ice-9 Well-Known Member

    spotlite, in the future site I will try to also have a printer-friendly version of the guides and movelists. Sorry for the current printing problems though. /versus/images/icons/tongue.gif
     

Share This Page