Sunday, June 2, 2013

Animation Website - LOMBOK

Lets start the long journey! Mr. Anton asked us to make an animation website and Mr. Angga asked us to make the interface website, and we make it two in one. 



First i made some sketches, and i stop when i thought the last one is the best. I asked to Mr. Anton and Mr. Angga. Both of them approve it. I started to sketch the next page of the website. I also have to think about the element, color, font, and how it works. 




 







After some sketches of the website. I thought how about loading page. My first option is a sunset because Lombok is popular of its sunset (the sun is going down from the sky to the water and blank page), the second one is illustration mount for Gunung Rinjani (one of the most popular Lombok’s tourism place, and the fog can blowing up), the last one is a fisher man with a turtle (the fisherman will move from the left 0% until right 100%). But after some QC, Mr. Anton said to change the sunset become sunrise, looks better. Okay then. 


This is my first design of cover website. The size is 1024 x 1024 px, not as usual. I took the beautiful beach photo, and put some images there. I didn’t put any text on the option because people knew what i meant, right? The sasak house as hotel, suitcase as package, camera as gallery, signage as about, boat as transportation, and shell as contact us. I also put the my logo of LOMBOK, and little bit information about this official website. 










 My element of sketchy style also when your mouse over the image. But Mr. Angga againnnn asked me to change the typeface of ‘welcome to‘
 






After QC, Mr. Angga said the color of the sky is not really suitable, because my concept for this website is romantic, couple, honeymoon, and warmth. SO, i changed the sky color became little it orange for sunset and warmth. Also change the typeface of ‘welcome to‘ for my sketchy element.











This is my final website interface. Looks like pastel color. Then i changed the typeface with ‘sketch- me‘ by dafont.com to match it with my sketch style element. 





Sasak house as hotel. As Mr. Anton suggestion to add some caption about the page to make like introduction for readers. I used Gill Sans typeface as the title ‘hotel’ because the first logo is Gill Sans too. There are some hotels. All of them is 5 stars hotels :D 





Shell as Contact Us. Mr. Anton suggested to put the empty box only, so our inbox will not full and become junk. But some of tourim websites still put their information. So i just put the address. 











Boat as transportation. There are Cidomo (LOMBOK traditional transportation that they used everyday), Jazz for couple, Innova for small family, mini bus for big family, bus for tour, and boat for some activities from LOMBOK to Gili. 


These are page and the link of “About“. I just put about lombok, Tradisi Kawin Lari (for the concept is honeymoon, the article also about marriage), Gunung rinjani as the travel and tour, and Ayam Taliwang as the one of most popular LOMBOK’s culinaire. When you click on the photos, the text will come in first , then the picture. All also with animation. I pick the articles that not too much and heavy but still important, to make it interesting.







There are just 2 options of package, Tour or Honeymoon. For tour there are divided by 3 options, 3 days, 4 days, and 5 days. Fot Tour there are only 2 options, 4 days and 5 days. The tour of course for family activities, and the tour for honeymoon couple, the best schedule is sunset view and romantic dinner. The animation is on the text, when you click the page, the text will come in from the bottom or left or right. 





For the gallery, i put some picturs and transparency in front of them, but you can see it clear when your mouse over the picture. 



BEHIND THE SCENE





This is behind the scene of the website. That are a lots of layers. Sometimes makes me corious, but sometimes makes me bored. From this, i learned to make it tidy per layer and divided them by label. 



 I learned to make the page link to other page, but click the object > action > add script. TBut make sure, the (“hotels”) is the label of page that we want, because just a dot can destroyed everything.
 



This is the script of stop, to make the animation of every page stop. This script it put on the last frame of the label. If you put at first or on the middle, the animation of one page/label will not work at all. 





From all of these exercises and final project, i learned so much things. I learned how to make a thing can move with some effect, how to make a script which is can linked to other page, how to make a website interesingly, and how to concern in every little detail. I love this process, i can learn step by step, slow but sure. But because of the deadline and some conditions make me made the page not really clear like the real website :( I hope i can improve on other chance. I don’t really satisfied about this website. I want to make it looks real, someday :b At the end, i just realize how hard to make a animation film and how amazing is flash can work! 


 HAVE A NICE HOLIDAY! 

 JA








No comments:

Post a Comment