Edge903 Project
•Download as PPS, PDF•
0 likes•480 views
This document provides an overview of guidelines for effective user interface design. It discusses considerations for layout and style, color, imagery, visible language, interaction design principles, layering and style, color design, and general usability testing. The document emphasizes user-centered design, consistency, providing feedback, and testing interfaces on different systems and browsers.
Report
Share
Recommended for you
Recommended for you
Recommended for you
More Related Content
What's hot
What's hot (20)
Similar to Edge903 Project
Similar to Edge903 Project (20)
Recently uploaded
Recently uploaded (20)
Edge903 Project
- 1. Welcome to Visual Design Effective User Interface Design Guideline By Xiaoying Zhang
- 2. Backgrounds Visible Language Heuristics and Principle User Interface Design Considerations Layer and Style Design Colour Design General Usability & Testing Conclusion Overview
- 3. Interface Design Software interface design is a subset of general information. User Centered interface Design Designer just focus on the user’s perspective. Overall goal of interface design Create a way for the users and the developers to communicate easily and efficiently. Background
- 4. Layout and Style: The balance of logical and aesthetic of formats, proportions and grid is critical to success of effective interface. Colour : It is also complex elements in reach successful visual communication. Moreover, logical combined colour creates visual sense. Texture : Since texture is the basic elements of communication tool, compact and sententious instructional texture also help user enjoy the visual communication. Imagery: It is related to symbols, icon and signs. Good imagery leads to easy understanding and decreasing the complex of interface. Visible Language (1)
- 5. Sequencing: Used to control the cadence and intension of the information delivery from one user to and another . Animation: Not easy to design but effectively attracting user’ interest. The HCI level is high, it requires the bandwidth usage. Sound: An easy way to get user’s attention by abstract, concrete, vocal or musical cues . Visible Language (2)
- 6. Creating interaction Providing the constant and appropriate feedback in their understand way. User need to know what is going on, and any options they can choose. The feedback should be inform user those information and in their own language. Match between system and the real world User like to use the vast store of knowledge they already posses such as windows, menus and buttons. Let the user be in control The system should not fixed the process path, give user freedom is necessary and polity. Howe ever, design also should leave some “back door” for user to go back where they started, when they accidentally kick the wrong links . Consistency and standards Provide direct and easy understanding options, rather than indirect, confusion items, so user will not lost in the “big picture”. Be consistent because the user’s world is consistent. Heuristics and Principle (1)
- 7. Testing all function twice before go alive One error could lead up to destroy the loyalty of the user. Users will not go back to the trouble website again. Preventing error generating is the designer’s responsibility. Tread user with respect The magical words still work online such as greetings. Users may feel more comfortable when they see “good afternoon”, “thanks for visit” and “please wait a moment” rather than a processing line fill from left to right. Always and unconditionally offer the user forgiveness for their actions. Provide short cut for advance user Time is money! Advance users want to gather information as soon as possible, so give them chance to avoid time waste is also important. In additional, do not create modes unnecessarily and when necessary, identify your modes unequivocally to your user. Recognition rather than recall Users don’t like to memory the objects, action and options. So designer should try to create interface where the user can see rather than remember. Heuristics and Principle (2)
- 8. Layer and Style Design The consistency of layer includes the placement of logos and graphics as well as alignment of data representation on the interface design. Colour Design Designer need consider the color combinations to acceptable by common users. User Interface Design Considerations
- 9. The simple interface design is one dimension such as newspapers. Layer and Style Design (1) Figure 1: Simple interface data representation
- 10. Layer and Style Design (2) Figure 2: Real interface with simple layer example
- 11. Multi-layer interface classifies the data into three layers. Layer and Style Design (3) Figure 3: Multi-layer interface data representation
- 12. Figure 4: Multi-layer interface data representation Layer and Style Design (4) Users can experience additional buttons, fronts, ruler and status bar compare with simple layer example.
- 13. Figure 5: Expending multi-layer interface data representation Layer and Style Design (5) Expending multi-layer gain more benefit of multi-layer design.
- 14. Important information with shapes Buttons change into pull-down menus Layer and Style Design (6) Figure 6: Real interface with expending Multi-layer example
- 15. Colour Selection The common tool is the Colour wheel when designer is making colour combination. The primary colours are red, yellow and blue The complementary colours are should not be use in interface design Colour Design Figure 7: Colour wheel, Primary Colour and Secondary Colour
- 16. Most importantly Test the interface design on different operational system such as Win 95, Win XP and Vista. Then, test it on different screen size such as 15inh, 17inh and 22 inh, etc. After that, test the print out on the different types of Printers as well. Connectivity & Modem speed If the interface design content a lot of photo and Flashs, designer needs to test the online downloading time requires. If it is necessary, designer needs to warning the users that it is takes long time to download. Data stamping When the interface design is related to some important information such as finance data, designer needs to put warning that it is not academic result. Alt Tags Designer needs to make sure all graphic element, logo and photo includes as “ALT ta”, Using alt = “…”. Hence, users are able to search the graphic element and logos. General Usability & Testing (1)
- 17. Link issues When user see “The page cannot be found” error message, they will start to panic and may not coming back to this website again. Designer needs to regularly check the links and redirect the problem link before the user find out. About Us It is good idea to adding information and back ground into the “About Us” such as company or group name, phone numbers and address. Language & reading level If the interface design will be used by different language users, designers try to create several language versions. And designers could provide reading level indicator such as PG, M and MA. General Usability & Testing (2)
- 18. Visible languages are very important technical for designing effective interface. Use of general principles and heuristics are a great first set towards achieving the effective interface design. Multi-layer simples and colour selections are used on the advance interface design situation. Designers also have to test the general usability of the interface on many matters. Conclusion