Major Assignment Concept #1 - Discussion Feedback

Today, I had a discussion with Christie and Eva about our major assignment concepts. It was basically just a small meeting where we looked at each other's mockups, critiquing and giving suggestions to better the idea.

What they said:
"The background image and the navigation bar do not really go together well" - the background has very smooth curves, where as the white boxes are too square and rigid.
Instead: give the bars some curve, to replicate the on-going gradient in the background image.
"The background is being covered up too much" - the size of the content section covers up too much of the background image.
Instead: do not have just one massive content box for all the information, but rather little boxes for each link.
"Navigation can be improved using Flash" - not really a problem, but the website could be 'jazzed-up' using Flash.
What to do: effects that happen when a link is rollover-ed, when a link is clicked, the opening of the content box.

I very much agree with what I've been told. The biggest dilemma for me at the moment is learning the Flash. However, Eva reassures me it's not too difficult so I should be ok. The first thing I'm going to do is fix up my navigation bar so that it fits better with the background image. Then I'm going to draw up a flow chart for the website content because I decided what I'm going to put in it today - following Christie's idea, it will be my personal online portfolio.

I'm very happy that I got to discuss my concept, as I felt it had some major flaws in it before but I couldn't pinpoint what I wanted to do or change. Now that I've been given some ideas to work with, I can continue working on it.

--
peaceOut
Spence

Major Assignment Research (cont.)

Today, I decided to take a look at some other websites for inspiration and what not. The main aim was to work out what to do with regards to the structure of the website, ie. navigation, interaction etc.

Website #1 - Y0ung-Hae Chang Heavy Industries
A purely text-based website, there is no real artistic or design factor. It contains just text with blue underlined hyperlinks to make them obvious. If you click on the links, you are taken to a Flash movies full of text. The Flash movies are interesting in themselves, because the text is synchronised very well with the fast-paced background music.

What To Take/What Not To Take - it is a very visually boring website, with little user interaction. The only reason I clicked on the links was because I was studying the website. If i was just browsing, I would've dismissed the site as something poorly made.

Webste #2 - Virtual Hitman Design
The first thing I noticed was the red 'spray paint' on the banner and the bottom right of the website. The website is for a group of designers showcasing their digital work. The banner tells me the title of the website clearly with a bit of artistic design. The next thing I noticed was that there was only one link - About/Contact. I started searching for the navigation system, then realised it had none. Everything was all on one page. It is good that there is no clicking so the user won't be lost amongst lots of pages, but the scrollbar is immensely long. Scrolling and clicking are the main two ways of interacting with a website. Besides playing a game, scrolling and clicking should be kept to a minimum.

What To Take/What Not To Take - the navigation system is a bit iffy. There's virtually no clicking, but lots and lots of scrolling was required. I believe a balance between the two is best.

Major Assignment Research (cont.)

Normally when I create a website mock up, I create the layout and images from scratch in Photoshop. Since this assignment has specified the topic, I felt a picture or photograph would be more appropriate and convey my ideas better.

My friend not too long ago gave me a website that provides people with royalty-free images and photographs. From there, I found a photograph which represented my interpretation of space.


I picked this photograph because it shows my interpretation of space on a visual level. The photograph looks never-ending, with no physical barriers. The clouds and grass follow the same curve, accentuating movement and continuation. The sky is often used as a metaphor for being limitless, and it takes up more than half of the photograph.
With all these elements combined, I believe the photograph conveys a space that is free, un-restricting, and very open.

--
peaceOut
Spence

Major Assignment Research

Last class, Gianni reminded us that our major assignment concept was due next week. Hence, I started my research for possible ideas. Our topic for this semester is Space.

The first thing I did was determine what space actually means. I Googled it and I got the following definitions:
+ the unlimited expanse in which everything is located; better known as 'outer space', this is usually the first thing that comes to mind for people when they think of space.
+ an empty area (usually bounded in some way between things); the physical definition of space, a place that is not occupied by anything.
Reference Link
These descriptions are both widely known, but different people have different interpretations of them. I, myself consider space to be, "a place I can move in". If I can move around, there's space.

