Final Project Part 1 – Examine mad-scientist approach (Tutorial Exercise)

In the tutorial exercise, we were tasked to do work on our final project but the prime importance is not on the graphics, but rather how the user experience is crafted. The Mad-scientist approach is being used for this particular exercise.

What is mad-scientist approach you may ask.  As described by Scott McCloud in Reinventing Comics, The mad scientist approach is one that allow comics to take on a different role in which its viewing experience is altered; being different from traditional comics where panels and frames are bounded. In mad scientist approach, the notion of a seemingly endless canvas is introduced with the screen as the boundaries instead of having a border that is fixed in place.

This tutorial exercise can be seen as one of the introductory session to help us cope with the execution of the Final Project as it can most likely be one of the mechanism to use when doing up the group project.

At first I find it extremely difficult to code this seemingly easy script, but to be able to code and layout the images, it is extremely technical and not as straightforward as compared to softwares such as Illustrator or InDesign, where you just plonk, click, scale and drag to your desired size and position. However in Dreamweaver, its all about the code that displays what you tell them to. To add on to the frustration, text has to be on another layer.

I overcame the obstacles by using the .container as a boundary, and set .div tags as individual components and position it absolute so that I can have complete control of where to place them. I also managed to add the text on a separate layer. I’m glad to have successfully produce Draft 1.

Click on the image below to experience how the full web version might work! (P.s The image below does not reflect the actual script that I’ve done up for submission, components such as Text are removed on this image, but exists on another layer which was submitted, this is just a feel of how users can scroll/view the sequential art ) 

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

w

Connecting to %s

%d bloggers like this: