Web Design and Production

u3069391 - Nikita Dimaano

This website has been purely made for the University of Canberra Faculty of Arts and Design, I have made this site for Web Production and this is the result.

falsesecurity.me

Of course the target audience is for all people wanting info on specific courses to study at UC. The website design is simple, yet slightly creative. The side bar is fairly straight forward and at the moment the not all the text was taken from the original UC website, mainly because I didn’t think it was necessary. Youtube and map directions are on the index page, and Digital Design is the only page with links to student works and staff biographies to show that that area works and I can easily do the same with the others if needed. Email is always assessable on the side bar and the download attachment is located at the bottom of the Architecture page.

It matches my design flat closely, sadly a few alignment issues are giving me problems. I’ve worked on this website at home on my PC. However opening the website on the mac, a few alignment issues happen along with the lack of certain font files…there is a solution to this by putting directing to use other text, though the problem still persists. So rather than showing on PC properly, I’ve decided to align it to the mac screens with default max font.

Validator does not allow the youtube fullscreen so it’ll show up as an error, but I was told by ben that it was fine. All files have been Validated and has passed.

Other than that, there are no other problems!

This was a fun assignment, and overall it helped me a lot with the process of website design. I can’t want to make my own now!

SO!
All in all, I just based the page on industrial design.

When making it I didn’t want it to be plain white, it’s just boring to me…
With the header, I didn’t want a normal header either, I wanted something a little different… So picking this type of style makes me happy it’s not just any old normal site.

I like putting artists work on display, so having some featured artwork seems like a nice idea, and putting it on the top makes an instant appeal to people going to that page.

I took a big step from overdoing it to making it seem more simple. Overcrowded seemed like a bit too much..

Main navigation style, size, position:

My main nav is the side bar. I guess it’s a blend of http://svn2ftp.com/ ‘s and the thought process of UC’s side bar for when it ‘pops’ out. (when I mean pop out, refer to the picture posted with this. For example, when I click on industrial design, it will pop out the sub nav)

Size:

Width = 214px
Height = 671px
Position will be left side.

Sub navigation style, size, position:
Including the main it’s:

Width = 214px
Height = 764px
Position will be obviously still left side.

With just the sub buttons selected:

Width = 190px
Height = 95px
Position centered to the main nav

Search field style, size, position:

I just went with a normal search field. I didn’t want an over the top, and it’s the same as the rest of the main nav menu.

Size:
Width = 204px
Height = 46px
Position will be left side like the rest of the nav.

Body text size, style, colour:

Body text size = 15px (according to photoshop)

Style = MV Boli, default text is easy text and it also matches with the site in my opnion.

Colours = Blue, Colours used are based on the UC logo and what surrounds it.

Since the amount of text required from the normal UC website is a fair amount, in order to fit it, the page will probably be extended accordingly.

Body headings size, style, colour:

Body Text size = 36px

Style = MV Boli

Colours = Blue

Body links size, style, colour:

Body text size = 15px

Style = MV Boli and underlined.

Colour = Yellow, tends to stand out better and nicer with the bluey teal.

Body image/s size, style, position:

The only images I would have is the artists work being ‘featured’. The borders are suppose to change accordingly to the size of the picture. Even so, for this, I’ll measure out the ones I have on the page already. :)

Size:

Width: 295px
Height: 218px
Position, top and centered.

Style came from: http://sketch.odopod.com/

Background style, position

This picture here will be my repeatable wall texture in the background. it will be centered. This background was taken and modified.

Website can be found here: http://www.neveinspired.com/

This is where the ‘stitch’ idea came from.

Header style and size:

Style was inspired by Carsonified, but only small details. I added my own touches afterward.

Size:
Width = 984px
Height = 214px

Number of columns and widths:

I have 2 columns, consisting of the sidebar(Left Column.. I suppose) and middle Column.

Left column:
Width = 214px
Height = 671

Main column:
Width = 800px
Height = 1291px

Simplified the menu, now I will post details on the site…

Site width in pixels and position

Width = 984px (Including header and footer)
Site will be centered.

I couldn’t post it last night, so I’m hoping I can post it today. >_<

What i’ve come up with so far…

This is how the buttons on links will work. I’ve also added a layout to make it easier to understand.

I’ll go into more depth…

The header will always have the UC logo on the left, will have text underneath to tell visitors they can go back to the main page. The rest of the header will change accordingly to the faculty selection. (text will change only.)

Home/main - Will contain main information on the facility/The introduction, and welcome.
Contact info and Search options will always be available on the top and bottom side menu. As well as all the links, except sub menus. Sub menu’s will pop open once one of the main links are clicked on.

All main art/design links - Will contain info on their subject, on the top of the page will have certain featured student works. Sub menu’s will pop out (like the original UC page)

Sub student links - Contains art work of students in specific category. The pictures will be in the same layout as the featured artworks on the main art categories.

Sub teacher links - Just like the UC page just more stylized

Some example websites of “sketchy” that I’d like to put in here…

http://www.neveinspired.com/

http://svn2ftp.com/

http://carbonmade.com/

http://nimbupani.com/

http://www.mccoy.co.uk/

http://www.webdesignerwall.com/

These are some examples of what kind of style I’ll be basing my site on.

I love this idea.

People also have the option of finding out additional info on the artist as well.

This, blended in with the previous picture (http://25.media.tumblr.com/tumblr_lh3m21VqYT1qhoz0fo1_500.png) Would be a really nice mix. I think I would definitely input this in my website.

I think I’ve been drawn in to a certain style. Sketchy and creative…