Graphical+Interface+Design

An **interface** is a means by which users interact with a computer. Interfaces in turn enable users to perform various operations with the computer.

[[image:Nautilus_Bundle_GUI.jpg width="330" height="330" align="left" caption="GUI Instance"]]Textual vs. Graphical
The [|graphical user interface], //GUI// (pronounced //GOO-ee//), is a computer interface that uses graphic icons, images, buttons, and other controls in addition to text. The user of the computer utilizes a pointing device like a mouse, touch screen type interface, voice commands to manipulate these icons and controls. This is considerably different from the command line interface in which the user types a series of text commands to the computer in order to manipulate the interface.

Desktop Graphical Interface
Desktop applications provide maximum flexibility when it comes to designing interfaces with rich graphics for example: //MSPaint, Picassa, Adobe Photoshop//. When the user requirement from an interface is similar to //MS Outlook// or //MS PowerPoint//, the desktop application provides maximum flexibility.

**Web Graphical Interface**
This uses the browser as the interface window so the interface design is constrained by the limitations of the browser. Browsers use HTML to generate the page that the user interacts with. HTML is primarily text based and does not provide a lot of flexibility in terms of designing an interface with rich graphics.This explains why websites such as NJIT's Moodle, Blogger and similar websites provide limited functionality from the user interface design perspective.

Elements of Graphical Interface Design
Layout is focused primarily on making everything onscreen balanced, aesthetically pleasing, and easy to read.How you place elements on multiple screens depends on your audience, message, the kinds of media you have and what content must beemphasized to best get the message across. Navigation is the process by which a user explorers the interactivity of an interfaces, moving through the content and interface screens.Navigation is important because content on an interface will be meaningless if there is no structure to the information presented to the user. Color plays an important role in the creation of GUI's because it evokes emotional responses, enhances stulistic unity, and can add or detract from the readability of the interface. Using color in a knowledgeable way can enhance the appearance and legitibility of a screen. Using color poorly can produce an emotional effect on the user that can range from mildly disturbing to the color equivalent of fingernails grating on a slate blackboard. When choosing a type to use for your interface, you have the option of including Editable text (font files loaded in the user's computer), Type converted to a portable document format (PDF) or Bitmapped image type. In order for a computer interface to display a font used in your design properly, the device must have the same font installed. It is fairly simple to include the font files used with your product to ensure that the user is able to see the message as you intended. Images should fit with other screen elements and convey information or the desired impression to the user. Graphics can be used as standalone images or as layered images. Images as interactive controls adds visual interest to the layout and is a good way to provide feedback to the user. They can enhance functionality if the image has interactive potential (highlighting or briefly animatiing when the user rolls over it). Time based media that can be integrated into a GUI, include animation, video, and sound. Animation is widely used and is often the best way to present concepts that are difficult to understand or capture in video. Video adds enhanced depth of information because images in motion can show information quickly, easily and concisely in a way that text or still images might not. Sound can help or hurt an interface. Choosing the right music, narrator or audio effects adds richness to the interactive experience.//(Graham, Lisa.// The Principles of Interactive Design. Toronto:Delmar Publishers, 1999.) A **style sheet language** is a [|computer language] used to describe the presentation of [|structured documents]. A structured document is a document whose sections are clearly defined and categorized. A program presenting the document can present it in different styles because the content has been categorized. One modern style sheet language with widespread use is [|CSS], which is used to style documents written in [|HTML] , [|SVG],[|XUL], and other [|markup languages]. One of the most attractive features of structured documents is that the content can be reused in many contexts and presented in various ways. Different style sheets can be attached to the logical structure to produce different presentations.In order for content in structured documents to be presented, a set of stylistic rules – describing for example, colors, fonts and layout – must be applied. A collection of stylistic rules is called a style sheet. Style sheets in the form of written documents have a long history of use by editors and typographers to ensure consistency of presentation, spelling and punctuation. In electronic publishing, style sheet languages are mostly used in the context of visual presentation rather than spelling and punctuation.
 * Layout**
 * Navigation**
 * Color**
 * Font**
 * Images**
 * Multimedia**
 * Stylesheet**

http://www.webopedia.com/TERM/G/Graphical_User_Interface_GUI.html http://en.wikipedia.org/wiki/Stylesheet_language