UI SOFTWARE ARCHITECTURE docx

UI SOFTWARE ARCHITECTURE Topics  Visual structure  Model-view-controller  View hierarchy  Observer  Android design pattern 2 Visual structure  Clarity  Consistency  Hierarchy  Balance  Grids  Contrast  Textures  Evaluating 3 Clarity  Directs the eye  Provides balance through its use  Strengthens impact of message  Allows eye to rest between elements of activity  Increases legibility, clarifies hierarchy  Used to promote simplicity and “elegance” 4 Clarity  Economy of Visual Elements  Minimize borders, heavy outlining, section boundaries  Use white space instead  Reduce clutter  Minimize the number of controls 5 Clarity via White Space  White space 6 Principle: Consistency  Be c ons is tent in e ve ry as pe c t:  In layout, color, images, icons, typography, text  Within screen, across screens  Stay within metaphor everywhere  Platform may have a style guide – follow it! 7 Inconsistency  Result when local and global designs aren’t balanced  Color Palette conflict  Conflict between local and global design 8 Principle: Hierarchy  What are the relative “levels” of importance?  What should the user see first? Second? 9 Hierarchy  What are the relative “levels” of importance? 10 [...]... Minimize number of controls, reduce clutter Grid Example 19 Principles: Contrast 20 Pulls you in  Guides your eyes around the interface  Supports skimming  Take advantage of contrast to guide user through hierarchy of information; add focus; or to energize an interface with “texture”  Can be used to distinguish active control  Contrast 21  Can be used to set off most important item  Allow it to dominate . UI SOFTWARE ARCHITECTURE Topics  Visual structure  Model-view-controller  View hierarchy  Observer  Android. Example 19 Principles: Contrast  Pulls you in  Guides your eyes around the interface  Supports skimming  Take advantage of contrast to guide user through hierarchy of information; add focus;. text  Within screen, across screens  Stay within metaphor everywhere  Platform may have a style guide – follow it! 7 Inconsistency  Result when local and global designs aren’t balanced  Color