[Colour Study] Seven colour ( contrast of light, dark, hue, tonal value, high key and low key)

Final results 

[Colour Study] Analogous colour

[Colour Study] Tone and shade colour

[Digital Interface] Class Exercise

Review on the existing website on Mc Donald. List out the pro & cons of the interface design layout, the navigation buttons and is the information clear enough for the user to understand to navigate the page?

Pros

The interface design layout looks innovation and interesting. The navigation button also is clearly state at there for user easy to find.

Cons

The interface design layout seems to colorful, this make user sometime will complicated and confusing.

Review

The interface design layout is more interesting. We can find what we need with just few easy step to find it. Conclusion, we can get all the information with clearly and understandable for the user.

[Digital Interface] Week 7

1) What is the interface design principles ?

The principle of user interface design are intended to improve the quality of user interface design. There are 6 type of principle :

• The structure principle: Design should organize the user interface purposefully, in meaningful and useful ways based on clear, consistent models that are apparent and recognizable to users, putting related things together and separating unrelated things, differentiating dissimilar things and making similar things resemble one another. The structure principle is concerned with overall user interface architecture.
• The simplicity principle: The design should make simple, common tasks easy, communicating clearly and simply in the user's own language, and providing good shortcuts that are meaningfully related to longer procedures.
• The visibility principle: The design should make all needed options and materials for a given task visible without distracting the user with extraneous or redundant information. Good designs don't overwhelm users with alternatives or confuse with unneeded information.
• The feedback principle: The design should keep users informed of actions or interpretations, changes of state or condition, and errors or exceptions that are relevant and of interest to the user through clear, concise, and unambiguous language familiar to users.
• The tolerance principle: The design should be flexible and tolerant, reducing the cost of mistakes and misuse by allowing undoing and redoing, while also preventing errors wherever possible by tolerating varied inputs and sequences and by interpreting all reasonable actions.
• The reuse principle: The design should reuse internal and external components and behaviors, maintaining consistency with purpose rather than merely arbitrary consistency, thus reducing the need for users to rethink and remember.

2) What is the elements of the interface design ?

Users have become familiar with interface elements acting in a certain way, so try to be consistent and predictable in your choices and their layout. Doing so will help with task completion, efficiency, and satisfaction.

Interface elements include but are not limited to:

• Input Controls: buttons, text fields, checkboxes, radio buttons, dropdown lists, list boxes, toggles, date field
• Navigational Components: breadcrumb, slider, search field, pagination, slider, tags, icons
• Informational Components: tooltips, icons, progress bar, notifications, message boxes, modal indows
• Containers: accordion

Navigation Button

1. Research on navigation button

"How" they display the navigation button?
A set of buttons or images in a row or column that serves as a control point to link the user to sections on a Web site. The navigation bar may also be a single graphic image with multiple selections.

 "Why" they need navigation button?
Navigation button is to help users move around a website 

 "When" they need navigation button?
Navigation button uses when user need to link to another website or page rather than using typing on search bar.

2. Can navigation button to be complicated or simple design?

Navigation button should be decorate in simple design. Because simple help user more easy to see it and more easy to use it. If using to complicated design, sometime user will be confuse on it.

Visual usability

1 . What is the visibility space in the interface

Visibility space in the interface is to show user the state of interface and other possible actions. Also, it tell us what interactions are available to be used.


2. Percentage of the usability interface

Redesigning user interfaces on the basis of user testing can substantially improve usability. In four case studies, the median improvement in overall usability was 165% from the first to the last iteration, and the median improvement per iteration was 38%. Iterating through at least three versions of the interface is recommended, since some usability metrics may decrease in some versions if a redesign has focused on improving other parameters.

3. How many users prefer the navigation icons on the right top/left top/ center / bottom?

According to a survey, approximately 2.55% users prefer the navigation icons on the right top while there is around 2.04% of users who prefer using the left bottom navigation icons. Other than that, 0.43% of users prefer it in the center of the display screen and 0.16 % of the users prefer the navigation buttons at the bottom of the display screen.

[Digital Typography] Organic letter forms

[Digital Typography] Expression typography

Dreamy

Happy

Angry

[Digital Typography] Exploration of typography

Working Process

Final

[Basic Drawing]

Week 1 ~ 2 : Sketch based on Measurement

Week 3 : Contour Line Drawing & Blind Contour Line Drawing

Week 4 : Gesture Drawing

Week 5 : Shading

Week 6 ~ 7 : Final Project

Class exercise 1

Week 1 & 2

Find out what is
a) Icons
b) Pictorial
c) Signage

Icons- A small picture that represents an object or program. The computer icon is a shortcut to displayed and run the program. In a webpage, an icon is often a graphical image that represents the topic or information category about the information.

Icons are very useful in application that used Operating System (OS) because it give a shortcut to run or close a program. Icon is also a lexical programming language, commonly use thought to be an evolution of the SNOBOL programming language.

Example :

Pictorial - A view of an object as it would be seen by an observer who looks at the object either in a chosen direction or from as selected point of view. Pictorial sketches often are more readily made and more clearly understood then are front, top, and side views of an object.

Signage -  To give a direction or a message or company location. 

Signs are any kind of visual graphics created to display information to a particular audience. This is typically manifested in the form of way finding information in places such as streets or on the inside and outside of buildings. Signs vary in term of form and size based on location and intent, from more expensive banners, billboards, and murals, to smaller street signs, sandwich boards and lawn signs. Newer signs may also use digital or electronic displays.

Example :