Thursday, December 9, 2010

Graphic Interface Design - Semester's Work

For my html website I have chosen to focus on the Aggie Special Olympics. The reason I chose to do this is because I am a head for this campus organization and I have to do one anyways, so why not kill two birds with one stone.

Over the last few weeks I have gone through and actually completed this html website. the main structure, flow chart, and content has remained the same. There are still several bugs in it at the moment, but it still works (which was my goal).

Here's the url:


This project was extremely difficult for me for mainly 2 reasons. The first one being the poster, I can design and such but layout design is certainly my weak point and I struggle with it. The second one being the animation... I absolutely love animation (it's actually what I would love to do as a career). My problem is I can get so into it that due to a time frame I can never get it done in time. Due to the time constraints and my inability to get it done within the given time I have not yet finished it.

Here is the finished poster:


The begining: For my flash website I have decided to make a website based around greeting cards. I am in a card club and have tons of cards and I thought it would be fun to show case them in a gallery type website with a page where you can "design your own card". The website will have 4 buttons: Featured, Seasonal, Gallery, and Design your own card.

Several key things I plan on using is and outro/intro and drag & drop actionscript. If I have time at the end I will attempt to make it so when you click or rolloever an image it will enlarge.

The middle: So far I have created a flow chart and spent forever going through all my cards deciding which ones to use and such. For my color choices I have actually gone through all my scrapbook paper and creating mini color palletes. As I look through the colors I find that the more simple the better because the cards are already colorful enough and I don't want to background to over power the cards.

The actionscripting: At the moment I have all my content into flash and everything placed where it needs to go. I have all the pages on seperate layer and I have made it so I can do an intro and outro (I just have to do the code). At the moment I have the drag and drop code working on the design you own card. Now I just have to do a preloader.

... the preloader was not fun to do. I kept having problems with it and it was ruining everything I had going. In my flash files it wouldn't work but when I put it on the server it did :)

... the intro and outro. I ended up canning the intro and outro because it kept ruining everything else that was working. I know it's now not as fun as it could be but I figure it was better to have the drag and drop feature and the preloader work than for it to be animated between each page.

... the drag and drop. The drag and drop worked exactly how I wanted it to with only a few minor changes. I ended up putting a trash (black and white lady bug) so that if you wanted to dispose of an element you could however there was only one of it on the page so once it was gone there was now way to get it back or to put another one. I know there's got to be another way to make it so you have unlimited elements, I just don't exactly know what it would be called. I've done a bit of researching and I'm not finding what I want (it's probably just because I have no idea what it's called... I had this same problem when researching the "trash can" code).

Overall, I'm pleased with the outcome... the only thing I would change would have been to make the area bigger in flash becasue when it opens on the web it's a bit small. I also wish I had more time and could figure out how to rollover and image and it would pop up large. I found a few code snippets that I couldn't get to work and everything I found online also wouldn't work. Overall, I learned a lot creating this website and if I had to choose between flash and html, I would definately pick html.

Here's the link to the website:

No comments:

Post a Comment