GUIdebook: Graphical User Interface galleryHome > Books > “Designing Visual Interfaces”
GUIsTimelinesScreenshotsIconsSoundsSplashesApplicationsAdsVideosArticlesBooksTutorialsExtras
Go backBooksDesigning Visual Interfaces

“Designing Visual Interfaces” front cover
This image can be zoomed
Kevin Mullet, Darrell Sano
Designing Visual Interfaces
Communication Oriented Techniques

Prentice Hall, 1994
304 pages
ISBN: 0-1330-3389-9

“Designing Visual Interfaces” is not your typical GUI book with a lot of specific guidelines. The authors divided it into several chapters (“Elegance and simplicity,” “Scale, contrast, and proportion,” “Organization and visual structure,” “Module and program,” “Image and representation” and “Style”) and within each of them they present design principles, then proceed to common GUI errors, ending with useful techniques. There’s a lot of screenshots (and, what is commendable, big chunk of those comes from less known operating systems), but also many design examples of real life designs. This makes this 9-year-old, tastefully packaged book still relevant and useful. A very good and highly recommended volume for everyone interested in graphic and interface design.
Buy at Amazon.com

Back cover blurb

The following paragraphs are quoted verbatim from the back cover:

This book describes fundamental techniques that can be used to enhance the visual quality of graphical user interfaces, data displays, and multimedia productions. The authors approach interface design from the perspective of communication-oriented graphic design, industrial design, and architecture. The skills, practice, and orientation of these design disciplines are essential to the success of every graphical interface, yet few software developers, human factors professionals, or product managers receive any training in these areas. Designing Visual Interfaces addresses this shortcoming by describing essential design concepts as manifested in the graphical user interface. The book presents basic design principles, common errors, and practical techniques in each of six major areas:
Elegance and Simplicity
Scale, Contrast, and Proportion
Organization and Visual Structure
Module and Program
Image and Representation
Style

Designing Visual Interfaces will be useful to anyone responsible for designing, specifying, implementing, documenting, or managing the appearance of computer-based information displays. Design concepts are supported by hundreds of illustrations, with an emphasis on visual examples drawn from dozens of existing software products. Readers will gain a new perspective on product development and an appreciation for the contribution that effective visual design offers their products and users.

Kevin Mullet is the Product Designer for Macromedia’s multimedia authoring tools and the technical lead for a cross-product, cross-platform interface design standard in the Macromedia User Interface. Mr. Mullet worked previously as a human interface engineer at Sun Microsystems, and has consulted extensively on software design issues.

Darrell Sano is a User Interface Design Consultant at Netscape Communications Corporation. He currently provides design consultant services to numerous businesses and organizations who will use Netscape technology to establish a web presence on the Internet. Prior to joining Netscape, Mr. Sano was a member of the Human Factors Engineering group at Sun Microsystems.

Contents

Foreword: Jakob Nielseni
Prefacev
Introduction1
The Mess We’re In2
What Visual Designers Do7
Art and Design8
Functional vs. Aesthetic Concerns9
Form, Function, and the Question of a Universal Aesthetic12
Design and Rationality14
Elegance and Simplicity17
Principles19
Unity20
Refinement23
Fitness26
Common Errors29
Clutter and Visual Noise29
Interference Between Competing Elements30
Using Explicit Structure as a Crutch31
Belaboring the Obvious32
Overly Literal Translation33
Excessive Detail and Embellishment34
Gratuitous Dimensionality35
All of the Above36
Techniques37
Reducing a Design to Its Essence38
Regularizing the Elements of a Design42
Combining Elements for Maximum Leverage46
Scale, Contrast, and Proportion51
Background: Visual Variables54
Principles57
Clarity58
Harmony61
Activity64
Restraint66
Common Errors69
Insufficient Contrast69
Excessive Contrast70
Visual Interference71
Spatial Tension72
Overextension73
Awkward Dimensions74
Techniques75
The Squint Test75
Establishing Perceptual Layers76
Sharpening Visual Distinctions80
Integrating Figure and Ground84
Organization and Visual Structure89
Background: Perceptual Organization91
Principles93
Grouping94
Hierarchy97
Relationship99
Balance102
Common Errors705
Haphazard Layout105
Conflicting Symmetries106
Ambiguous Internal Relationships107
Aligning Labels but not Controls108
Alignment Within but not Across Controls109
False Structure110
Excessive Display Density111
All of the Above112
Techniques113
Using Symmetry to Ensure Balance114
Using Alignment to Establish Visual Relationships118
Optical Adjustment for Human Vision122
Shaping the Display with Negative Space126
Module and Program131
Background: Grid-Based Design133
Principles137
Focus138
Flexibility141
Consistent Application144
Common Errors147
Arbitrary Component Positions147
Arbitrary Component Dimensions148
Random Window Sizes and Layouts149
Unrelated Icon Sizes and Imagery150
Inconsistent Control Presentations151
Inconsistent Visual Language152
Techniques153
Reinforcing Structure through Repetition154
Establishing Modular Units158
Creating Grid-Based Layout Programs162
Image and Representation169
Background: Semiotics171
Principles175
Immediacy176
Generality179
Cohesiveness182
Characterization185
Communicability188
Common Errors191
Misleading Syntax191
Poorly Integrated Structure192
Dominant Secondary Elements193
Using Type as Image194
Using Images for Abstract Concepts195
Images Based on Obscure Allusions196
Culture or Language Dependencies197
Offensive or Suggestive Imagery198
Techniques199
Selecting the Right Vehicle200
Refinement through Progressive Abstraction204
Coordination to Ensure Visual Consistency208
So What About Style?213
Principles215
Distinctiveness216
Integrity218
Comprehensiveness221
Appropriateness224
Common Errors227
Unwarranted Innovation227
Combining Unrelated Elements228
Partial Fulfillment229
Internal and External Inconsistency230
Incompatible Concepts232
Techniques233
Mastering the Style234
Working Across Styles238
Extending and Evolving the Style242
Conclusion247
Further Information249
About the Authors 253
Bibliography255
Index269

Page added on 14th September 2004.

Copyright © 2002-2006 Marcin Wichary, unless stated otherwise.