Sunteți pe pagina 1din 7

INTRODUCTION:User interface

design or user interface engineering is the design of computers, appliances, machines, mobile communication devices,software applications, and websites with the focus on the user's experience and interaction. The goal of user interface design is to make the user's interaction as simple and efficient as possible, in terms of accomplishing user goalswhat is often called user-centered design. Good user interface design facilitates finishing the task at hand without drawing unnecessary attention to itself. Graphic design may be utilized to support its usability. The design process must balance technical functionality and visual elements (e.g., mental model) to create a system that is not only operational but also usable and adaptable to changing user needs. Interface design is involved in a wide range of projects from computer systems, to cars, to commercial planes; all of these projects involve much of the same basic human interactions yet also require some unique skills and knowledge. As a result, designers tend to specialize in certain types of projects and have skills centered around their expertise, whether that be software design, user research, web design, orindustrial design.

PROCESSES:There are several


phases and processes in the user interface design, some of which are more demanded upon than others, depending on the project. (Note: for the remainder of this section, the word system is used to denote any project whether it is a web site, application, or device.) Functionality requirements gathering assembling a list of the functionality required by the system to accomplish the goals of the project and the potential needs of the users. User analysis analysis of the potential users of the system either through discussion with people who

work with the users and/or the potential users themselves. Typical questions involve: What would the user want the system to do? How would the system fit in with the user's normal workflow or daily activities? How technically savvy is the user and what similar systems does the user already use? What interface look & feel styles appeal to the user? Information architecture development of the process and/or information flow of the system (i.e. for phone tree systems, this would be an option tree flowchart and for web sites this would be a site flow that shows the hierarchy of the pages). Prototyping development of wireframes, either in the form of paper prototypes or simple interactive screens. These prototypes are stripped of all look & feel elements and most content in order to concentrate on the interface. Usability testing testing of the prototypes on an actual useroften using a technique called think aloud protocol where you ask the user to talk about their thoughts during the experience. Graphic Interface design actual look & feel design of the final graphical user interface (GUI). It may be based on the findings developed during the usability testing if usability is unpredictable, or based on communication objectives and styles that would appeal to the user. In rare cases, the graphics may drive the prototyping, depending on the importance of visual form versus function. If the interface requires multiple skins, there may be multiple interface designs for one control panel, functional feature or widget. This phase is often a collaborative effort

between a graphic designer and a user interface designer, or handled by one who is proficient in both disciplines. User interface design requires a good understanding of user needs.

REQUIREMENTS:The dynamic
characteristics of a system are described in terms of dialogue requirements contained in seven principles of part 10 of the ergonomics standard, the ISO 9241. This standard establishes a framework of ergonomic "principles" for the dialogue techniques with high-level definitions and illustrative applications and examples of the principles. The principles of the dialogue represent the dynamic aspects of the interface and can be mostly regarded as the "feel" of the interface. The seven dialogue principles are: Suitability for the task: the dialogue is suitable for a task when it supports the user in the effective and efficient completion of the task. Self-descriptiveness: the dialogue is self-descriptive when each dialogue step is immediately comprehensible through feedback from the system or is explained to the user on request. Controllability: the dialogue is controllable when the user is able to initiate and control the direction and pace of the interaction until the point at which the goal has been met. Conformity with user expectations: the dialogue conforms with user expectations when it is consistent and corresponds to the user characteristics, such as task knowledge, education, experience, and to commonly accepted conventions. Error tolerance: the dialogue is error tolerant if despite evident errors in input, the intended result may be achieved with either no or minimal action by the user. Suitability for individualization: the dialogue is capable of individualization when the interface

software can be modified to suit the task needs, individual preferences, and skills of the user. Suitability for learning: the dialogue is suitable for learning when it supports and guides the user in learning to use the system. The concept of usability is defined in Part 11 of the ISO 9241 standard by effectiveness, efficiency, and satisfaction of the user. Part 11 gives the following definition of usability: Usability is measured by the extent to which the intended goals of use of the overall system are achieved (effectiveness). The resources that have to be expended to achieve the intended goals (efficiency). The extent to which the user finds the overall system acceptable (satisfaction). Effectiveness, efficiency, and satisfaction can be seen as quality factors of usability. To evaluate these factors, they need to be decomposed into sub-factors, and finally, into usability measures. The information presentation is described in Part 12 of the ISO 9241 standard for the organization of information (arrangement, alignment, grouping, labels, location), for the display of graphical objects, and for the coding of information (abbreviation, color, size, shape, visual cues) by seven attributes. The "attributes of presented information" represent the static aspects of the interface and can be generally regarded as the "look" of the interface. The attributes are detailed in the recommendations given in the standard. Each of the recommendations supports one or more of the seven attributes. The seven presentation attributes are: Clarity: the information content is conveyed quickly and accurately. Discriminability: the displayed information can be distinguished accurately.

