2nd Mock up

Old Versions

The main objectives for this website are to promote my abilities as a designer and demonstrate my ability and knowledge that I have obtained threw out my years in college and work experience. It should express my design style and show all of the different aspects of design that I can handle.
1) Make a client interested in giving me a job or to be employed in an office.
2) Show my abilities as a Designer and a Developer.
3) Express my creativeness.
My target audience is possible Art-Directors from Graphic/web design agencies that are looking for employees, people from all creative backgrounds or potential freelance Clients in need of a project. People that are already in the field will have a much more critical eye and a better sense of my abilities, also visitors with a background in web design might check out my coding abilities. But regular freelance clients will be easier to persuade to hire me, if my website is visually interesting and simple to operate. On the other hand, in order to impress more experience designers they must see that I have a solid understanding on the basics of design, know how to incorporate it in my site, see that I follow current trends and my taste is up to date and people with coding/web experience must see that my page is weal coded flexible and uses optimized standards.
The main goal is to make the visitor look at my work and then contact me. Ultimately the sites prepuce is to impress and that impression to result into a job position or a project for hiring. The first thing that a visitor views are four buttons depicting four symbols, a Speaking pipe that symbolizing passing a message and this will stand for advertising and graphic design, a eye that stands for photography, a spider web that will stand for web design and could be also be intrepid as catching somebody’s attention and the forth one is pretty much strait forward, a brush that will stand for art work. All these links will lead the visitor without delay to view my work. And hopefully if they like what they see they can easy click on a link on the bottom of every page that will allow them to email me that instance or they could navigate to the contact me page and email me by easily submitting a form or contact me finding my contact information. Another secondary goal of the page will be to make them if not hire me then to at least book mark me for future reference, this would be achieved by adding a button in the bottom of every page that will allow the visitor to favorite or bookmark me in a variety of sites as for example Del.li.cious.com, Digg.com, twitter.com or on their browsers. Bookmarking my site on one of those pages will further promote my page to other users that search those sites and increase my sites traffic.
Buttons

Bookmark Button

What will a potential visitor benefit from a visit to my page is that he will find out that I am capable to use many platforms have knowledge on a variety of programs and fields. Only by looking at my site they will realize that I have used CSS, AS3 and html coding. They will find out that all the photography and design work is created by me and that I could use and adjust open source Ajax applications for my own benefit. This will make them realize that possibly they might only need to hire one person that can work on various aspects of a project instead of hiring separately a photographer a web developer and a graphic designer. Or maybe if the only need a graphic designer they will like to hire somebody with more versatile skills for future projects.
Visitor will not only be looking for examples of my work but most probably they will also like to read some information about me, see what past experience I might have as for example where have I worked and what projects I have worked on, my resume and most probably they would like to know what are my future goals and expectation from my career.
Navigating thru my site should be easy and effortless. To view examples of my work portrayed in a open source Ajax application known as “Shadowbox” customized to fit the site need and looks. These will be access by four buttons animated with Flash on the home page of the site and they could also be accessed by regular links on the bottom of every page this second option is added in case a visitor does not have Flash player and it also makes it easier to access from all pages. On the top right of all pages there will be a navigation bar that will prompt to the home page that will include the four buttons towards the examples of my work, a link to my biography, a link to my resume and a link to the contact form and information. At the bottom of every page there are links to all pages including the four categories of work examples for quick access.

But in the web world design and looks are not everything and there currently not the most important component in a web site. People prefer to visit a webpage that looks honorific more than a well designed page just because they can find what they’re looking for there or the quality of their service or product there offering is better. User will prefer a simple self explained navigation then a complex dropdown glossy looking navigation because in the end they don’t care how good their car looks them just care how fast and easy they will reach their destination in the web.
People don’t go on the web to have a visual experience if they want to enjoy good art or photography they would probably go to a gallery or museum. People go on the web to retrieve information, purchase something or to reach a contact. In most cases they ignore all the distractions and go straight to their point of their visit at a web site.

One main mistake designers make is mishandling text when web designing, they usually use script fonts that look good but are not legible or add effects to it so that it could blend in more easily into our design. When you want to add a graphic text to your site that means that you have to convert it into a image. That could have many disadvantages, first one is that a graphic text is not as legible as a nice clear type, second when a search engines crawls a web site it can read bitmaps and that will result at missing a lot of important information that maybe could promote your site in a search engine. Making text into an image also means that the user wont be able to enlarge your type make it impossible to read for many people with visual disabilities.

