Recently I gained an interest in user interface design. I read some books and found them helpful. After years of fun in system interfaces, server programming and database design, now I know user interfaces design is also such an interesting area.
Following are my favorite passages with added short headers.No one can write decently who is distrustful of the reader's intelligence, or whose attitude is patronizing. (The Element of Style, page 84)
Write in a way that draws the readers attention to the sense and substance of the writing, rather than to the mood and temper of the author. If the writing is solid and good, the mood and temper of the writer will eventually be revealed and not at the expense of the work. (The Element of Style, page 70)
Before beginning to compose something, gauge the nature and extent of the enterprise and work from a suitable design. ... You raise a pup tent from one sort of vision, a cathedral from another. (The Element of Style, page 70)
Above all, do not be afraid to experiment with what you have written. Save both the original and the revised version; you can always use the computer to restore the manuscript to its original condition, should that course seem best. (The Element of Style, page 72)
No one would argue against this principle, but many designers assume that they understand the users and users' tasks. Successful designers are aware that other people learn, think, and solve problems in different ways. (Design the User Interface, page 67)
Scenario writing helps to bring common understanding of design goals and is useful for managerial and customer presentation. (Design the User Interface, page 118)
Design is a process ...
The process is radically transformational ...
Design intrinsically involves the discovery of new goals.
(Design the User Interface, page 99)
Several empirical studies have dealt with the depth-breath tradeoff, and the evidence is strong that breath should be preferred over depth. In fact, there is reason to encourage designers to limit menu tree to three levels: when the depth goes to four or five, there is a good chance of users becoming lost or disoriented. (Design the User Interface, page 118)
Once systems are released, developers perform continuous performance evaluations by interviews or surveys, and by logging user performance in a way that respects the privacy of users. If you are not measuring, you are not doing human factors! (Design the User Interface, page 150)
Logs of usage provide valuable data about the task sequences and frequencies. (page 118) Software logs should capture the frequency of use for each page, or at least for each component of a database. (Design the User Interface, page 579)
Extensive testing and iterative refinement are necessary parts of every development project. (Design the User Interface, page 89)
Many of our examples suggests that clarity and excellence in thinking is very much like clarity and excellence in the display of data. When principles of design replicate principles of thought, the act of arranging information becomes an act of insight. Visual Explanation, page 9)
Make all visual distinctions as subtle as possible but still clear and effective.
Relevant to nearly every display of data, the smallest effective difference is the Occam' razor ("What can be done with fewer is done in vain with more") of information design. And often the happy consequence of an economy of means is a graceful richness of information, for small differences allow more differences.
Minimal contrasts of the secondary elements (figure) relative to the negative space (ground) will tend to produce a visual hierarchy, with layers of inactive background, calm secondary structure, and notable content. And, conversely, when everything (background, structure, content) is emphasized, nothing is emphasized; the design will often be noisy, clustered, and informationally flat.
Based on universal ideas of figure-ground, large-motion-covers-small motion, hierarchical layering, and content-driven design, the strategy of the smallest effective difference applies to all display technologies ... (Visual Explanation, page 73, 74)
Right from the start, the opening panel shows the scope of information make available. Only a small part of the screen is devoted to computer administration ... Free of icons, decorative logotypes, and navigation apparatus, about 90% of the images is substance, a contextual overview describing the reservoir of data. In an architecture of content, the information becomes the interface. Rather than sequentially stacking up little bits of data to be unveiled gradually, this flat interface surfaces 45 options at once, distribute the information in space rather than time. (Visual Explanation, page 146)
Information-sensitive designs are exacting and laborious, requiring a deep appreciation of the particular content at hand. (Visual Explanation, page 148)
Direct measurement of content and non-content provides a quantative assessment of the interface; these measures of the informational performance of a screen include:
Applied thoughtfully, these measures may help to restrain the spatial imperialism of operating systems and of interface-metaphors -- and thereby enhance the richness of content displayed. (Visual Explanation, page 150)
Graphical display should ... induce the viewer to think about the substance rather than about methodology, graphic design, the technology of graphic production, or something else ... (Visual Explanation, page 13)
T. S. Eliot emphasized the "capital importance of criticism in the work of creation itself." Probably, indeed, the larger part of the labor of an author in composing his work is critical labor; the labor of sifting, combining, constructing, expunging, correcting, testing: this frightful toil is as much critical as creative. (Visual Explanation, page 100)
What is to be sought in designs for the display of information is the clear portrayal of complexity. Not the complication of the simple; rather the tasks of the designer is give visual access to the subtle and difficult -- that is. (Visual Explanation, page 191)
Instead, the site should be structured to mirror the users tasks and their views of the information space. (Designing Web Usability, page 15)
Unfortunately, we see many sites that spend more screen space on navigation than they do on information ... Navigation is a necessary evil that is not a goal in itself and should be minimized. (Designing Web Usability, page 18)
As a rule of thumb, content should account for at least half of a page's design, and preferably closer to 80 percent. Navigation should be kept below 20 percent of the space for destination page, although navigation options may account for much higher proportion of home pages and intermediate navigation pages. (page 22)
A navigation interface needs to show all the available alternatives at the same time so that users can make an informed decision as to which option will satisfy their needs best. Not only it's annoying to have to move the mouse around to see options, it is outright user-hostile to require users to keep the previously seen options in their short-term memory while they consider additional choices. (Designing Web Usability, page 196)
As with all layout, whitespace is not necessarily useless, and it would be a mistake to design overly compact page. If you have the choice between separating two segments of content by a heavy line or by some whitespace, it will often look better to use the whitespace solution, which will typically also download faster. (Designing Web Usability, page 18)
A general principle for all user interface design is to go through all you design elements and remove them one at a time. If the design work as well without a certain design element, kill it. Simplicity always wins over complexity, especially on the Web where every five bytes saved is a millisecond less download time. (Designing Web Usability, page 22)
Every web usability study I have conducted since 1994 has shown the same thing: Users beg us to speed up the page downloads. In the beginning my reaction was along the lines of "Let's just give them better design, and they will be happy to wait for it." I have since become a reformed sinner believing that fast response times are the most important design criterion for web pages; even my skull isn't thick enough to withstand consistent user pleas year after year.
Research on a wide variety of hypertext system has shown that users need response times of less than one second when moving from one page to another if they are to navigate freely through an informational space. Traditional human factors research into response time also shown the need for response time faster than one second.
If the same action always takes the same time, the user will learn what to expect. (Designing Web Usability, page 42)
Slow response times often translate directly into a reduced level of trust, and they always causes a loss of traffic as users take their business elsewhere.
Considering the fundamental facts in both human factors and computer networking, there is only one conclusion: Web pages must be design with speed in mind. In fact, speed must be the overriding criterion.
(Designing Web Usability, page 45-46)Complex table often take a long time to render, so to cut down on the complexity of your tables, split the information into several tables. In particular, the top table should be simple and fast to render. (Designing Web Usability, page 50)
Use a single style sheet for all the pages on your site ... One of the main benefits of style sheet is to ensure visual continuity as the user navigates your site.
Always use linked style sheet instead of embedded styles. Only by referencing an external file will you get the maintenance benefit of being able to update the look of your entire site with a single change. Also, by pulling style definition of your pages, you make them smaller and faster to download. If you use a single style sheet for your entire site, that file will be a single download once and for all. (Designing Web Usability, page 81)
[E]employees perform better when more specialized terminology is used; precise language helps them understand exactly what is being discussed. (Designing Web Usability, page 266)
For intranet design, efficiency, memorability, and error reduction become the most important usability attributes. Because employees may use the intranet every day, they will soon become experienced users, and the efficiency with which they can navigate the intranet and get their work done will determine their productivity. (Designing Web Usability, page 266)
Cutting-edge technology gets in the way of user goals. Research shows that users don't want it; they just want to get their information.
Use a simple layout with minimal distractions, offer interesting well-chunked and delineated content, and make navigation and performance transparent. (Speed Up Your Site, page 36,37)
Microsoft claims a 100-fold improvement using the fixed layout option of Internet Explorer 6+. The fixed algorithm allows the table to be rendered progressively to the screen, one row at a time. (Speed Up Your Site, page 75)
The browser's built in Back and Forward buttons and LOCATION BREAD CRUMB (K6) are both mechanisms that give customers easy exits on the web. (The Design of Sites, page 69)
Research shows that designers who work out conceptual ideas on paper tends to iterate more and explore the design space more broadly, whereas designers using computer-based tools tend to take only one idea and work it out in detail.
Nearly everyone of the designers we have talked to has observed that the discussion is qualitatively different when people are presented with a high fidelity prototype. Clients often respond with comments like, "I do not like your color scheme," or "These two buttons need to be aligned correctly." When presented with a low-fidelity prototype, however, clients are more likely to say something like "These labels on the navigation bar do not make sense to me," or "You're missing a link to the shopping cart here on the page. In other words, with low-fidelity prototypes, which lack irrelevant details like color, font, and alignment to distract the eye, people focus on the interaction and on the overall site structure. (The Design of Sites, page 77)
On the web, above the fold refers to what your customers can see on your Web page without having to scroll down. Visitors do not always realize that they can scroll down, or that there is more information below. Therefor it makes sense to put all the vital links and content at the top. (The Design of Sites, page 508)
Customer often need to complete highly specific tasks on web sites, but pages with tangential links and many questions can prevent them from carrying out these tasks successfully.
Look at the user's productivity, not the computer's. Bring to the user all the information and tools needed for each step of the process. Any time the user must wait for the system to respond before they can proceed, money is being lost. (Tog: First Principles of User Interface Design, page 36)
The goal of the graphical system designer is to facilitate the development of a useful mental model of the system by presenting a meaningful conceptual model of the interface. Mental models in using a system are derived from the system's behavior, including factors such as the system inputs, actions, outputs (including screens and messages), and its feedback and guidance characteristics. Documentation and training also play a formative role. (Essential Guide to User Interface Design, page 80)