Conciseness: users are not overloaded with extraneous information. Consistency: a unique design, conformity with users expectation. Detectability: the users attention is directed towards information required. Legibility: information is easy to read. Comprehensibility: the meaning is clearly understandable, unambiguous, interpretable, and recognizable. The user guidance in Part 13 of the ISO 9241 standard describes that the user guidance information should be readily distinguishable from other displayed information and should be specific for the current context of use. User guidance can be given by the following five means: Prompts indicating explicitly (specific prompts) or implicitly (generic prompts) that the system is available for input. Feedback informing about the users input timely, perceptible, and non-intrusive. Status information indicating the continuing state of the application, the systems hardware and software components, and the users activities. Error management including error prevention, error correction, user support for error management, and error messages. On-line help for system-initiated and user initiated requests with specific information for the current context of use.

RESEARCH PAST AND ON GOING:User interface


design has been a topic of considerable research, including on its aesthetics. In the past standards have been developed, as far back as the eighties for defining the usability of software products.[2] One of the structural basis has become the IFIP userinterface reference model. The model proposes

four dimensions to structure the user interface: The input/output dimension (the look) The dialogue dimension (the feel) The technical or functional dimension (the access to tools and services) The organizational dimension (the communication and co-operation support) This model has greatly influenced the development of the international standard ISO 9241 describing the interface design requirements for usability. The desire to understand application-specific UI issues early in software development, even as an application was being developed, led to research on GUI rapid prototyping tools that might offer convincing simulations of how an actual application might behave in production use.] Some of this research has shown that a wide variety of programming tasks for GUI-based software can, in fact, be specified through means other than writing program code. Research in recent years is strongly motivated by the increasing variety of devices that can, by virtue of Moore's Law, host very complex interfaces. There is also research on generating user interfaces automatically, to match a user's level of ability for different kinds of interaction. GUI:Graphical user interfaces, also known as GUIs, offer a consistent visual language to represent information stored in computers. This makes it easier for people with little computer skills to work with and use computer software. This article explains the most common elements of visual language interfaces found in the WIMP ("window, icon, menu, pointing device") paradigm. These elements are usually embodied in an interface using a widget toolkit. STRU TURAL ELEMENTS:User interfaces use visual conventions to