Text on the web than printed text is a complete different story because people have different expectations from it. People need to be able to search text and find what they want fast they need to be able to copy it , to paste it, to edit it resize and in generally customize it to their specific needs. When a user doesn’t achieve the desirable results from it he gets a turn off. Also from the designers point it is a pain to mold text into his expectation because kerning line height and all that luxuries that print offers seams impossible sometimes to achieve in a site and even if you achieve it you can’t know with currently if it would work on all browsers. So in my opinion when using text on the web simplicity is the key. Less is more and it will by less painful for the designer and the user to have nice simple text.

This doesn’t mean that sites have to be blunt by just using text boxes and with no graphic elements or pictures. All this is just to say that only emphasizing on design is not the way to construct a website. There is ways to make a website both functional and presentable. Websites need to be designed to be flexible.
The design of a page shouldn’t focused to just make it look good it should be targeted towards making the website more functional and point out what’s needed to be conveyed to its audience and make it more memorable.

Today we can see that simplicity is the solution to a successful web site and if we had a hint of design that would push success even more. One example would be facebook. facebook is not the prettiest website but its success is phenomenal as millions all over the world have signed up. The design is not terrible but it is extremely functional and they also added a design element to all pictures by making all corners rounded. The point here is that design has to work itself and adjust for the website and not the website adjust for the prepuce of design.

