Background & Introduction
The Goal Oriented Design | What is Design?
well-organized, managed and provides some appealing feeling to the eyes i.e Meaningful arrangements.
Why is design important?
The satisfaction of using anything is directly concerned with its design. Design is equally important in physical goods as well as digital assets and software applications.
Introduction
The Goal Oriented Design | Digital Devices often come with screen. Screen were only used for displaying some status or information in a computer system. With growth and expansion of computer technology, interaction with computer system was made possible through the screens and input devices. User Interface (UI) is meant to allow human computer interaction.
Course Objective
- How to design user interface?
- Which environment requires what kind of user interface?
- Devices: Mobiles, Tablets, Desktop Platform: Windows, Linux, Macintosh, Android, iOS
The Goal Goal Oriented Design
This is my business problem, solve it. (Think about user too)
Background:
- Someone wants a software because s/he realizes software can solve his business problems.
- Findings from Research lead to the necessity of a software system to facilitate business problems.
Software development is about Research and Development (R&D)
What is trend?
Mostly “D” and very little or no “R”
Design emerges from the research and development teams meet those design needs being goal oriented.
Problems with today’s softwares
- Making the user look stupid
- Causing user to make big mistakes.
- Slowing the user so that there is less efficiency.
- Preventing fun and boring the user
When we choose Replace Windows 7 with Ubuntu, the installation does something else. It formats the whole disk instead of formatting the drive on which windows 7 installed.
Stakeholders in software development
- User
- Business (Marketing, Human Resource, Account, etc.)
- Programmer
User centric design must be taken into practice than business and programmer centric. E.g. A web form that is sent as email instead of storing in database.
Considerations:
- Software that is rude (language and behavior)
- Software that is obscure (hidden features)
- Software with inappropriate behaviour
Examples:
Features of user interface design:
- No rude language
- No hidden features
- No inappropriate behavior (good user experience)
- No misleading controls or messages
- Effective user functions to increase efficiency
- Infrequent users friendly (Facebook vs. Google+)
Models of Interface Design
[su_row][su_column size=”1/2″ center=”no” class=””]
Programmer (Software Design)
- Mind is blended with programming terms, understanding and complexity.
- Programmers are concerned about what they can do easily by writing easy codes.
- It is about what the software program will do, what the UI will look like and what is the result when a button is clicked.
- It also includes the communication between different modules and objects and their responsibilities and functions.
[/su_column] [su_column size=”1/2″ center=”no” class=””]
User (Interface Design)
- User just knows general terms, have basic understanding and they don’t like complexity.
- It is a subset of software design that is concerned with the visual components in the software and their behavior.
- How will the UI look like when a user starts a software application?
- What will the button with “Login” text do when it is clicked?
[/su_column][/su_row]
Models of Interface Design
[su_table]
| Conceptual Model | Implementation Model | Manifest Model |
|
|
|
[/su_table]
How to design login page for facebook in browser?
[su_table]
| Conceptual Model | Implementation Model | Manifest Model |
|
|
|
[/su_table]
Also Read:
User Computer Interaction – Ultimate guide User Interface Design
Relationship between three models of interface design
In the figure Represented Models represent manifest models. The closer the manifest models are to the mental model, the better is the manifest model of interface design. So, instead of being closer to implementation model, closer to mental model is necessary for a good interface design.
Modeling From User’s Point of View
- Focus on user goals.
- Ignore technology implementation if required to meet user goals.
- Follow user’s mental (conceptual) model.
- Don’t use mathematical model for inventing user interfaces.
Visual Interface Design
- GUI (Graphical User Interface) is better than character based user interface.
- Despite of GUI, majority of programs irritate and annoy users, why?
Visual Software
- Must of user-centric rather than technology-centric.
- The qualities of user-centric are visualness and program’s vocabulary.
- Technology-centric is about graphicalmess.
- Visual software is required because humans process it better than textual ones.
- Interaction must be visual. For this, GUI is replaced by VUI (Visual User Interface).
- So visual interface design is about software that has user interaction in some observable form.
Advantages (attain user goals):
- Feeling of fluency.
- Moving along smoothly/effortlessly.
Visual Processing
- Human brain is a superb pattern-processing computer.
- Acuity of human eye is tremendous and is managed by brain.
How Visual Processing works in Humans?
- When we look a view in front of us, our eye receives the visual input and passes it to the brain.
- Brain unconsciously process patterns. It also establishes a system of priority.
- Brain consciously analyzes visual inputs.
How human brain processes complex scene?
- Complex scene is broken into chunks of the view that are manageable pieces like building, street, tree, etc.
- If we have difficult time visual complexity, the visual information that we see puts us in a state of shock.
- If the brain quickly processes those chunks, then it starts to analyze for the details.
- If there’s someone we saw in past in the view, our subconscious brain identifies it that we had seen the person somewhere before.
- Then the details are observed to identify who the person actually is.
- Likewise, documents also are identified first through patterns.
- To know what the document has, we look for the details.
Visual Pattern
- Need to present the program’s components on the screen as recognizable visual patterns with accompanying text as a descriptive supplement.
- Patterns are engine of unconscious recognition. (To recognize something, we don’t need details in it. This is the difference of pattern from pictures, images or icons)
- Pattern matching is done by unconscious mind.
- Reading is done by conscious mind. It is only done after pattern matching.
- Visual patterns have text but in a secondary role of distinguishing between objects with similar patterns. If there are a number of menus with icons followed by text or label, all of them give the visual pattern of menus.
Example:
- While driving, if we see some symbols on highways with written text in them like “H26” within a shape, we learn the shape from the context in which it is used. The symbols represent that the road is a highway.
- From then on, it represents the context.
- Whenever we see the same visual pattern on a new location, our brain identifies the visual pattern with context and makes us aware that we are on highways.
Visual Interface Design (Contd.)
Visual Interface is based on visual patterns. Our visual user interface must create readily recognizable patterns. For that, we must create symbols for objects in the interface. The symbols must be recognizable. As a result of this, user can understand and manipulate the interface and achieve user goals.
The Canonical Vocabulary
Learning a new software and its user interface is like learning a new language. In order to let learners learn it easily, we must restrict the vocabulary of the language. The restriction in vocabulary is achieved by GUI. GUI were first user interfaces to restrict range of such vocabulary for communicating with the user. Input changed from command line to a tightly restricted set of mouse based actions.
Drawbacks of Command line based UI
- Must know exactly what text or command the program accepts.
- Must remember letters and symbols (symbols used in text).
- Must remember the sequence of words in commands.
- Must remember the capitalization of some words in commands.
This introduces need for restricting the vocabulary.
- So if there are more atomic elements in a communication vocabulary, the learning process becomes more time consuming and difficult. T
- This means to say that we restrict the vocabulary to make user interface learning process easier.
The Canonical Vocabulary
A properly formed vocabulary is shaped like an inverted pyramid. All easy-to-learn communication systems obey this pattern. It is so fundamental unit that it can be called canonical vocabulary.
Example:
- In a telephone system, there are number of primitives used for the communication with the user.
- Those primitives are in the form of audio tones.
- The dial tones is different for each key to identify different key is being pressed.
- There are different tones for different status like call ringing, busy or error.
- The purpose of these tones is to restrict the communication vocabulary.
Some important references
https://skillcrush.com/2016/05/31/what-is-visual-design/
http://fadeyev.net/visual-interface-design/
Course about User Interface Design on Coursera
https://www.coursera.org/learn/ui-design
If you want to know what exactly user interface design is for and what jobs are available in the present world related to this, this course by Coursera is very helpful.
