Progress on webpages 7-8

The 7th page describe about famous brands of chocolate in the world and related websites are linked to it using hyperlink. Other than that, there is moving pictures which is link to the ap div through 'named anchor' and a href. The moving picture from right to left is done through 'marquee'.

The 8th page is describing about benefits of chocolate. Here, the same design and illustration added to the page with description on the right of the picture.

More illustrations

Adobe Illustrator and Krita softwares are used to illustrate objects for the game.

Spring objects: (enemies, obstacles, collectable items)

Winter objects: enemy, obstacles and collectable items.

Lighting and adding background images in Maya

Adding background images in Maya.

The image was illustrated in Adobe Illustrator and then saved as png. format at the main folder in 'source images'. The designer added blur effect for distant image and flare effects for the lights.

First create a polygonal plane on grid. Make sure to change the subdivision height and width to 1 to make the lines disappear. Adjust the plane to the position wanted. (Above and side). Resize the plane. Assign a material to the plane and colour it. Now go to material attributes and click on the small square checkerbox button beside the colour option. Click on file and upload the image wanted.

Adding lighting.

The designer is exploring on lighting in rendering panel. The designer added directional light to the view.

The designer is adding spotlight above the table.

Result of adding spot light above the table:

The designer is exploring rendering.

Rendering view:

Web progress 7/8

Ap Div is used to add text which can be move without having problem of being stucked.

The designer learned to change bold text into regular by inserting font-weight: normal.

The designer inserted scrolling images from right to left by inserting MARQUEE behaviour.


Linking image to the text in same page. 

 First insert (named anchor) to the text wanted.

Next link it to the image using a href tag with #(named anchor).

Environment designing in Maya

Tne designer designed plate and spoon as well as tables for the environment. Floor and walls are also added.

6/8 pages in progress

The web described about information on chocolate.

First page is about home, where the buttons are inserted on left with the link to respective html pages. Rollover image is used for the buttons. Huge banner with melted chocolate was illustrated and inserted on upper page with the name of the page 'LoveBite Chocolate', together with the logo. At the middle, illustration of chocolate was drawn and inserted to give emphasize on it. Other than that, a small piece of information about chocolate is inserted right of the picture. At the bottom, more chocolate illustration is inserted together with the link for every html pages. Copyright was included below it. Other than that, javascript for audio for button click is added to make the page more interesting. The colour follows the moodboard and the font was limited to 'Bittersweet', Myriad Pro and Bookman Antiqua.

Colour used:

Home page:

The second page describes about history of chocolate. Map was illustrated in Adobe Illustrator and saved as png format before inserting into table. At above and below, melting chocolate is added. For main titles, Bittersweet font was used. On the right side of map, information is added with the font Myriad Pro (justify). At below, buttons for home page and next page is are added with audio. Bottom of page belongs to links and copyright which follows the same design as home page.

Third page describes about different types of cocoa and entitled 'Theobroma Cacao'. The design follows exactly the second page except the melting chocolate for upper and below as well as buttons were switched place as 90 degree relection (mirrored). For the information on types of cocoa, collapsible tab was inserted through the existing menu template (css coding). Other than that, doodles are inserted in between the page.

Forth page describes the harvesting and processing of cocoa. The design follows the second page except for the information which is altered. Tab is inserted to put information inside it. Other than that, illustration with rollover image was added so when viewer put mouse over it, the name of the process pops up.

Fifth page describes about countries that produces cocoa as well as some information on it. Map was inserted with table below it. The design follows the third page.

The sixth page describes about types of chocolate. Again collapsible tabs are added to simplify the space.