represent the generic information shown. Some conventions are used to build the structure of the static elements on which the user can interact, and define the appearance of the interface. WINDOW:A window is an area on the screen that displays information, with its contents being displayed independently from the rest of the screen. An example of a window is what appears on the screen when the "My Documents" icon is clicked in the Windows Operating System. It is easy for a user to manipulate a window: it can be shown and hidden by clicking on an icon or application, and it can be moved to any area by dragging it (that is, by clicking in a certain area of the window usually the title bar along the tops and keeping the pointing device's button pressed, then moving the pointing device). A window can be placed in front or behind another window, its size can be adjusted, and scrollbars can be used to navigate the sections within it. Multiple windows can also be open at one time, in which case each window can display a different application or file this is very useful when working in a multitasking environment. The system memory is the only limitation to the amount of windows that can be open at once. There are also many types of specialized windows.[1] A Container Window a window that is opened while invoking the icon of a mass storage device, or directory or folder and which is presenting an ordered list of other icons that could be again some other directories, or data files or maybe even executable programs. All modern container windows could present their content on screen either acting as browser windows or text windows. Their behaviour can automatically change according to the choices of the single users and their preferred approach to the graphical user interface. A browser window allows the user to move forward and backwards through a sequence of documents

or web pages. Web browsers are an example of these types of windows. Text terminal windows are designed for embedding interaction with text user interfaces within the overall graphical interface. MSDOSand UNIX consoles are examples of these types of windows. A child window opens automatically or as a result of a user activity in a parent window. Pop-up windows on the Internet can be child windows. A message window, or dialog box, is a type of child window. These are usually small and basic windows that are opened by a program to display information to the user and/or get information from the user. They usually have a button that must be pushed before the program can be resumed. MENUS:Menus allow the user to execute commands by selecting from a list of choices. Options are selected with a mouse or other pointing device within a GUI. A keyboard may also be used. Menus are convenient because they show what commands are available within the software. This limits the amount of documentation the user reads to understand the software.[2] A menu bar is displayed horizontally across the top of the screen and/or along the tops of some or all windows. A pull-down menu is commonly associated with this menu type. When a user clicks on a menu option the pull-down menu will appear.[3][4] A menu has a visible title within the menu bar. Its contents are only revealed when the user selects it with a pointer. The user is then able to select the items within the pull-down menu. When the user clicks elsewhere the content of the menu will disappear. A context menu is invisible until the user performs a specific mouse

action, like pressing the right mouse button. When the software-specific mouse action occurs the menu will appear under the cursor.[3] Menu extras are individual items within or at the side of a menu.

A list of items from which to select. The list normally only displays items when a special button or indicator is clicked.

List box
A GUI widget that allows the user to select one or more items from a list contained within a static, multiple line text box. Combo box A combination of a drop-down list or list box and a single-line textbox, allowing the user to either type a value directly into the control or choose from the list of existing options.

ICONS:An icon is a small picture that


represents objects such as a file, program, web page, or command. They are a quick way to execute commands, open documents, and run programs. Icons are also very useful when searching for an object in a browser list, because in many operating systems all documents using the same extension will have the same icon.

Check box
A box which indicates an "on" or "off" state via a check mark or a cross . Sometimes can appear in an intermediate state (shaded or with a dash) to indicate mixed status of multiple objects.

Controls (or Widgets)


Interface element that a computer user interacts with, and is also known as a control or Widget.

Window
A paper-like rectangle that represents a "window" into a document, form, or design area.

Radio button
A button, similar to a check-box, except that only one item in a group can be selected. Its name comes from the mechanical push-button group on a car radio receiver. Selecting a new item from the group's buttons also deselects the previously selected button.

Pointer (or mouse cursor)


The spot where the mouse "cursor" is currently referencing.

Text box
A box in which to enter text or numbers.

Cycle button
A button that cycles its content through two or more values, thus enabling selection of one from a group of items.

Button
An equivalent to a push-button as found on mechanical or electronic instruments. HYPERLINK Text with some kind of indicator (usually underlining and/or color) that indicates that clicking it will take one to another screen or page.

Datagrid
A spreadsheet-like grid that allows numbers or text to be entered in rows and columns.

Tabs
A tab is typically a rectangular small box which usually contains a text label or graphical icon associated with a view pane. When activated the view pane, or window, displays widgets associated with

Drop-down list

that tab; groups of tabs allow the user to switch quickly between different widgets. This is used in the web browsers Firefox, Internet Explorer, Konqueror, Opera, and Safari. With these browsers, you can have multiple web pages open at once in one window, and quickly navigate between them by clicking on the tabs associated with the pages. Tabs are usually placed in groups at the top of a window, but may also be grouped on the side or bottom of a window. Tabs are also present in the settings panes of many applications. Windows for example uses tabs in most of its control panel dialogues.

the pointer in the shape of a gloved hand with outstretched index finger. The use of a pointer is employed when the input method, or pointing device, is a device that can move fluidly across a screen and select or highlight objects on the screen. Pointer trails can be used to enhance its visibility during movement. In GUIs where the input method relies onhard keys, such as the five-way key on many mobile phones, there is no pointer employed, and instead the GUI relies on a clear focus state.

Selection
A selection is a list of items on which user operations will take place. The user typically adds items to the list manually, although the computer may create a selection automatically.

Interaction elements
Some common idioms for interaction have evolved in the visual language used in GUIs. Interaction elements are interface objects that represent the state of an ongoing operation or transformation, either as visual remainders of the user intent (such as the pointer), or asaffordances showing places where the user may interact.

Adjustment handle
A handle is an indicator of a starting point for a drag and drop operation. Usually the pointer shape changes when placed on the handle, showing an icon that represents the supported drag operation.

Cursor
A cursor is an indicator used to show the position on a computer monitor or other display device that will respond to input from a text input or pointing device.

PRINCIPLES OF USER INTERFACE DESIGN:The principles of user


interface design are intended to improve the quality of user interface design. According to Larry Constantine and Lucy Lockwood in their usage-centered design, these principles are:[1] 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.

Pointer
One of the most common components of a GUI on the personal computer is a pointer: a graphical image on a screen that indicates the location of a pointing device, and can be used to select and move objects or commands on the screen. A pointer commonly appears as an angled arrow, but it can vary within different programs or operating systems. Example of this can be found within text-processing applications, which uses an I-beam pointer that is shaped like a capital I, or in web browsers which often indicate that the pointer is over a hyperlink by turning

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. According to Jef Raskin in his book The Humane Interface, there are two laws of user interface design, based on the fictional laws of roboticscreated by Isaac Asimov.

however is that users may be unable to quickly and easily learn how to interact with it. If you do develop a totally innovative user interface design, do be sure to carry out usability testing before launching. This way you can check if users can grasp what they need to do and what you need to do to make the interface more intuitive.
Do of course make an effort to visit the site we've mentioned above, as interfaces are made to be interacted with!

CONCLUSION
Innovative user interface design is key to developing new and improved user interaction online. The problem with designing a totally unique user interface

S-ar putea să vă placă și