 |
| Calculator Icon |
My first Icon created by photoshop
 |
| 64x64px |
Saturday, March 24, 2012
Icon Design
My first Icon created by photoshop
Metaphors Interface Design
 |
| Metaphor Interface Design |
The above is just one sample of Metaphor Interface Designs. Sample is an Apple app "Real Tools".
All of icons give the user the idea of what it does or its options. For example, when user needs a flashlight he/she just needs to click on the icon with a flashlight...and so on.
Also in the main menu, the icons organized and the way it layout as a tool chest helps user ease to pick up the icon (tool).
Friday, March 16, 2012
Web Page Interface & Navigation Review
Good & Bad Web Design
Here is one of the samples of the bad web design Accept Jesus, Forever Forgiven that I haven't seen.
First looking into the home page of web site, it makes the viewers dizzy due to the high contrast and movement between the colors of background set up (for me this kind of the design was not really concerned about human-computer interactive).
If the viewers try to dig deeper into web page, he/ she will see the most of icons/buttons on navigation bar were set with low contrast, text-color was the same with one of the background color (blue), and really hard to identify even though he/ she moves the mouse over it since there is no background/ text-color (highlight effect) set to give viewers the feedback.
The navigation bar on the home page, and other pages were not designed consistently. It was located at the top of home page, and at bottom of other pages this cause the viewers get lost since the page is too long.
Because all texts were set in bold (strong text), and its margin was set at small scale so the viewer's eyes must scan from one side to another side of screen, and after a few paragraphs his/her eyes getting tied. This usually makes the viewers get away or close the web page.
The below web site is one of the simple, and good web design Saint Patrick Proto-Cathedral Parish
The web page was designed with multi languages so this benefits the viewers even though they are not speaking in the same language.
The layout of all pages were the same in regarding logo, background color, color of text, font size, navigation
bar...etc.
All the pieces of the design work, and belong together. Background, color of text designed with harmony color it makes the viewer feel calm. Also the paragraph set in the center of screen it benefits the viewer ease to scan entire of the page.
All the tabs in navigation bar or links set with a highlight background color (gray) effect when the viewers click the mouse on the tabs or move the mouse over the links.
The web site was designed in a simple way but provides enough information to the viewers such as news, events, and contact info. All the pages links together, and especially in the "Events" page it provides a schedule/ calendar with all activities, and when a viewer moves the mouse over the link it automatically pops up a little screen in which just summarized the event so he/she does not really need to see the other pages if he/ she knows that is not what they are looking for.
Here is another web page that I think it is a good web design Capitol Toyota.com
 |
| Bad Web Design |
Here is one of the samples of the bad web design Accept Jesus, Forever Forgiven that I haven't seen.
First looking into the home page of web site, it makes the viewers dizzy due to the high contrast and movement between the colors of background set up (for me this kind of the design was not really concerned about human-computer interactive).
If the viewers try to dig deeper into web page, he/ she will see the most of icons/buttons on navigation bar were set with low contrast, text-color was the same with one of the background color (blue), and really hard to identify even though he/ she moves the mouse over it since there is no background/ text-color (highlight effect) set to give viewers the feedback.
The navigation bar on the home page, and other pages were not designed consistently. It was located at the top of home page, and at bottom of other pages this cause the viewers get lost since the page is too long.
Because all texts were set in bold (strong text), and its margin was set at small scale so the viewer's eyes must scan from one side to another side of screen, and after a few paragraphs his/her eyes getting tied. This usually makes the viewers get away or close the web page.
The below web site is one of the simple, and good web design Saint Patrick Proto-Cathedral Parish
The web page was designed with multi languages so this benefits the viewers even though they are not speaking in the same language.
The layout of all pages were the same in regarding logo, background color, color of text, font size, navigation
bar...etc.
All the pieces of the design work, and belong together. Background, color of text designed with harmony color it makes the viewer feel calm. Also the paragraph set in the center of screen it benefits the viewer ease to scan entire of the page.
All the tabs in navigation bar or links set with a highlight background color (gray) effect when the viewers click the mouse on the tabs or move the mouse over the links.
The web site was designed in a simple way but provides enough information to the viewers such as news, events, and contact info. All the pages links together, and especially in the "Events" page it provides a schedule/ calendar with all activities, and when a viewer moves the mouse over the link it automatically pops up a little screen in which just summarized the event so he/she does not really need to see the other pages if he/ she knows that is not what they are looking for.
 |
| Good Web Design |
Here is another web page that I think it is a good web design Capitol Toyota.com
 |
| Another Good Web Design |
Sunday, March 11, 2012
Subscribe to:
Posts (Atom)