Survey
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
http://www.pint.com/classes/web3 Web Publishing 3 Site Design & Usability UCSD Extension Presented by Thomas A. Powell PINT Inc. Slides Adopted from Web Design: The Complete Reference Web Publishing 3 http://www.pint.com/classes/web3 Chapter 1: What is Web Design? Web Publishing 3 http://www.pint.com/classes/web3 What is Web Design? • • The idea of Web design means many different things to different people. Web design depending on the person includes many things such as: – – – – – – • Visual design Programming HTML Navigation issues Usability Business issues (e-commerce) Depending on the project Web design actually may draw from any of these areas so it truly can be a very multidisciplinary field. 1 Web Publishing 3 http://www.pint.com/classes/web3 What is Web Design? • Four primary aspects to Web Design – Content • To inform or persuade users – Technology • To implement the function of the site – Visuals • To provide the form of the site – Economics • To give purpose for the site • The influence of one aspect or another of site design varies on the project. – Personal home page may not have economic issues – Shopping site may be less concerned about the visuals Web Publishing 3 http://www.pint.com/classes/web3 The Web Design Pyramid • Metaphor of a Web site like a pyramid – Content is the bricks we use to build the pyramid – The foundation rests on visuals and technology – Economics make the project worth doing • As Web designers we try to build our “pyramids” carefully but construction is difficult because we build on the shifting sands of fast changing technology and tastes. • Even when building a great sites our visitors may look at it with puzzlement. – Team work and a firm understanding of the Web medium is required – What’s the purpose they wonder. Where is the door?! Web Publishing 3 http://www.pint.com/classes/web3 The Web Design Pyramid 2 Web Publishing 3 http://www.pint.com/classes/web3 Building Web Sites • • Don’t underestimate the Web. Building sites can be difficult Some of the core technologies like HTML are pretty easy to master, yet developers make numerous mistakes. Why? – Lack of developer experience particularly with the Web medium coupled with a lack of well-defined process and highly accelerated schedules. • Because of time constraints or inexperience many designers tend to start from one extreme or another – Start out building the site from the visuals and figure out what to do later. • Design document is a picture • Results in sites filled with giant images or sites that are built entirely in Flash • You might term this sites “brochureware” or “introware” • Note: For an artist portfolio site this may be the best approach but for many sites it is not. Web Publishing 3 http://www.pint.com/classes/web3 Visuals First Design • Looks good but may not work right or be flexible enough. Other examples: www.megacar.com, www.nrg.be Web Publishing 3 http://www.pint.com/classes/web3 Technology First • • • • • Some designers instead focus on doing only the technology first Sometimes the HTML, JavaScript, frames, Java applet, etc. is added first an then there is an attempt to decorate the site. I call this approach “Christmas Tree” design. A few colored balls, clip art and animated GIFs in a fruitless attempt to make the site look good. Like a visuals first site a technology first site is used more to show off what a designer can do but in the technical arena. Technology-first sites tend to practice exclusionary design and use the latest browser innovations. 3 Web Publishing 3 http://www.pint.com/classes/web3 Technology First • This example is still clean looking but notice the requirements, pulldowns,windows, etc. Web Publishing 3 http://www.pint.com/classes/web3 Web Development Process Model • • Both technology and visuals are required in Web design and must relate directly to the purpose of the site. Should use a top-down or deductive approach to site design. – – – – – – • Set a purpose From purpose build a specification Design to meet the specification Implement the design Test the design Release the finished product This process is similar to software engineering’s waterfall or lifecycle model. This process splits development into a variety of steps to help guide you from general requirements to finished site. Web Publishing 3 http://www.pint.com/classes/web3 Web Development Process Model 4 Web Publishing 3 http://www.pint.com/classes/web3 Web Development Process Model • • • • • The number of steps or name of steps in the model doesn’t matter. Other process models are possible like modified waterfall, spiral, jointapplication design (JAD) and so on. Always remember the purpose of the process model is always to guide. The ideal process model helps us do things fast and accurately and hopefully is easy to learn. We’ll take a look at the process of building Web sites later. First let’s discuss some common mistakes and common themes of Web design. Web Publishing 3 http://www.pint.com/classes/web3 Building for Users • One of the most common mistakes is building a site more to meet the wants and desires of the site’s designer than its users. • Web Design Rule: YOU are NOT the USER. • • • • • You generally know more about the site than the user. You know where things are. You know about installing plug-ins You may have an optimal setup with screen, browser, bandwidth, etc. You must accept that users may not even have the same interests as you. What makes sense to you may not make sense to users. • Web Publishing 3 http://www.pint.com/classes/web3 Building for Users • Don’t go overboard and then say “I’ll just ask the user” • Web Design Rule: USERS are NOT DESIGNERS. • • • Users may not know what is realistic. Users may not be logical or realistic about their needs and wants. In short users don’t have the sophisticated understanding of the Web medium the designer has. Just because someone has browsed a lot of Web sites doesn’t mean they can design one. You may have seen many movies, but do you really know how to approach filming one? Goal: Always try to think from the point of view of the user and then verify your ideas with real users. • • 5 Web Publishing 3 http://www.pint.com/classes/web3 Building for Users • • • • • User centered design is the term given to design which always puts the user first. What can we say about users? Is there a “Joe Average” Internet user? There is no typical average user, but there are traits such as reaction time, memory, and other cognitive or physical abilities we should consider when designing sites. However, always remember that beyond basic traits remember that people are individuals. Generally sites built to the “common user” may cause problems for the novice user or power user which leads to the following rule. Web Design Rule: Design for the common user, but account for differences. Web Publishing 3 http://www.pint.com/classes/web3 Utility and Usability • • • • • • Great Web sites are those that are truly useful to users. Usefulness is a combination of utility and usability. Utility describes a site’s functionality (what is capable of) Usability describes the user’s ability to manipulate the site’s features to accomplish the goal. Two banking sites may provide similar utility but one may be so confusing that it is unusable. Usable sites will be efficient, easy to learn and help users accomplish their goals in a satisfactory and error free manner. Web Publishing 3 http://www.pint.com/classes/web3 Paper to Software Paradigm Shift • In the past sites were often thought of as digital paper. Many print design concepts were applied. With increased functionality and the rise of ecommerce focus is shifting to a software centric approach to sites. Yet not all sites are the same, there is a range. 6 Web Publishing 3 http://www.pint.com/classes/web3 Dynamic Site Example (www.democompany.com) Web Publishing 3 http://www.pint.com/classes/web3 Software implications • • • Like software a Web site should only be considered excellent if it is useful, usable, correct, and pleasing. Some of these ideas are somewhat subjective except in the case of correctness. Correctness says the site’s execution must be excellent. – – – – Can’t break in ANY way HTML correct Images render as designed Interactive elements like JavaScript, CGI, etc. must function properly and not result in error messages. – The navigation of the site must work. Broken links with the 404 error should be considered serious errors. – Seems obvious but many sites are well executed. • Web Design Rule: A site’s execution must be close to flawless. Web Publishing 3 http://www.pint.com/classes/web3 The Execution Problem • Why such poor execution? – Technology shifts • How many versions of HTML, JavaScript, CSS, Flash, etc. have been released recently. – – – – Lack of developer experience Aggressive time lines Lack of methodology No consideration for medium restrictions • Technology • Network • Web designer who ignores technical and medium effects is like the printer who will not admit that ink bleeds on paper. • Web Design Rule: Know and respect the Web and Internet medium constraints. • Constraints range from browser and bandwidth to programming and protocols. 7 Web Publishing 3 http://www.pint.com/classes/web3 Web’s GUI Heritage • Many sites provide more than content, but allow users to interact or manipulate content just like regular software. • Web sites are not identical to traditional software – E-commerce, online banking, software download, gaming, chat, etc. – – – – – – – Built using similar technologies Distributed differently Must be quickly learnable (sorry no documentation to save a poor design) Lack an install/uninstall barrier Very content focused Integrate marketing more directly May have complex time or distribution considerations • Think of superbowl.com • While sites are different they do rely on basic GUI (Graphical User Interface) components: windows, icons, menus, and pointer. Some call this the WIMP interface. Web Publishing 3 http://www.pint.com/classes/web3 Web’s GUI Heritage • Web is modified GUI – No double clicking – Dragging? • However, shouldn’t we build on what people know and expect from normal software? – Menu position – Stability – Common icons • Web Design Rule: Web sites should respect GUI principles where appropriate. • Traditionally Mac and Windows have guidelines to follow to be considered to be standard. Q: Does the Web have such a controlling body? A: No, not even the W3 really can spec interface rules. Web Publishing 3 http://www.pint.com/classes/web3 Web’s GUI Heritage • • Conventions based upon tradition, social forces, technology, common sense, and even random chance have created somewhat of a Web standard. Color – Blue = click – Change your link colors and you confuse people for sure. – Logo in upper left = back to home 8 Web Publishing 3 http://www.pint.com/classes/web3 Navigation • • • • Unlike most GUI apps (except CD-ROM references) Web sites require a user to navigate through large amounts of content. Clear navigation is key to a good Web site. Who cares if a site has great content or good functionality if a user can’t find things. Navigation however is not as important as many people think. Web sites are not places! Users should not notice navigation. The focus should not be on moving or doing, but on the content or task. • Web Design Rule: Navigation is only a means to an end result. • Users will not marvel over your ingenious navigation particularly if it breaks with convention. Brand in your buttons and you may find you confuse people. Web Publishing 3 http://www.pint.com/classes/web3 Navigation • • • • • • To improve navigation designers like to bring structure to a site. Choosing a good site structure will make it easier for users to fin their way. Aids such as site maps, search engines, site index, and help systems will help users find things. Location really only matters to a user when they can’t find what they are looking for. Users do not form flowcharts in their minds as they navigate sites. Users are information foragers, as long as the sent to the goal is strong, they don’t feel lost, and they feel they are making progress towards a successful end result the user will be happy. Web Publishing 3 http://www.pint.com/classes/web3 Looks Matter • • • • Navigation is subtle. Great sites are more about function, navigation, and content (think Yahoo, Amazon, etc.) but there must be at least neutral if not excellent visuals to have a good site. Looks matter. However do Web designers necessarily set look? First impression counts with many Web sites. – Home page is heavy bailout – Home page orients – Users may not wait – Users may not be encouraged to explore Users are known to equate trust to positive visuals when not relying on outside information. 9 Web Publishing 3 http://www.pint.com/classes/web3 Looks Matter • • Web Design Rule: Visuals heavily influence the user’s initial perception of a site’s value. However, first impression will not make up for other problems. Web Publishing 3 http://www.pint.com/classes/web3 The Take Away Value • • • When a user exits a site they have a take away value—how successful was the visit. Did they like it, hate it, or was it just so-so? What causes the feeling? – Slow pages, nice graphics, no content, broken technology, easy function, etc. Web Design Rule: A site’s take away value is influenced by visuals, content, technology, usability and goal accomplishment. Web Publishing 3 http://www.pint.com/classes/web3 Form and Function Balance • • A key problem with Web design is that sites often do not balance form and function. Form should follow function. Site’s look should relate and even help the function. Of course for form to follow function the function or purpose of the site has to be clearly defined. Consider the look and feel of sites like Yahoo!, Amazon, Excite, etc. • Some believe a site should be distinct so people remember it. • • • – Is function limiting design choices? – The different door knob doesn’t encourage revisits to your store though it may make memorable. • Make distinct with content, function and experience not navigation. • Web Design Rule: Do not invent interfaces to build brand. 10 Web Publishing 3 http://www.pint.com/classes/web3 What is good Web design? • • • • What is good will vary from project to project depending on the site’s purpose. A video game wouldn’t have the same design considerations as Microsoft Word. Killer, cool, sizzling, etc. sites should necessarily be what you pattern yourself after. Consider the splash page – For some sites this page should be called the “send away page” – For other sites not having a splash page is like removing the title or opening credits of a movie Web Publishing 3 http://www.pint.com/classes/web3 What is good Web design? • Web Design Rule: There is no form of “correct” Web Design that fits every site or situation. Web Publishing 3 http://www.pint.com/classes/web3 What is good Web design? • • • Consider even page size considerations. Some say 50K is a good size particularly since slow pages are a big problem. With high bandwidth would 50K pages make sense? • With wireless access the game changes again – Cable modem sites may have to be designed differently than normal sites – No bandwidth – Small screen – Different browsing environment • Outside the office • Noisy – Imagine paging through a normal Web site on some LCD cellphone screen while driving a car. • The rules are good, but understand their motivation and know when to break them. 11 Web Publishing 3 http://www.pint.com/classes/web3 Web Site Evaluation • • Avoid knee jerk sucks or cool style reviews What’s bad is pretty obvious – – – – – • • Under construction Slow pages Overly animated pages Confusing navigation Hard to read pages Avoid pointing out what is bad so much, strive to see the good points and copy them. When running an evaluation make sure to reverse the development process. “Walk up and down the waterfall” – Who is it for? What is it supposed to do? How was it done? Demo: Sample Site Evaluations Web Publishing 3 http://www.pint.com/classes/web3 In Search of Web Design • • • • So what is Web design? User centered, multi-disciplinary design pursuit that includes influences from visual arts, technology, content and purpose. The Web borrows from old (print, software, etc.) and invents new ideas (portals, content focus, single click). Old design philosophy is WYSIWYG (what you see is what you get) – Based on a screen/printer disparity • • Today the ultimate goal may not be to create paper but to accomplish task or find info Users don’t want to “get” some standard thing they want to control things or at least think they are. – Think about personalization and sites like myYahoo • Web Design Rule: Control should be given or at least appear to be given to the user. Web Publishing 3 http://www.pint.com/classes/web3 Chapter 2: The Web Design Process 12 Web Publishing 3 http://www.pint.com/classes/web3 The Web Design Process? • • • Software Crisis is similar to Web crisis – Just look around it is easy to see flaws – It is even easier to break Web sites Many sites follow a simple ad hoc process at best – HTML poorly executed – Navigation seems poorly planned – JavaScript doesn’t follow simple programming practices – Broken Links – In short little planning and poor quality assurance Beyond ad hoc process the simplest way to improve things is to adopt a process model that guides a project. The most well known are topdown models Web Publishing 3 http://www.pint.com/classes/web3 The Web Design Process—Standard Waterfall Web Publishing 3 http://www.pint.com/classes/web3 The Web Design Process—Standard Waterfall Issues • • • The waterfall model is easy to understand but it doesn’t address all the issues facing Web designers – Discrete steps aren’t always easy to define – Doesn’t deal with change well • Web sites are always changing – Slower than many other process models • Web sites seem to be on a deliver it yesterday timeline – Lots of risk involved when the first stages are rushed However, despite its problems the Waterfall model is easy to implement and should be a first step for many designers. It is particular good for initial site development. Modification of the waterfall can be made to deal with risk and change factors 13 Web Publishing 3 http://www.pint.com/classes/web3 The Web Design Process--Modified Waterfall Web Publishing 3 http://www.pint.com/classes/web3 The Web Design Process--Modified Waterfall Issues • • • • • Even the modified Waterfall approach doesn’t deal with all problems Invariably clients or other decision makers change their minds. Some clients are unable to articulate what they are looking for Sometimes we just don’t really know what will work so taking a shot or building a prototype works well. – Many sites use this spaghetti approach — see what sticks Joint Application Design (JAD) seems to deal with these issues but has serious drawbacks – End up building the wrong site many times to make the right one – People often “marry” the prototype – Problems with prototypes can be damaging (The ‘release too soon’ syndrome) – Cost control can be hard; it’s difficult to budget for these projects Web Publishing 3 http://www.pint.com/classes/web3 The Web Design Process (JAD) 14 Web Publishing 3 http://www.pint.com/classes/web3 The Web Design Process • • • We are going to adopt a simple modified Waterfall approach to design for our discussion A great deal of time will be spent on the goals and early planning to avoid building sites that don’t make sense Time will be spent considering the user needs carefully. Web Publishing 3 http://www.pint.com/classes/web3 The Web Design Process Step 1 • • • • First talk about goals and problems – No goal – Vague goal Goal should be measurable otherwise you are at risk – “Build a customer support site that will improve customer satisfaction by providing 7/24 access to common questions and result in a 25% decrease in telephone support. – Create an online car parts store that will see at least $10K/month of product directly to the consumer. – Develop a Japanese food restaurant site that tells potential customers about menu, hours, and prices. Is the last goal a good one? Why or why not? A goal at the start of the project should be to come up with a short a long form of a site’s goals. (Mission Statement + Project Description) Web Publishing 3 http://www.pint.com/classes/web3 The Web Design Process • Brainstorming process Techniques – Get read to use the whiteboard – Start with what people don’t like particularly on a redo project if it is difficult to determine what to do. – Create a wish list. • Let the wish list get a big as it needs too • Don’t throw out any idea at this stage – Narrow the wish list and try to get people to compromise – “Everybody wants to be on the homepage” • 3x5” card technique helps 15 Web Publishing 3 http://www.pint.com/classes/web3 The Web Design Process • Audience discussion – Profile your audience • Who are they • What do they want to do – Talk to users • Surveys and interviews • Be careful not to direct the results Web Publishing 3 http://www.pint.com/classes/web3 The Web Design Process • • Given goals and audience you should be able to begin to figure out what is necessary to accomplish the goal. These are the requirements. Requirements include staffing, content, technology, graphics, etc. In short everything you need to do the job. You don’t have to put it together quite yet. Web Publishing 3 http://www.pint.com/classes/web3 The Web Design Process • Build a site plan – Short goal statement – Detailed goal statement – Audience Discussion – User Scenario Discussion – Content Requirements • Make a matrix of what is needed – Technical Requirements • What type of tech is needed (JavaScript, Flash, etc.) – Visual Requirements • Are there design parameters like color, font, logo, other media that needs to be considered when building the site. 16 Web Publishing 3 http://www.pint.com/classes/web3 The Web Design Process – Delivery Requirements – Site Structure diagram (flowchart) Web Publishing 3 http://www.pint.com/classes/web3 The Web Design Process • • – Staffing – Timeline – Budget With the design document in hand and approved it may be time to actually start the design. Web Design Suggestion: Always collect the content before design if at all possible. – Slowest aspect of projects. – Content should influence the design (form follows content) Web Publishing 3 http://www.pint.com/classes/web3 The Web Design Process • Try a conceptual block diagram to workout positions 17 Web Publishing 3 http://www.pint.com/classes/web3 The Web Design Process • Design sketches should within a browser window since it serves as a frame. Also start from the home page and then work down. Web Publishing 3 http://www.pint.com/classes/web3 The Web Design Process • Sketch out not just look but storyboard an action such as form fill-out. Web Publishing 3 http://www.pint.com/classes/web3 Design Process • • • • • Don’t marry your design prototypes. Listen to your users and refine things. Build a mock site with no content Retest the mock site with users Implement your site with real content and final technology. Test your site well. • Web Design Rule: Sites always have bugs. • Web Design Rule: Testing should address all aspects of the site including content, function, visuals, and purpose. 18 Web Publishing 3 http://www.pint.com/classes/web3 Design Process • • • User test is the most important form of testing and should be performed one final time before release. Once your site is released you aren’t done. Site development is an ongoing process. Plan, design, develop, release, repeat. It isn’t as easy at it seems. – The “real world” has lots of challenges. – Outside experts, “silver bullet tools”, bad timelines and budgets, people problems, etc. Web Publishing 3 http://www.pint.com/classes/web3 Chapter 3 Designing for Users Web Publishing 3 http://www.pint.com/classes/web3 User Centered Design • • Web sites are often developed from one particular philosophical reference point. – Content centered – Technology centered – Visually centered The real emphasis when building sites should always be the user. Keeping the user always in mind is the key idea behind user centered design. 19 Web Publishing 3 http://www.pint.com/classes/web3 Usability • Definition: Usability is the extent to which a site can be used by a specified group of users to achieve specified goals with effectiveness, efficiency, and satisfaction in a specified context of use. • From Nielsen 5 ideas that determine the usability of a site – Learnability – Rememberability – Efficiency of use – Reliability in use – User satisfaction The fifth item may be the big one if you think carefully about the problem. • Web Publishing 3 http://www.pint.com/classes/web3 Usability • Rule: There is no absolute idea of what constitutes a usable site. Usability will vary as much as the users accessing the site. • Rule: Usability depends on the medium of consumption. Remember the onscreen, on paper, by audio, etc. problem. • Rule: Usability depends on the type of site as well as the user’s familiarity with it. Web Publishing 3 http://www.pint.com/classes/web3 Usability Rule: Usability and user satisfaction are directly related. It seems obvious but user’s tend to think that sites they are happy with are usable even when they might not be to someone who thinks the site isn’t interesting. Conversely when a site is easy to use it tends to help users feeling about the site. 20 Web Publishing 3 http://www.pint.com/classes/web3 Who are Web users? Rule: Browsers do not use sites, people do. • • There is no generic person – Be cautious of “Joe AOL” with the 14.4 modem idea. Even Yahoo! Shouldn’t design for such an ambiguous individual. Suggestion: There are no generic people. Always try to envision a real person visiting your site. Web Publishing 3 http://www.pint.com/classes/web3 Common User Characterisitcs • • While there may not be a totally typical person people do have similar capabilities. Consider the prime way that a user interacts with a Web site (keyboard, mouse, monitor). – Sight – Reaction time – Memory – Other possibilities may include hearing Be careful of assuming that even with similar capabilities that there is not a range. – Example: Vision varies from completely blind to excellent vision Web Publishing 3 http://www.pint.com/classes/web3 Vision • • • • The main concern is can the user properly read the display Contrast – Dark on dark – Light on light – In short avoid any combinations of similar hue or lightness. Yellow and black provide greatest contrast, but of course white and black is close. Notice the increased use of white as background for content Notice that few huge sites really use complex background tiles. 21 Web Publishing 3 http://www.pint.com/classes/web3 Vision • • • Size – Too small – Too big – Be careful sizing text is not consistent across systems (Mac 12pt != PC 12pt) Layout – Too close together – User has difficult time telling the difference between items Always remember to make things noticeably different. Slight differences will not pass our thresholds. Web Publishing 3 http://www.pint.com/classes/web3 Vision • • • • Color – Can the user even perceive it? – Do they perceive it properly • Taste issue as well as usability think about link color in particular – Even it everything is the same two people may not see the same color the same way. Monitors don’t make life easy because color and brightness varies from monitor to monitor. Worse yet the end user can adjust things for better or worse. Should consider that Macs and Windows do not share the same Gamma value (basically brightness) so should aim either for Windows or something between the two. – When we talk about color in depth we’ll take a look at this. Web Publishing 3 http://www.pint.com/classes/web3 Memory • Rule: Users try to maximize gain and minimize work. (The lazy person rule) Memory requires work! • Rule: Recognition is easier than recall, so don’t force users to memorize information. • This is pervasive in Web design. Even consider link color. – If you make visited links the same color or style as unvisited ones you are making the user memorize where they have been. Visual memory tends to be better than other forms of memory. – Consider how to make the home page visually different than others. • 22 Web Publishing 3 http://www.pint.com/classes/web3 Memory • Short term memory wise, users are able to remember around 7+/2 items. This is important to consider for button clusters. – Do not go crazy with this idea and limit your site to only this many buttons per page as this will result in excessive clicking. Users are not interested in more than 3 clicks to reach content in most cases. Web Publishing 3 http://www.pint.com/classes/web3 Reaction Time • • 0.1 second – This is the limit for having the user feel that the system is reacting instantaneously, don’t have to keep them informed in even the slightest way 1.0 second – This is about the limit for the user's flow of thought to stay uninterrupted, even though the user will notice the delay. Normally, no special feedback is necessary during delays of more than 0.1 but less than 1.0 second, but the user does lose the feeling of operating directly on the data. Web Publishing 3 http://www.pint.com/classes/web3 Reaction Time • • • • How long will people wait for sites? – 10 seconds, 100 seconds, etc. Is it consistent? Users tend to be more patient with something they are unfamiliar with or that is a novelty Rule: The amount of time a user will wait is proportional to the expected payoff. 23 Web Publishing 3 http://www.pint.com/classes/web3 Reaction Time • • • • 10 seconds – This is limit for keeping the user's attention focused on the dialogue. > 10 seconds – Users will want to perform other tasks while waiting for the computer to finish, so they should be given feedback indicating when the computer expects to be done. Think about status bars on installers Be careful on the Web, people may be patient more because it is new to them, over time this may not be the case. Consider that these are worst case times between responses or tasks. What does the user think a task is? A page load or an item being downloaded. Web Publishing 3 http://www.pint.com/classes/web3 Movement Capabilities • • Consider mouse and keyboard travel always in sites. – Try to optimize keyboard access for all pages in a site. – Minimize mouse travel distance between successive choices – Minimize the distance between the primary hover zone and the back button. Consider Fitt’s Law and make clickable regions large enough and close enough to be clicked accurately. Web Publishing 3 http://www.pint.com/classes/web3 Sensory Issues • • Be aware that users react to sensory stimulus in fairly similar ways – Thresholds • People’s ability to notice things that are just barely different. – Cocktail party effect • The ability to focus on a single conversation within a large room of people might relate to a person’s ability to focus on a single content item out of a page with many distracting elements. – Sensory adaptation • Users will start to ignore things which initially grab their attention. • Consider continuous animation of banners or other attention grabbers. The idea of banner blindness probably results partially from these ideas 24 Web Publishing 3 http://www.pint.com/classes/web3 General User Types • In general there are three types of users – Novices • May not understand Web conventions • Will not understand site organization • May want extra help like a tour, help system, or step-by-step wizard style interfaces – Infrequent intermediates • Know basic Web conventions well so they will know how to use various site features but may not know where things are – Power users • Like to use simple URLs, pull downs, search or site map for direct access • Want to customize things to suite their own tastes – Bandwidth, images, content shown, etc. • May know navigation very well Web Publishing 3 http://www.pint.com/classes/web3 User Types • • • Intermediate users are the most common for public Web sites. – These users will spend most of their time elsewhere but will understand basic Web conventions so you better not break them. – Other users may be very important depending on your audience mix. Aim to build an adaptive Web sites that meets the requires of novices, intermediates and advanced user, otherwise aim for intermediate. Users are real people so beyond these basic ideas they may be very different. Web Publishing 3 http://www.pint.com/classes/web3 User Types • Real people will have real experiences the will bring to the table – The 99% other Web site rule – GUI conventions and other learned experiences • Real people are not perfect and may have problems that you consider out of the ordinary – Accessibility is the idea of trying to make a site workable for those with less than perfect vision, language skills, motor skills, and even connections! 25 Web Publishing 3 http://www.pint.com/classes/web3 Real Users • • • • • Understanding YOUR audience is key Audience varies from site to site Profiling users – Take a guess – Make up character names – Try to get in their shoes Interviewing real users – Interview Rule: Be quiet! – Figure out what kind of tasks they do. – Avoid focus groups initially and try one on one – Use focus groups to verify ideas Watch users – Look at the tasks they perform – Try to watch them without their knowledge Web Publishing 3 http://www.pint.com/classes/web3 The Other Master: The Client, Boss, Company, etc. • • With all the discussion on users people often then go to far and forget that the site is built to meet the needs of the client or boss. – They are the ones paying for it. – Site owners desires are not always congruent with the desires of the site’s users • Do users always want to see ads? Do they need to see them? Don’t let the boss run the show too much and particularly avoid the “I’ve browsed a lot of sites, I know what people want” people. Web Publishing 3 http://www.pint.com/classes/web3 Control • There is always an unwritten contract between developer and user for control – Users particularly novices users shouldn’t be given complete freedom because they may make mistakes and “hurt” themselves – Take away too much control and users may feel frustrated – Users need to feel in control – “Las Vegas” design – The best solution should be unlimited user control within a fixed domain of possibilities that can result in no serious errors. 26