A users experience on your website is the key on how long he will say and brows thru it if he likes the design and if he feels comfortable and found everything easily he might even revisit. The “user experience” at a web site has mutable components to consider from the design of the it to were the navigation is placed and what elements are included for example a search bar. And understanding what the effect of all these elements on the user may be far more complex than we think.
Trying to understand the whole user experience at one would be too confusing so its better to devide it into three pieces which more easily to manage. 1st) I.A. (Information Architecture which specializes on placing and formatting the sites structure to have the most persuasive results possible. 2nd Interaction Design look on how the users view the structure of the site and identity design that perpuse is to tag and make a product recognizable and more attractive.
In more detail:

Information Architecture
How information is arranged is often they key of how fast and easy a user will retrieve the information he is looking for. And for many websites if not all of them getting to the information the user wants fast is critically for the overall success of the site. Here comes information Architecture that specializes in organizing that information and placing them on the right place for the user to reach them as desired.

People are always looking for a pattern they could recognize in life whether they do it consciously or unconsciously we look at stuff and we connect them do our past experiences weather to predict what will happen next or to identify the wright choice of something. The Information architect has to come in and place the information in a pattern that the most users will identify and solve the problem for them, before they even realize it.
This process should begin before the development eves starts by asking yourself who is the target audience or what words are going to be used that way you will know where to place what.

Interaction Design
In all over the environment we come in contact in tasks in which we have to interact with a devise or machine, in order to operate that machine or devise we are required to press a button, turn a knob or even say something to activate in order to complete a task. Whether it’s a button in a elevator or we open a door. Interaction design is the the process of designing elements in the digital world which will enables users to use a site or a digital interface. It does not only include the buttons of a page but also the overall immediate experience as the user sees, hears, reads or has to interact with.
Interaction Designers determine how to make the elements that I.A. (information Architecture) have put together presentable and understandable by the user. Meaning that the interaction designer will take what the information architect has put together into a graphic display that would make the most sense for the user to perceive in the clearest way and to emphasize on what’s needed to be pointed out.

Interaction design is concerned in more detail what the information’s architects have pointed out they determine whether a tast needs more clarification towards the user or what to include in a task flow for the user to use an element and what they expect from it. They determine whether the size of a button or element is appropriate in how important it is for the site and the user to see it. Also there job is depending on who is ther there target audience to design the appropriate site for them. For example the would make the font of a pages text larger if they knew it was targeted towards senior citizens.

Identity Design
What is identity? Well when we see a coca cola red we immediately think of coca cola or when we see the two golden arches we immediately think of McDonalds these brands have succeed to give them self a globally identifiable identity which is every companies dream. The purpose of Identity Design is to give a site a unique feeling and sense to the user which will express the peruse of it and make it more memorable and recognizable to the user in the future. Also in many cases it has to express what the user expects it to look like in order for him to feel secure in that environment. This entire feature can be determined by the color, font type, music and the design elements that they site will convey.
It is the identity designs responsibility to identify what qualities of one company makes it differ in the best way of its competition and amplify it by expressing that attributes in the design of the site.

I remember the transition this summer and I remember the reaction most of the people on it had. This summer facebook changed its interface towards the best, the way the transition occurred was they added an option to keep the old interface or try the new one. This got a lot of people confused when suddenly after two months they were thrown to the new facebook and they didn’t have a clue what was going on. This got people angry and I remember almost a 70 % of my friends changing their status to protest how much they hated the new interface and a lot of people joined groups titled “I hate the new facebook “ or “Bring the old facebook back”. The question is why did people hate the new facebook interface although its designed to improve the user experience.

I think it’s simply because users had become fixated with the old interface, they had become used to it and they knew where to find everything without even thinking about it. Now suddenly they are confused and lost in the new design resulting in hating it, because users are inpatient and won’t give the time to research for the changes. Their eyes don’t read what’s on the page they simply scan it in result they skip all the details and see only what seams important. Although facebook designed it to be cleaner people had difficulties to find the features they wanted on the page because they could not get over there old habits.

The mistake in my opinion that the people at facebook did was that they did not consider the users when they redesigned the site but they saw the new facebook with the eyes of an interface designer instead of the stuck to the old design user. I think they could avoid this if instead of giving people the option to use the old facebook or new facebook to periodically change features one by one making the transition more friendly and unnoticeable to the user. As I have observed after the grand redesigned they probably figured the same thing and they have changed a few things without anybody really noticing them. The also added the very clever notes on some of the new features in order to let people know there there, and help people know what they do in order to become more familiar to them.

Despite the radical changes and the complains of the users they eventually got used to the new interface and overcame their difficulties and facebook remains one of the top if not the top social networking website in the planet. Because of its simplicity and clarity combined with the clever new features.

http://www.cmswire.com/cms/web-content/the-best-websites-are-useful-and-ugly-001501.php

This article I think was more to point out the fact that usability and readability is more important than the design its self. I agree on the fact that design is not the number one factor in the success of a web page, but I would like to believe that a well designed site will feel more inviting to the viewer and hopefully more redeemable. And perhaps one other reason of some websites as Ryanair in also what they have to offer to the costumers, for example better deals etc…

Web Standards, Browsers and Designing For The Future

http://www.articlesnatch.com/Article/Web-Standards–Browsers-And-Designing-For-The-Future/76440

From my experience trying to follow web standards and create a cool design that would look the same in all browsers was a painful experience. Firefox I could say was the most “obedient “browser than the rest. Explorer 7 was not that bad. The most common problem I would encounter mould me by setting margins and padding it would vary from browser to browser and sometimes it would cause some floating objects to overlap each other or go underneath which would result in ultimately screwing up my design. I believe the best you can do is find a middle ground between all the various browsers so your website could be legible to any visitor.
One other component I observed was the problem with Pngs files, I based a whole website on Pngs and testing it on Firefox, explorer 7 and safari everything looked smooth but once I one day tried it on explorer 6 it was an awful sight. And after some research I realized that a significant amount of users still use Explorer 6 so it is important that you don’t only built your web site for the future but you also have to keep in mind the past..

The Theory Behind User Interface Design, Part One

http://www.developer.com/design/article.php/1545991

I agree with all that this article had to say , though UI design is mostly an Information Architects job there is no reason that a web designer shouldn’t apply some to these ground rules to the website he is designing.

2008-9 Design Trends

http://www.developer.com/design/article.php/1545991

http://www.webdesignerwall.com/trends/2008-design-trends/

http://www.fuelyourcreativity.com/23-kick-ass-portfolio-designs/

From my observations and from viewing examples from the various articles posted, the new trend went from the glossy 3D look to a more 2D flat with a matte kind of feeling. All that glossy elements and buttons have become something like Photoshop shadows or filters which become kind of a cliché and obviously not original anymore. The switch from what I understand went to two directions one the matte and retro feeling designs which often include various ornaments and shapes that makes the website feel more personal and the simplistic style where less is more.

Good Designers Copy, Great Designers Steal
http://www.sitepoint.com/print/copy-great-designers-steal/
Well its always good to pick on other successful designers ideas, especially when you are a student. The trick is not to exactly steal or copy what you do on your own but its best just to step on other peoples successful ideas and give them a touch of your personal style so in a way you make it yours again.

W3C Tackles Web Typography with CSS 3

http://www.cmswire.com/cms/web-cms/w3c-tackles-web-typography-with-css-3-002746.php

This article really made my day, it seems with the new method that will allow the web designer to upload the font family to the server and use it on the website will obviously make a web designers life easier and open new doors. No more would a designer would have to make the painful decision to add or to not to add a script or graphic font to his webpage. In the past that would mean that he would have to make a image using either Photoshop or illustrator of every single title or where ever he needed the type then optimize it, then write the code to add it, then add the actual type in some hidden form so the search engine crawler can see it’s there. So CSS 3 Type a good thing.

Dreamweaver CS4

http://pcworld.about.com/od/techindustrytrends/Dreamweaver-CS4.htm

I recently tried out the whole suite and I really enjoyed the new interface look. I believe they achieved to make it more adaptive depending on who is using it Ex. Designer, coder, application developer.