For me, I prefer to be comfortable in my space. I intend to convey this idea through my website concept. I enjoy being in open spaces (over enclosed spaces) because I enjoy the unrestricted movement in open spaces. I'm not claustrophobic or anything (or at least I think so), but the flexibility and freedom to move around is more inviting than being cramped up by physical barriers. I hope to depict 'comfortable space' through my website.

--
peaceOut
Spence

Week 5 - Website Planning and Layer Stuff

In class we steered away from Dreamweaver and concentrated on some layer elements in Photoshop. We learnt about layer styles and adjustment layers. I didn't think I'd ever understand what each of the layer styles meant, and I have never seen adjustment layers before. Hence, this lesson was a real eye-opener for me.

Today, class ended early as Gianni wasn't feeling too well.

--
peaceOut
Spence

Andy Foulds

Andy Foulds is a freelance web designer (with vast knowledge in Flash) and a photographer based in the UK. The website I researched is his online portfolio showcasing his digital work.

The website is very structured and defined through the use of lines and colour. In this sense, it is more design-based than art-based. The site is completely done in Flash, which I find to be very impressive. The website can be broken down into various parts:
- the loading screen/introduction
- content
- design elements

The loading screen is designed to allow everything to load before it can be viewed. This way, the user isn't show a half loaded website which may ruin the experience. Andy's loading screen isn't any already one either. He has filled it up with lots of games and movies for entertainment, which I find to be very impressive. This keeps the viewer interested even when the website is still loading - very good idea! The last thing you want is people not even viewing your website and clicking back on the browser.

The way Andy has displayed his content is very attractive as well. Using thumbnails for website samples and labels allows easy access. Plus they jump out when they're rolled over, to allow a clearer view. This is all done so his work can be seen clearly, yet be packed nicely into a small window.

It is really clear that his sole purpose was to create a web page that displayed his ability - straight to the point yet being stylish about it. There are many different transitions used, but they're all linked together in some way. The use of sound was well done as well. It wasn't repetitively annoying, but it was used as an indicator of when things occurred.

Overall, I felt this website was really well done. It highlights everything Andy is capable of without going overboard and making it annoying. A very visually pleasing and interesting in general. I aspire to be as good as Andy in the future.

Week 4 - Exercise 1

This week, we continued on with the presentations on websites people found, and an in-class exercise. I was a bit unprepared because I just found out on the day, but nonetheless gave it my all.

The exercise involved creating a working website with at working links (at least one other page) using css, being given only a set of images.
I viewed this as a simple task, but thought we only had 30 minutes to do it. Before Gianni had said start, I'd already finished slicing up the image and was already working in Dreamweaver. Upon hearing we actually had 1.5 hours, I slowed my pace down and breezed through the rest it.
After the exercise, I volunteered to do my website presentation. The website I chose was the online portfolio of a freelance web designer and photographer from the UK - Andy Foulds. To visit his website, click here (my report on this website will be made on a different post).

--
peaceOut
Spence

Week 3 - My First Class

Yay! my first post for this blog. This is my first week in Web Art due to an enrolment error I had at the start of this semester, but it's all good now.

First thing I did was have a quick chat with Gianni beforehand to 'catch-up' with what I had missed the past 2 weeks. Basically, I missed out on the introduction to css and layers, two very powerful features in Dreamweaver.
In class, other students made presentations on the websites they found. These were very informative and interesting. The most intriguing was probably Ellis' website about the film Donnie Darko.
After the presentations, Gianni took us through slicing up images and exporting in Photoshop/ImageReady, and then converting them into layers in Dreamweaver. What he was going through at this I already knew (how to slice up images and layers), but instead reinforced the correct method of doing things.

At the end of the class, Gianni gave me documents for catching up to do in my own time.

--
peaceOut
Spence