Sketches.
My sketches were really rough, and although I had a few ideas I wanted to go for, I couldn't settle on just one. Here are my sketches for each page.
Initially, I wanted the advertisement bar to be on the left of the screen, so that it wouldn't steal the light of my site, but the more I thought about it, the more hesitant I became. Either way, it shouldn't matter as much, because a good website design wouldn't be fazed by ads, so I'll just have to do my best to make sure the design ends up pretty to make up for it!
 |
| The goat will be drawn using either Clip Studio Paint or AI. |
I wanted to create a home page that will feature simple animation and sound effects, this will be the "front door" to the site that everyone will get a chance to walk through. For the background, I'm planning to use one of three alternatives. Firstly, I might use blurred photos that will change from time to time as teasers for the audience. Secondly, I could just use the photos as they are. Aside from that, I could also just leave it blank. Truthfully speaking, I'm leaning more onto the first two ideas.
 |
| This might be a challenge for me to live up to, but I'm willing to do my best to make it happen. |
The first page will be the main menu or home, and it will feature the animals as links to the informational pages in the site. The goat will lead to the "Profile" page, the duck will lead to the information regarding the petting zoo in Mini-Malaysia/ASEAN page, the parakeet to the animal vendor near A Famosa's page, and the iguana would be the fun facts page. An image of hands holding animal treats will be placed in the middle, to give an illusion of immersion for the audience to indulge themselves in. At the top would be the advertisement for FEESH, which used to be called AQUAMUNCHIES, hence, the name.
 |
| This is what the page might look like, roughly. (That's me with the iguana, by the way.) |
 |
| Here is one of the slideshow formats. |
My original plan for the site was to have different layouts for each page, but after consulting with Ms. Ida, we concluded that it'll look too messy, and will be too confusing for the site's visitors. For each page, dialogue boxes will come out from the animals' lips, and it will seem as if they are the ones who're explaining the details to each visitor. Slideshows will also be included in every page, as shown in the photos above, but will only pop up when clicked by the user. This is to avoid any fussy and cluttered layouts. So, the end product may be a mix of the two shown photos.
If you noticed, the page's directory icons will also be of the animals that will be featured in the site. I have still yet to decide whether I'd like to use actual cropped photos of them, or if I want to draw them. If possible, I'd like the former, but if editing the animals' heads off their body end up looking too creepy, I will draw them out instead. When clicked, and on the page where they're supposed to lead, the icon will also stick to a slightly different expression, for example, on the A Famosa page, the parakeet's mouth is open, but on the Mini-Melaka/ASEAN page, the duck's mouth opens instead.
Below are examples of a few other layouts of the other pages.
 |
| This would be my profile page, where I introduce who I am. I was planning to make the layout seem like the user is reading information on a food packet. But here, the advertisement is placed on the right side. |
 |
| The final page, which is the Fun Facts page, was a bit difficult to think up of. At first, I wanted to have the information typed into the shapes of the animals instead, but it may seem very cluttered. I'd like to give it a try, but I think I will end up sticking with the speech bubbles idea, because it's much, much cuter. |
Colours.
For the colors, I am planning to use something earthy and close to nature, pastel-ish, but also fun to look at. This is because my website will be targeting tourists who also happen to be fellow animal-lovers, and most of them could be parents researching information for their children before they head onto their Melaka trip.
 |
| A double-complementary color scheme example, provided by smashingmagazine.com |
I may use the palette above as reference, but if possible, I'd also like to include the colour white, with splashes of brighter colors to give my website a more vibrant and fun look. Below is one of the palette scheme examples provided by CoderSlab.com.
 |
| The colors really caught my attention, and I would like my site to bring the same effect to others as well. |
No comments:
Post a Comment