RomeoMo

X: Psychology of Usability

71. What is Usability, Really?

• Usability is measured by what people do:
  • If more people buy something in an uglier design, it is more usable.
  • If people read more in an uglier design, it is more usable.
  • If more people register via the uglier design, it is more usable.
• Cognitive load is the amount of processing power that is required to complete any little thing we make a user’s brain do.
• Every detail in your design (and in your life) should reduce the amount of cognitive load between the user (or yourself) and positive goals.
• Beauty cannot make something more usable, but it can make users feel like it is more usable, and that is important, too.
• It is your job to use psychology—and confirm it with tests—even if it makes something a little uglier.

72. Simple, Easy, Fast, or Minimal

• Simpler:
  • Remove any questions that aren’t necessary, like confirming your email address.
  • Detect information, like the type of credit card, instead of asking for it.
  • Automatically format answers properly, like a phone number, instead of asking for it in several chunks (or using errors).
• Easier:
  • Let them choose their country from a list instead of asking them to type it.
  • Add super-clear instructions for every question, including questions like “Your name.”
  • Break complex questions into more steps so each step is easier to understand.
• Faster:
  • Let them save their address and autocomplete it for them next time.
  • Choose popular defaults so most people don’t have to change anything.
  • Make shortcuts like Amazon’s one-click purchase for people who are logged in.
• Minimalism is about doing less, better. In theory, minimalism makes a design simpler, easier, and faster.
• To choose heuristics that are best for you, interview users to learn about their mental strategies, ask the “stakeholders” in your company about their needs, and always A/B–test your choices to confirm that they are better.

73. Browsing, Searching, or Discovery

• Browsing: A browsing user will glance quickly at most of the images, one by one, starting at the upper left.
  • Make scanning easy and keep the content quick and visual.
• Searching: When someone is trying to ind something they have in mind, it might seem similar to browsing, but eye-tracking studies show a very different behavior: they are hunting. A searching user will ignore a lot of products or pictures.
  • Focus on attributes.
• Discovery: The way you think people discover new things is probably the opposite of how people actually discover new things.
  • Instead of relying on users to ind new things, let them ind what they are already looking for.

74. Consistency and Expectations

• Consistency is the idea that a design looks the same from page to page, or device to device, or user to user.
• Consistency creates expectations. When the user expects something to work a certain way, and it does, that’s good usability.

75. Anti-UX

• Nothing should be difficult or deceptive. We’re not trying to stop the user. We’re trying to remove the emotional motivation to cancel, so they choose to stay.

76. Accessibility

• Accessibility is the idea of designing for people who have less-than-typical abilities in one way or another.
• Accessibility is a major consideration for general public sites like governments and universities, but also for any site with millions of users.

XI. Content

77. UX Copywriting versus Brand Copywriting

• Perfect UX copy is understood immediately and forgotten after it serves its purpose.
• When we write copy we need to focus on making the user understand and engage.
  • Our headlines are calls-to-action, not storytelling.
  • Our explanations are instructional, not inspirational.
  • Our form labels are simple, not clever.
  • And our buttons labels are written for clarity, not to maximize whitespace.
• The goal of brand copywriting is to create those associations.
• UX and copywriting have the same ultimate goal: persuasion.
• Brand copy can motivate users, which increases engagement. And UX makes products more usable which improves the users’ impression of the brand.
• Good usability is always on brand. Don’t sacrifice function for style, ever.

78. The Call-To-Action Formula

• Verb + Benefit + Urgent Time/Place
• Verb: Action words gets to the point immediately and turns the button into a command.
• Benefit: Just make sure the benefit is a benefit to the user, not the website.
• Urgent Time or Place: Words like “now,” “today,” or “in 1 minute!” provide a time frame that is urgent and feels easy. Words like “here” or “this” tell users that the button itself is what they are looking for.
• It is a button or a link has already told the user that they need to click it (if you designed it properly), you don’t have to tell them again.
• Also, long or difficult words on a button lose clicks.

79. Instructions, Labels and Buttons

• Instructions: Instructions should be short, literal, and direct. Tell the users exactly what to do. Use the simplest words and phrases you know. Write to everyone as if they were smart children or a non-native speaker of the language. Not stupid, just clear.
• Labels / Buttons: Use the most common, easiest, most basic version of the label / button that you can imagine.
• Prove it with an A/B test if you must, but never back down when the text is for practical, functional reasons.

80. Landing Pages

• A good landing page answers the Three Whats of UX:
  1. What is this?
  2. What’s in it for me?
  3. What should I do next?
• A landing page should be so focused that you don’t even need the main menu. The job of many landing pages is to create interest. You measure interest by whether the user clicks something or not.
• Any time you spend optimizing a landing page is time well spent. Even a 1% improvement could mean thousands or millions of dollars in sales, depending on what you’re working on.

81. Readability

• Readability is the word for the “usability” of big blocks of text.
• Readability Is a Combination of Things:
  • Is the text big enough? Small text tends to look better but it’s dificult to read, especially on mobile devices.
  • Add space between the letters: Put some “air” in there to make it easier to read.
  • Add space between the lines: As a general rule, the space between the lines should be about 1.5 times the height of one line of text. More can be nice, too.
  • Add space around the text: All the other crap in your design might be distracting people from reading.
  • Adjust the width of the column: The optimal width for a column is said to be between 45 and 75 characters.
  • Use real content, and actually read it: You can only test readability by using text that is readable.

82. The Persuasion Formula

• Credibility: Without trust, everything else is irrelevant. Ideally you should build your credibility for real; however, the main thing is to communicate with others in a high-value way.
• Know your audience: In UX, that means you do your user research so you know who you are persuading and what they care about.
• Open and disarm: You have to engage the user’s interest immediately and then proceed to remove any obvious objections they might have.
• Create rapport: The feeling of getting along with someone and it is created by similarities between people.
• Isolate: When a user has come far enough that their interest is clear, you want to remove any competing information.
• Convince: For more complex persuasions, you might need to provide “waves” of information that leads the customer from the basics to the details, so they understand step-by-step.
• Close the deal: Just ask for commitment and don’t overcomplicate it.
• Summarize with bias: Don’t let the persuasion end with the close! That makes people feel like you only value them until they give you what you want.

83. How to Motivate People to Share

• It creates engagement!
• Instead of asking for help or examples directly, ask for examples of greatness. Or create an environment where horrible failure is desired by all.
• Instead of just telling people to continue or share or click, motivate them with a teaser headline, cliff-hanger, or the promise of a reward or an opportunity.
• If you’re a brand on social media, you will create a reason for a lot of people to spend a lot of time with you, building good feelings about your brand the whole time.

VII: The Moment of Truth

84. The Launch is an Experiment

• Design is a matter of taste; people make irrational decisions all the time. The only way to know is to do some science, and good science always needs a question, a hypothesis, an experiment, results, and interpretation.
• The Question/Problem:
  • First and always, you need to start with a question. In your case, it might be a user problem. Your job is to understand the problem well enough that you can describe it specifically and then design a way to solve it.
  • UX research is supposed to ind the questions and problems. By researching users and data you will uncover user behavior that needs to be fixed, or doesn’t make sense.
• Hypothesis:
  • Your design is your hypothesis: a strategy to solve the problem or answer the question. It is based on your research and data. It is your solution to the problem or question that you discovered in your research. You think it will work because the evidence says it will work.
  • UX is not a matter of taste, it is a matter of results. Just because you like it, doesn’t mean it’s good.
• Prediction:
  • Before you design your experiment, you should make a prediction about what will change if you are right about your hypothesis. That means you need to decide how you will measure that change.
• Experiment:
  • Change your attitude: The launch is the experiment, not the result. You don’t know anything until you prove it with real users. If you have done your research well and based your design on that research, you’re not guessing. You’re experimenting. Big difference.
• Results:
  • After you launch a site, you can get results like how long people stay on your site or how many registered or bought. These are not guesses, they are facts. You might need to wait a month or two on a small site, but the data will come.

XII: Data for Designers

85. Can You Measure a Soul?

• Feelings produce actions and decisions, and those things can be measured pretty easily.
• In UX, our goal is to create actions, not just feelings. We motivate people so they will act in a certain way, which is helpful for everyone (including us).
• When we talk about “the average person,” we don’t mean a speciic person. We’re talking about numbers. And those numbers measure the affect of your designs.

86. What Are Analytics?

• Data measures user behavior. What they do, how many times they did it, how long it took, and so on.
• But it also doesn’t tell you anything about context, so be careful.
• Do not reduce millions of people into a single number and expect it to be reliable in every situation.
• The bigger the decision you are trying to make with data, the more data you need before you decide.
• Ways to collect objective user data:
  • Analytics
  • A/B tests
  • Eye-tracking
  • Screen capture and heatmaps
  • Search logs: If people are searching for it, it means they can’t ind it, so those logs are very valuable for improving your information architecture and layouts!

87. Graph Shapes

• Traffic Graphs
  • These graphs show the number of people that did something, over time. Like the number of visitors per day. You can call that “traffic.”
  • If there is a slow consistent change, you will see it over time.
  • People don’t suddenly change behavior without being provoked.
  • A mature site (or a boring one) begins to have a clear pattern in visits.
• Structured Behavior Graphs
  • The date or hour when they did it isn’t as relevant. You have a big effect on this type of behavior via your IA(Information Architecture).
  • When users are ignoring the structure you gave them, it looks like this.
  • A huge drop between two bars often indicates a barrier for users.
  • A/B tests are a really effective way to ind the problem, if it isn’t obvious.

88. Stats — Sessions versus Users

• A unique visitor is a single user, a person, who can visit more than once.
• You should spend your time looking at, and thinking about, the relationship between the sessions and users numbers. It tells you a bit about loyalty and about how well you turn first-time visitors into repeat visitors.
• You can never know exactly how many individual humans came to your site.
• You can do a little more digging into how often users return on different devices.

89. Stats — New versus Return Visitors

• New Visitors: When a user comes to your site for the first time, they know nothing.
• Return Visitors: If that new visitor comes back a second time (or third, or hundredth), they are a “return” visitor.
• If you have very few return visitors, that’s a problem because nobody is coming back.
• If you have very few new visitors, that’s a problem because nobody is inding you.

90. Stats — Pageviews

• A “pageview” is pretty much what it sounds like: a user viewed a speciic page on your website (or app).
• The more you make users work for your content, the less content they will see.

91. Stats — Time

• Time per Visit (or time per session) is how long users spend in your app or on your site, on average.
• Time per Page tells you how long users spend on each specific page or screen, on average.
• When users are confused they will also spend longer on a page, because they are trying to igure it out.
• More time can mean more engagement or it can mean your menu is confusing, or the registration form is too difficult.
• How much time and how many pages can tell you a lot about user behavior. There is no combination that is “good” or “bad”—it depends on what your design is supposed to do.

92. Stats — Bounce Rate and Exit Rate

• Bounce rate is the percentage of users who arrive at your site, but don’t come in. They “bounce off” instead of actually using it.
  • Your goal is to make bounce rate as low as possible.
• The exit rate of a page tells you what percentage of the visitors left the site after viewing that page.
  • Look for pages with exit rates that “stick out.” If it is much higher or lower than the others, look into it. It might be a dead end, or a dificult form, or it could even be a good thing!

93. The Probabilities of Interaction

• UX is about increasing the chance, the odds, the probability that users will do something.
• It will be tempting to keep features because some users use it. Resist that temptation.
• If you make a design so effective that the majority of people do what you hoped, that’s great!

94. Structure versus Choice

• Anchoring only works when the anchor is the first option. If you have something else in the first position, it might be getting clicks just because users see it first.
• Motion and parallax effects should draw attention to things the user should do. Not the pure awesomeness of the designer’s imagination.
• We have learned that user psychology is about motivating users to do important actions, like registering, buying, subscribing, upgrading, etc.

95. A/B Tests

• Design all the things! Then, you launch all the options at the same time, as an A/B Test.
• An A/B test is a way of asking thousands or millions of real visitors which option is best.
• Only part of your traffic can see each one, so the more versions you are testing, the more traffic or time you will need.
• Some tips:
  1. A/B Testing is usually free, other than the time it takes to design and create the pages you’re testing.
  2. The only way to compare two designs is to run them both at the same time, using (roughly) equal numbers of people for both.
  3. An A/B Test is most reliable when you only change one detail.
  4. Testing two totally different pages, like a home page and a checkout form, is useless.

96. A Multi-what-now Test?!

• A multivariate test can test combinations of changes.
• Multivariate tests think harder than you can.
• Multivariate tests need more traffic than an A/B test because there are more combinations to test, but they also produce answers that would be a pain in the ass using A/B testing.

97. Sometimes A/B Testing Is the Only Way to Know

• Sometimes A/B testing is the only way to know.
• Design and launch the experiment. Make the versions exactly the same except for that psychological detail.
• Do the science. Trust the science. Be the science.

XIV. Get a Job, You Dirty Hippy

98. What Does a UX Designer Do All Day?

• As a professional UX designer, you will spend most of your time gathering information or explaining things to people who may or may not agree with you.

99. Which UX Job Is Right For You?

• The User Interface (UI) is what you see. UX is why you see it.
• In my opinion, all beginners should be generalists. Try everything. Learn everything. Take any responsibility someone is willing to give you.
• Information Architects work mostly with the structure of the content and pages.
• IxD tends to connect more with frontend coding or UI design because it’s hard to think about one without thinking about the other.
• if you think more about the product rather than the interface itself, UX is probably more your style.
• If you want to be a “Growth Hacker,” or if you want to build UX into marketing campaigns, or if you want to be a less technical (but more advertising-oriented) version of a UX designer, this might be your deal.
• If you love analysis and want to spend a lot more time solving real-world user problems—and probably be a little more scientific—this is a good role for you.

100. What Goes in a UX Portfolio?

• Even though UX isn’t about style, you should have visual things to show: sketches, wireframes, analytics screenshots, site maps, before-and-after designs, etc.
• If you prove that you can make things work better by understanding users, you will immediately look valuable to any organization, regardless of how much experience you have.
• Make something to get Experience:
  1. Do case studies
  2. Solve a real problem
  3. A/B–test your own site

VI. Information Architecture

38. What is Information Architecture?

• What: Information Architecture (IA) is the idea of giving a bunch of information some structure (i.e., organizing it, somehow). IA can be relatively simple with a small project, and incredibly complicated with a large project. IA is invisible. To work with it, we need to draw a site map.
• Some general guidelines:
  • Just because it looks simple, doesn’t mean it makes sense.
  • Keep it clear and readable.
  • We usually draw top-to-bottom, not left-to-right.
  • Don’t make a site map “fancy.” It’s a technical document, not a fashion show.
• Deep or Flat
  • Deep: simpler menus, but more clicks to get where you’re going.
  • Flat: includes more sections in the menu and requires less
• If your site is deep and flat, that’s bad. You might want to simplify your goals, or design a good search as a core feature.

39. User Stories

• A user story describes one possible path a user can take in your site or app. It should be short, but complete. You will need many user stories to describe your whole design.
• Notice that nothing in the story tells me speciically how to solve or design those actions, just that they are possible. The purpose of these stories is to describe flows. Sequences of user choices. Not the final UI.
• A user story is basically a list of features or functions, and that has a major effect on the final solution.
• The UX Designer writes user stories to communicate to the team, not the other way around.

40. Types of Information Architecture

• Categories: When you click those categories, you expect to see content that its in that category.
• Tasks: Another way to organize your site or app is by the goals the users need to achieve.
• Search: If your site is very complex, or if it is mostly full of user-generated content, a search-based architecture like YouTube might make more sense.
• Time: Design IA that changes with time(Time-based IA design).
• People: Facebook—or any social network—is IA based on people.All of the pages are designed around who the information is about, and the relationships between them.

41. Static and Dynamic Pages

• Static Page: A static page (or screen) is the most basic form of a digital layout. It will look precisely the same every time, for every user. It is hardcoded.
• Dynamic Page: A dynamic page is a page that isn’t always the same.
  • A dynamic page might react to your choices.
  • A dynamic page might look different depending on the user.
  • A dynamic page might act as a template for lots of content.
• Static vs. Dynamic:
  • Static design is more about the exact layout.
  • For dynamic pages you have to design containers, not the content itself.
• Don’t be afraid to create useful limitations so users will make more effective choices.

42. What is a Flow?

• Architecture without getting stuck or lost, and the easier it is for them to “flow” to where they want to go, the better your design will perform and the happier the users will be.
• It is more important to give people the right information at the right time so they know whether to turn left or right.
• Make sure there is always somewhere to go, and make sure the users know how to get there.

43. Users Don’t Go Backward

• If users can always click forward, they never have to stop and decide where to go next. Decisions are hard. Doing the same thing over and over is easy.

VII Designing Behavior

44. Designing with Intention

• UX is the science of design. It’s all about results. But to get good results, you need to motivate users to be more effective. This also means that one UX design can be “more right” than another, regardless of which one everybody likes better. And we can prove it. Sometimes even the users prefer the wrong one!

45. Rewards and Punishments

• The designer, can control what happens, that means you can control the feedback. Which means you can train your users by rewarding them for something you consider good, and punish them for something you consider bad.
• Pay attention to when users feel good and bad. Over time, those rewards and punishments can create lasting associations and behaviors that boost engagement through the roof, or crush your entire company.

46. Conditioning and Addiction

• People will do a little work or pay a little cash to get a reward, if the reward is worth it. But, the first reward should be free.
• Type of conditioning
  • Classical: Connect a signal of your choice to an existing behavior.
  • Operant: Reward or punish a random action.
• Focus on giving so there is a sense of progress over time. Plus, your users will become loyal instead of resenting you.
• Random rewards based on the quality of content—like blogging or social media comments — will raise the level of content overall.

47. Gamification

two major elements of game design:

• Feedback Loops
  • motivation
  • action
  • feedback (emotion)
• Progressive Challenges: it’s not about just getting it done anymore. It’s about getting it done better. To create progression, you merely have to create a bigger, better, harder way to do what the user already knows.

48. Social / Viral Structure

• The Basic Formula: Action from User A = Feedback for User B = Content for User C
• Viral structure achieves a few things when done right:
  • 2-in-1 actions
  • Good shit floats
  • Social proof
  • Self-promotion
  • Network saturation

49. How to Create Trust

1. Professionalism: Part of that is visual design, part isn’t.
2. Nothing is 100% positive or negative: Top-rated product reviews are both positive and negative. It has also been shown that app ratings and book reviews are most-trusted when they do not have all 5-star ratings.
3. Democratize: As a group your users can be like a quality filter.
4. Accountability: Trust can be built by showing information and by hiding it.
5. Handle negativity with grace: When a company receives negative feedback and then deals with it gracefully in public they actually build more trust than positive feedback does.
6. Keep users informed: It is better to tell the truth than let the user worry about it. Even when the truth isn’t the answer the users want.
7. Use simple words: Just speak like a normal person would speak.

50. How Experience Changes Experience

• If you want millions of happy users, design for the distracted idiots, not the obsessed geniuses.
• Visible features will always be used more and discovered more than hidden features.
• The users will use fewer and fewer features. Not more and more.
• Habits are created very quickly in your users’ minds, so you should design a “fast way” to do key features, which might not be as obvious.

VIII Visual Design Principles

51. Visual Weight (Contrast and Size)

• Remember: visual weight is relative. All visual principles are about comparing a design element to whatever is around it.
• Contrast: The difference between light things and dark things is called contrast.
• Depth and Size: In the real world, we notice things that are close to us more than things that are far away.
• As a general rule, you want more important things to be bigger than less important things. This creates a visual “hierarchy” on the page and makes it easier to scan, but it also allows you to choose what the user notices first.

52. Color

• Sometimes color is function. Like traffic lights, or making the color of a popsicle match the flavor.
• If you don’t need to indicate something like that, let the UI designer choose colors. But if you do, let your wireframes do the talking.
• Colorful wireframes just get in the way of the functional details. Use colors where they matter, but don’t make your wireframes blue like blueprints, or dress them up for clients.

53. Repetition and Pattern-Breaking

• You could expect more people to click the options on the left, and fewer people to click the options on the right.
• Pattern-breaking can also lead the user’s eyes away from other important things. Before you can break a pattern, you have to make one.

54. Line Tension and Edge Tension

• Line Tension: The perception of a line or a “path” when there isn’t one. Our eyes will follow the path to see where it goes.
• Edge Tension: Layout-wise, this can be an excellent way to put more focus on something small, like a label. Or you can create visual paths leading to the button you want people to click.

55. Alignment and Proximity

• Alignment: Different levels of content can be aligned. Information can be in a grid of rows and columns like a spreadsheet to create complex meaning.
• Proximity
  • The closeness or distance between two objects creates a feeling of those objects being related or unrelated. That distance is called proximity.
  • In your designs, put related elements closer together and unrelated elements farther apart.

56. Using Motion for UX

• If Motion Makes People Wait, It’s Bad
• If you made a list of the things your brain notices, in order of priority, motion would be first.
• If you are using motion to highlight key features or tell users where to go, straight lines are a good choice.
• Curved lines make people follow the curve - Like when you’re explaining your app for the first time.

IX Wireframes and Prototypes

What is a Wireframe?

• A wireframe is a technical document. Lines, boxes, labels. Maybe a color or two.

What isn’t a Wireframe?

• A wireframe is a planning document. It is a technical instruction document for the “builders.”
• Top 5 unforgivable (!) wireframe sins:
  1. Wireframes are not a basic sketch: Explain early concepts/thoughts in words and pictures, not with wireframes.
  2. Good wireframes take time: Wireframes are 90% thinking, 10% drawing. Make sure everyone respects the need for the 90% part.
  3. Wireframes aren’t presented in phases: Everything made by humans goes through “drafts” as we perfect our ideas, but wireframes are either ready or they’re not.
  4. Wireframes should be taken seriously: Plan enough time for wireframes—especially in large projects. Label and describe (i.e., annotate) each element of each page so a developer never has to ask you what a button is supposed to do.
  5. Wireframes are not meant for display.

59. Learn Skills, Not Tools

• Find and use the simplest tool that can handle the project and make files that your team can share easily and cheaply.
• Always design what you want first, and then use wireframes to make it into a technical document.
• My first recommendation to all new UX designers is to use a pencil and paper for wireframing until you need to be so specific and technically accurate that something digital is required.

60. Avoid Convenient Examples

• In my experience, conversations about UX design focus on the way you want users to use your stuff, not the way they could use it. That’s dangerous.

61. What is a Design Pattern ?

• A design is not necessarily good just because it’s common. To be a “good” design pattern, a solution must be common and usable.

62. Z-Pattern, F-Pattern, Visual Hierarchy

• It is easy to imagine every user excitedly reading every letter you write and every pixel you make. Get over it, because real users won’t. They scan.
• “Scanning” means the user only stops to read when something catches their eye. This lesson is about scanning patterns.
• In a design like that—which I hope you never create—users will generally scan it in a pattern something like a “Z,” starting in the upper left and ending in the lower right. Anything in the layout that isn’t near the Z probably won’t be noticed.
• The F-Pattern works like this:
  1. Start in the upper-left corner, like the Z-Pattern.
  2. Read/scan the first (head)line of the text.
  3. Scan down the left side of the column until you ind something interesting.
  4. Read the interesting thing more carefully.
  5. Continue scanning down.
  6. By repeating that method over and over, the scanning pattern starts to look like an “E” or an “F,” hence the name.
• A button in the upper left will get more clicks than a button in the upper right, which will get more clicks than a button in the lower left, which will get more clicks than a button in the lower right. And all of those will get more clicks than something randomly stuck in the middle, unless you do something about it.
• Some designers think visual hierarchy is good because it looks better, but the truth is that it feels better because it is easier to scan.

63. Layout: Page Framework

• Start with the big parts, then ill in the details.
• Footers: A footer is typically a list of static links that are too general and too insignificant to get a place in the main navigation.
• Navigation:
  • Main Meu: If you did your information architecture properly, then you already know what should be in the main menu. It’s the first level of links in your site map (below the home page).
  • Submenu: The main thing with the submenu is that it should ideally be in the same place on every page, even if the links change all the time. That way, users will quickly learn where to ind it.
• Everything-in-one-menu is the laziest design in the universe.
• Create navigation and footers that work for all of the pages/ screens in your app before you get into content.

64. Layout: The Fold, Images, and Headlines

• Give people something to focus on before they scroll.
• Make it obvious that they can scroll.
• Choose images that add emotion and direct the user’s eyes.
• Use headlines to direct users to what matters most.

65. Layout: The Axis of Interaction

• The axis of interaction is the imaginary “edge” your eye follows naturally. The closer something is to the axis, the more visible it is to the user.

66. Forms

• The main thing is to make a form feel simple. Keep related questions together; eliminate questions you don’t really need; and use as many pages as you need, no more, no less.
• Whether you use a standard text field or a super-custom slider, you should choose the input type that gives you the highest quality answers.
• When you’re labeling your inputs – how else will the user know what to do with them? — be short, clear, legible, and put the labels close to the input.
• Preventing and Handling Mistakes
  • You can prevent mistakes by adding some intelligence to the inputs.
  • Giving users an example of the input you expect can also reduce errors.
  • When users miss a question or make a mistake, you should alert them so they can ix it.
  • Do not use inline error handling if you can’t verify the input, like when people type their name.
  • When the user clicks “next” or “done,” you can check the form for missed questions or mistakes. If there is a problem, make it visually obvious which ones they missed and why they are wrong.
• A form with labels that are left-aligned and above the input will get users through it as fast as possible. It keeps everything on the Axis of Interaction.
• For most forms, put the “done” button on the left, on the Axis of Interaction.

67. Primary and Secondary Buttons

• As a general guideline, you will need only two button styles:
  1. Primary Actions that are helpful to our goals.
  2. Secondary Actions that are not.

• It is a good idea to give this button a warning color that indicates the importance of the action (red, orange, yellow, etc.).
• In some cases, you will have one type of action that is unique to your site or app, which requires special focus. Design a special button for this so it stands out in your design (pattern breaking).

68. Adaptive and Responsive Design

• Adaptive design is really just a couple of different designs.
• Responsive design is one design that fits all screens.

69. To Design or Redesign?

• If you don’t know what you’re solving, you don’t know how to solve it. So, first, decide exactly what result you’re aiming for, and think about how far your current design is from doing that.
• Sometimes doing everything is simpler than doing one thing. When you have a sense of the problem and what it might take to solve that problem, don’t look for the biggest, coolest way to solve it. Look for the minimum number of changes you can make that will get the job done.
• A new design from scratch takes away all the baggage of the old design, but it means that you have to be more careful about using all of the existing data and managing expectations.
• Adding features isn’t always the right choice. It is always worth asking yourself if you can solve a problem by taking things away.

70. Touch versus Mouse

• The Mouse’s Advantages:
  • Small and accurate
  • Ability to hover
  • Selects items easily
  • Hidden options/navigation
  • Can change shape
• The Finger’s Advantages:
  • Built-in feedback
  • Direct-to-interface
  • Creates a physical orientation
  • Always available
  • Gestures and multitouch
  • Fully trained right out of the box

I: Key Ideas

1. What is UX

• Your job is not to create the user experience. Your job is to make it good.
• The goal of a UX designer is to make users effective.
• UX is about “doing” the process of User Experience Design.
• UX Design (also sometimes called UXD) involves a process very similar to doing science:
  • you do research to understand the users,
  • you develop ideas to solve the users’ needs—and the needs of the business
  • you build and measure those solutions in the real world to see if they work.

2. The Five Main Ingredients of UX

• Psychology: the designer must ignore their own psychology sometimes.
• Usability: we want it to be so easy that even a (moron) could use it.
• Design: In UX, design is how it works, and it’s something you can prove; it’s not a matter of style.
• Copywriting: UX copy gets shit done as directly and simply as possible.
• Analysis: Analysis is the main thing that separates UX from other types of design, and it makes you extremely valuable.

3. Your Perspective

Your own desires and experience can even work against the users.

• 'empathy’: relate to the users
  • Do research.
  • Talk to users.
  • Study the data.
• Not people who are dumber than you. People who know less.

4.The Three “Whats” of User Perspective

• “What Is This?”: Just tell them. Directly. And use simple words.
• “What’s in It for Me?”: It is better to show users what they will get, rather than tell them.
• “What Do I Do?”: It’s up to you to figure out what the users might need, and tell them how to get it.

5. Solutions versus Ideas

• Solutions are ideas with meaning for other people
  • if your ideas are not meaningful for other people—the users—then they are not meaningful for you.
• Solutions are ideas that can be wrong.
  • UX can be wrong. And we can prove that it is wrong.And the same solution can be right for one site, and wrong for another.

6. The Pyramid of UX Impact

• As a UX designer, your job is to create value—from the user’s perspective.
  

II: Before You Start

7. User Goals and Business Goals

The real test of a UX designer is how well you can align those goals so the business benefits when the user reaches their goal.

8. UX is a Process

• UX designer’s Process
  • gather the information you need
  • research the users
  • design the solution
  • make sure it is implemented properly
  • measure the results
• figure out where UX should fit, not just where your company expects it to fit

9. Gathering Requirements

• As a UX designer, your most ingenious creative ideas will come from the limitations and restrictions you define by studying the problem.
• Collect problems that could be solved, things that can’t be changed, or technical things that must be included.
• You’re a UX designer now; other people’s needs are your needs.
• When someone says they need something, ask why. If the answer is something about the opinions or expectations of other people, ask more questions.

10. Building Consensus

• As a UX designer, you need to have reasons to support your design before you design it, and you have to be able to defend your choices.
• Good research, good theory, and good data are persuasive.

III: Behavior Basics

11. Psychology vs. Culture

• Psychological purpose is usually more general, but they have the most impact overall.
• Cultural elements cannot be optimized, only customized.

12. What is User Psychology?

• UX Design can affect that brain in lots of predictable ways. And that’s what you’re gonna learn: your brain, on design.
• UX Design is the practice of creating nonrandom effects in people to solve a problem.

13. What is An experience?

• What the user feels
  • The good things about feelings are that we can see them on a user’s face, users can tell us about them, we can measure them, and we can relate to them, so feelings are easy to study.
• What the user wants

• A user’s motivations are the engine of their behavior.

• What the user thinks(cognitive load)
• What the user believes

• The reasons people believe things are fairly predictable though.
• More important, your intuition has predictable laws that most people don’t know about.

• What the user remembers

• We only remember certain parts, we change those memories over time, and sometimes we remember things that never even happened.
• Your design can determine which parts someone remembers, and which are forgotten.

• What the user doesn’t realize

• UX designers must also design things that users will never notice, never give you feedback on, and maybe never remember.
• Those design elements will change the user’s behavior, and only the data can show you how.

14. Conscious vs. Subconscious Experience

• Conscious Experience
  • Your conscious experience may feel like the whole experience, but it is actually just a small part. However, it’s still significant.
• Subconscious Experience
  • Subconscious experience seems like it “just is.”
  • Things are supposed to be easy.
  • If you want users to trust or understand, your design must feel trustworthy or obvious. If it doesn’t, you can add as much delight as you want and it ain’t gonna fix nothing.

15. Emotions

• Two categories of emotions: Gain and Loss
  • Gains give you positive feelings.
  • Losses give you negative feelings.
• Emotions Are Reactions, Not Goals
  • There are two types of feelings: emotions and motivations.
  • Motivations are what we want (goals),
  • Emotions are how we feel when we gain or lose what we want (feedback).
• Time Makes Emotions More Complicated
  • Your emotions, or your “mood,” change all the time. Within reason, that’s normal.
  • Manage the user’s feelings throughout their experience by giving them the information and signals they need to feel comfortable.

16. What Are Motivations?

• Motivations can fall anywhere between conscious experience and subconscious experience.
• Motivations are relative. That means it’s not about how much you get, it’s about how much more you get compared to what you have or what other people have.
• The 14 Universal Motivations
  • Avoid death
  • Avoid pain
  • Air / water / food
  • Homeostasis
  • Sleep
  • Sex
  • Love
  • Protection of Children
  • Affiliation
  • Status
  • Justice
  • Understanding(Curiosity)

17. Motivation: Sex and Love

• Sex: Provide the information users need to judge “quality” (popularity, interests, physical appearance, etc.) and to find whatever matches their taste.
• Love: Provide features to filter, compare, ask questions, save, follow-up, etc.

18. Motivation: Affiliation

Allow users to belong to a group or be identified by things they have in common—like joining guilds or “Liking” pages or choosing color schemes.

19. Motivation: Status

Let users personalize some features, like a profile picture or privacy settings, and never take big choices out of their control. Create a way to measure users’ actions so they can compare themselves to others.

20. Motivation: Justice

Have rules of conduct, or symbols of respect and honor, or give users the power to choose champions.

21. Motivation: Understanding (Curiosity)

• Think of a way to make your product seem like a motivational gain, or not having your product seem like a loss.
• You also have to consider the case when users want to understand.
• When you change or remove features, avoid using curiosity as a marketing strategy. Tell users what is coming, tell them why, show how it will work, and give them time to adjust, (if you can). Otherwise, users will be angry or afraid, because you’re taking away something they already understand. That’s a loss.

IV: User Research

22. What is User Research?

• There is never a bad time to do user research. Do it early, do it often. The important question isn’t when. It’s what. As in “what are you trying to learn about your users?”
• Subjective and Objective
  • Subjective Research: The word “subjective” means that it is an opinion, or a memory, or your impression of something. The feeling it gives you. The expectations it creates. Not a fact.
  • To get subjective information you have to ask people questions.
  • Object Research: The word “objective” means a fact. Something true. Something you can prove. Your opinion doesn’t change it, no matter how hard you wish.
  • Objective data comes in the form of measurements and statistics. But, just because you can count something doesn’t make it objective or “data.”
• Collect as much info as possible for your research.
• Subjective things can never be true; only more or less popular.

23. What isn’t User Research?

• The users are testing your design. If they don’t do what you want them to do or if they don’t understand, that’s your fault, not theirs.
• Your job is to listen to what the users say, not to be their design monkey. Listen to what users think, watch how they try to get things done, and understand how and why they get lost in your designs. Then go find solutions to those problems.
• User research is not a way to confirm your beliefs; it’s a way to discover them.

24. How Many Users Do you Need?

• The less obvious the problem, the more people you need to find it.
• If you only test a single type of user, you’ll miss any problems that are caused by other types of thinking. Throw in a few random weirdos—not your colleagues—just to see what they do. You might make some interesting discoveries.

25. How to Ask Questions?

• Three Basic Types of Questions:
  • Open Questions: This allows for a wide range of answers and works well when you want all the feedback you can get.
  • Leading Questions: This narrows the answers to a certain type. Be careful: this type of question also excludes answers you might want to know!
  • Close / Direct Questions: This type of question offers a choice: yes or no; this or that.
• Types of research methods:
  • Observation: Give people tasks or instructions and watch them use your design, without help. Afterward, you can ask them questions.
  • Interviews: Get somebody and ask them a set of questions, one-by-one.
  • Focus Groups: Get a bunch of people in a room together and ask them to discuss your questions.
  • Surveys: A form, which people answer on paper or online. These can genuinely feel anonymous, which is useful.
  • Card-Sorting: Each person gets a set of ideas or categories (on cards or post-its or online), which they sort into groups that make sense to them, personally. ProTip: don’t use your colleagues for this.
  • Google: It’s amazing how many useful opinions you can find online, for free, right now.
• Important
  • Ask the same questions, the same way, to everyone.
  • Avoid interpreting questions or suggesting answers.
  • People might lie to avoid embarrassment or if it seems like you prefer a particular answer.
  • Take notes or record the interview. Do not rely on your memory, ever.
  • Don’t eat yellow snow (Don’t do stupid things).

26. How to Observe a User

• Make sure you record your research as it’s happening. Don’t rely on memory.
• If you have video of the screen and their face, you can take advantage of those real-time clues later.
• The more the user doesn’t do what you expect, the more useful the testing is.
• Letting users fail is sometimes the most useful result you can get.
• Always approach user testing as if you expect users to lie about something, even if they don’t realize it, because you can’t trust a user any farther than you can throw them.

27. Interviews

• What: An interview is a set of questions, created by you before the interview, asked to a user, in person.
• Good Interviews:
  • You can ask follow-up questions; find out if your questions are confusing; give people tasks to complete; and get long, open answers to questions that might be harder to answer in writing.
  • You can also watch users and get nonverbal clues, and you can learn about things where time limits are built into the experience, like games, quizzes, or real-time messaging.
  • You can hand-pick the testers.
• Bad Interviews
  • You are there, so testers might adjust their behavior and opinions to get approval from you.
  • It is harder to get real people to come to a place that is good for you, so you will usually end up testing with fewer users.
  • The social nature of a face-to-face interview is not good for embarrassing or private products and services.
  • Introverted users probably can’t imagine anything worse than a face-to-face interview.
• When: You need to test subjective stuff with many steps or decisions involved, like navigating around a site to select the perfect latex body suit. Or if you need to ask follow up questions depending on the user’s behavior.

28. Surveys

• What: A survey is a set of questions that a user answers by filling out a form on paper or online, privately, and sometimes anonymously.
• Good Surveys:
  • They allow users to participate privately and therefore be more honest.
  • Every user gets precisely the same questions, and you (the designer) can’t screw it up by asking the questions wrong.
  • It is easy and cheap to get thousands of people to answer a survey.
  • Nobody has to feel disappointed, because a UX survey never says you are most like Malfoy.
• Bad Surveys:
  • You can’t ask follow-up questions, so it takes more careful preparation to create a survey.
  • It’s easy to accidentally influence the results by how you ask the question or the order you choose for the options.
  • People are lazy, so the longer you make the survey, the fewer people will complete it.
  • You can’t retake a survey to choose all the answers that make you Harry or Hermoine, even if you know—in your heart—that you’re not like Malfoy.
• When: You want to compare the answers of users to each other, or control the way questions are asked, or ask a lot of people, or control the mix of ages, genders, locations, etc.

29. Card Sorting

• What: Basically, you give each user a set of topics or ideas written on “cards” —- maybe types of content or features you’re considering and ask them to organize the cards into categories that make sense to the user.
• Good Card Sorting
  • • Designing big, complex sites like Wal-Mart or eBay can seem overwhelming at the beginning. Card sorting helps you get started.
  • You can discover structure within a pile of ideas that seem random or unrelated, or learn about the priorities of your audience without asking them directly.
  • I did card sorting for a digital agency’s website, because I understood the content too well and couldn’t think about it from the users’ perspective. It also revealed differences in the way clients and prospective employees thought about the agency.
• Bad Card Sorting
  • • It is deinitely a bit tedious to set it up, and the answers are more of a guide than a solution.
  • Card sorting is only as good as the material you put into the experiment.
  • Users will organize the cards you provide for them, whether that makes sense or not.
  • If your site/app is a tool, like email, or something less traditional, like Tinder, card sorting might give you unhelpful results. Card sorting is designed to reveal assumptions and expectations, not innovation.
• When: You know what types of content or features you want to include, but the actual strategy for organizing that content isn’t so obvious.

30. Creating User Profiles

• What: Profiles or personas describe the goals, expectations, motivations, and behavior of real people. All the information you need should be in your research and data.
• When you think about features, think of the most valuable version of the users you see in real life. You’re not trying to support the current behavior; you’re trying to nudge those users toward an “ideal” version of themselves.
• Also remember that all users are not alike! You will probably have a few different behavioral groups, and they all deserve a good proile.

31. Devices

• Finger or Mouse?
• Start small: if you design for the smallest, least powerful device irst, then you will focus on the content and your core functionality. That leads to simple, beautiful apps/sites.
• What special powers does this device have?
  • different devices require different thinking sometimes.
• Consider the software: Every time you support one, it multiplies the design, development, and maintenance time in the future. Think ahead!
• Be responsive: Decide whether a couple different layouts will do the job or whether you should create a fully responsive site for all types of customers.
• Think about more than one screen at a time.

V: The Limits of Our Minds

32. What is Intuition?

• Intuition is constructed from your experiences; you expect certain things based on what you have experienced before.
• Trusting your gut guarantees you will be wrong eventually. Many times. Not trusting your gut is the only way to avoid those mistakes.
• A UX Designer’s Job Is to Design for Other People’s Gut Feelings Not your own. Not your own.
• You need data and user feedback to know for sure.

33. What is a Cognitive Bias?

• Cognitive biases are sort of like that. If you ask people certain types of questions, or ask in a certain way, the “intuition system” will reliably choose the wrong answer.
• We can let users choose whatever they want, and most of the time they will choose what we want. If you do it right.
• Some examples:
  • Anchoring
  • Bandwagon Effect
  • Decoy Effect

34. The Illusion of Choice

• Always give users the options they need, and make sure everything is easy to ind, but—as a UX designer—you can also maximize your own goals, without sacrificing anything for the user.
• Four good principles:
  1. The Paradox of Choice: The more options you offer someone, the harder it is to choose.
  2. What You See Is All There Is: Most people will only consider the choices that they are offered, even if other possibilities exist.Every choice should take the user closer to their goal, and you can design the choices so they are good for your goals in the process.
  3. Choose Defaults Wisely: The lazy option should be the best one for your company and—ideally—for the user. If the user can truly choose “anything”—like a pay-what-you-want situation—then anchoring is the way to set a default in their mind.
  4. Comparisons Are Everything: Users are choosing things based on comparing their options. Therefore, you should create comparisons that make your preferred options look better.

35. Attention

• What: Your brain can only consciously do one thing at a time, so it has to focus. That focus moves from one thing to another, all day long. That’s called attention.
• Ways to get the attention of users:
  • Motion: This is the highest-ranking part of your visual system, so when something moves, your attention is drawn to it by relex. But if everything is moving, the stationary item gets the attention.
  • Surprise: When something doesn’t match what we expect, we notice.
  • Big text
  • Sound: Audible alerts can be one of the most annoying things on the Internet, but it does get your attention. When used more elegantly, it works well.
  • Contrast and Color: These can make parts of your design jump out from your peripheral vision. Users will notice those parts without looking directly at them.
• Good UX is reductive, not expansive.

36. Memory

• The experiences you remember are not complete, accurate, honest, and sometimes they aren’t even real.
• Your brain puts more emphasis on the experiences that have stronger feelings and more “novelty” (they grabbed your attention, at the time). Your brain is also good at remembering patterns and things you do over and over. That’s called practice, or a habit, or muscle memory.
• Few tips to change people’s memories:
  • Remind them of the good parts.
  • Create habits: It is useful to build patterns of clicks/touches that people can learn and repeat quickly.
  • Personalize: Many websites use your choices to improve your next visit.
• You should record interviews or take notes that are good enough for someone else to use, and document your research (with sources!).
• Some things we remember are completely false.

37. Hyperbolic Discounting

• Usability is basically the idea of getting people to the things they want as close to “now” or with as little effort as possible. The more work it takes or the longer they have to wait, the worse the experience feels.
• Everything in your design should be based on getting users to the most valuable actions as quickly and easily as possible. But your design should also make destructive actions more time consuming and unemotional so they feel less appealing.

The Usability is about people and how they understand and use things, which includes

• Useful: Does it do something people need done?
• Learnable: Can people figure out how to use it?
• Memorable: Do they have to relearn it each time they use it?
• Effective: Does it get the job done?
• Efficient: Does it do it with a reasonable amount of time and effort?
• Desirable: Do people want it?
• Delightful: Is using it enjoyable, or even fun?

1. Don’t make me think

• Self-evident. Obvious. Self-explanatory.
• Eliminating question marks to reduce cognitive workload.
• If you can’t make something self-evident, you at least need to
  make it self-explanatory.

2. How we really use the web

• glance at each new page, scan some of the text, and click on the first link that catches their interest or vaguely resembles the thing they’re looking for
• We don’t read pages. We scan them.
• We don’t make optimal choices. We satisfice.
  • We don’t choose the best option—we choose the first reasonable option, a strategy known as satisficing.
• We don’t figure out how things work. We muddle through.

3. Designing for scanning

• Take advantage of conventions
  • Where things will be located on a page.
  • How things work.
  • How things look.
  • Innovate when you know you have a better idea, but take advantage of conventions when you don’t.
  • CLARITY TRUMPS CONSISTENCY
  • If you can make something significantly clearer by making it slightly inconsistent, choose in favor of clarity.
• Create effective visual hierarchies
  • The more important something is, more prominent it is.
  • Things that are related logically are related visually.
  • Things are “nested” visually to show what’s part of what.
• Break pages up into clearly defined areas
  • Allows users to decide quickly which areas of the page to focus on and which areas they can safely ignore.
• Make it obvious what’s clickable
  • One color for all text links or make sure that their shape and location identify them as clickable.
• Eliminate distractions
• Format content to support scanning
  • Use plenty of headings
  • Keep paragraphs short
  • Use bulleted lists
  • Highlight key terms

4. Why users like mindless choices

Users don’t mind a lot of clicks as long as each click is painless and they have continued confidence that they’re on the right track.

~ if some assistance required

• Brief: The smallest amount of information that will help me
• Timely: Placed so I encounter it exactly when I need it
• Unavoidable: Formatted in a way that ensures that I’ll notice it

5. Omit needless words

• It reduces the noise level of the page.
• It makes the useful content more prominent.
• It makes the pages shorter, allowing users to see more of each page at a glance without scrolling.

6. Designing Navigation

• Putting them in a standard place lets us locate them quickly, with a minimum of effort; standardizing their appearance makes it easy to distinguish them from everything else.
• Just having the navigation appear in the same place on every page with a consistent look gives you instant confirmation that you’re still in the same site—which is more important than you might think.
• the Site ID at the top of the page—usually in (or at least
  near) the upper left corner.(on Web pages written for left-to-right reading languages.)
• Almost all Web users expect the Site ID to be a button that can take you to the Home page. I think it’s also a good idea to include Home with the main sections of the site.
• Best practices for implementing Breadcrumbs:
  • Put them at the top.
  • Use > between levels.
  • Boldface the last item.

7. About Home Page

~ All the things of Home page

• Site identity and mission
• Site hierarchy
• Search
• Teases
• Content promos
• Feature promos
• Timely content
• Deals
• Shortcuts
• Registration

~ A few abstract objectives

• Show me what I’m looking for
• …and what I’m not looking for
• Show me where to start
• Establish credibility and trust

~ conveying the big picture

~ Everything on the Home page can contribute to our understanding of what the site is.

• The tagline
• The Welcome blurb
• The “Learn more.”

~ a few guidelines for getting the message across

• Use as much space as necessary.
• …but don’t use any more space than necessary.
• Don’t use a mission statement as a Welcome blurb.
• It’s one of the most important things to test.

~ Good taglines vs. Bad taglines

• Good taglines are clear and informative and explain exactly what your site or your organization does.
• Good taglines are just long enough, but not too long.
• Good taglines convey differentiation and a clear benefit.
• Bad taglines sound generic.
• Good taglines are personable, lively, and sometimes clever.

8. What is good web designing

• What works is good, integrated design that fills a need—carefully thought out, well executed, and tested.
• You have to use the collective skill, experience, creativity, and common sense of the team to build some version of the thing (even a crude version), then watch some people carefully as they try to figure out what it is and how to use it.
• Opening our eyes to just how varied users’ motivations, perceptions, and responses are, testing makes it hard to keep thinking that all users are like us.

9. About Testing

~ Focus group vs. Usability tests

• In usability tests, you watch people actually use things,
  instead of just listening to them talk about them.
• Focus groups can be great for determining what your audience wants, needs, and likes—in the abstract.
• The kinds of things you learn from focus groups—like whether you’re building the right product—are things you should know before you begin designing or building anything, so focus groups are best used in the planning stages of a project. Usability tests, on the other hand, should be used through the entire process.

~ About Usability tests:

• If you want a great site, you’ve got to test.
• Testing one user is 100 percent better than testing none.
• Testing one user early in the project is better than testing 50 near the end.

~ How often: every Web development team should spend one morning a month doing usability testing.

• It keeps it simple so you’ll keep doing it.
• It gives you what you need.
• It frees you from deciding when to test.
• It makes it more likely that people will attend.

~ How many users: three

• The purpose of this kind of testing isn’t to prove anything.
• You don’t need to find all of the problems.
• It’s much more important to do more rounds of testing than to wring everything you can out of each round.

~ How to choose the participants: RECRUIT LOOSELY AND GRADE ON A CURVE

• It’s usually not a good idea to design a site so that only your target audience can use it.
• We’re all beginners under the skin.
• Experts are rarely insulted by something that is clear enough for
  beginners.

10. About Mobile

~ Mobile devices meant cramped devices.

• One way to look at design—any kind of design—is that it’s essentially about constraints (things you have to do and things you can’t do) and tradeoffs (the less-than-ideal choices you make to live within the constraints).
• Most of the challenges in creating good mobile usability boil down to making good tradeoffs.
• One approach was Mobile First. Instead of designing a full-featured (and perhaps bloated) version of your Web site first and then paring it down to create the mobile version, you design the mobile version first based on the features and content that are most important to your users. Then you add on more features and content to create the desktop/full version.
• Mobile First meant that you would work hard to determine what was really essential, what people needed most.
• If you’re going to include everything, you have to pay even more attention to prioritizing.

~ Central to my definition of usability

• A person of average (or even below average) ability and experience can figure out how to use the thing [i.e., it’s learnable] to accomplish something [effective] without it being more trouble than it’s worth [efficient].

~ Making your app delightful is a fine objective. Just don’t focus so much attention on it that you forget to make it usable, too.

• delight: fun, surprising, impressive, captivating, clever, and even magical.
• learnability: You need to do better than most, and usability testing will help you figure out how.
• memorability

~ Testing in Mobile

• Use a camera pointed at the screen instead of mirroring.
• Attach the camera to the device so the user can hold it naturally.
• Don’t bother with a camera pointed at the participant.

11. About Usability

~ Building clarity into Web sites: making sure that users can understand what it is they’re looking at—and how to use it—without undue effort.

~ Things that diminish goodwill

• Hiding information that I want.
• Punishing me for not doing things your way.
• Asking me for information you don’t really need.
• Shucking and jiving me.
• Putting sizzle in my way.
• Your site looks amateurish.

~ Things that increase goodwill

• Know the main things that people want to do on your site and make them obvious and easy.
• Tell me what I want to know.
• Save me steps wherever you can.
• Put effort into it.
• Know what questions I’m likely to have, and answer them.
• Provide me with creature comforts like printer-friendly pages.
• Make it easy to recover from errors.
• When in doubt, apologize.

12. About Accessibility

~ Why we need accessibility

• ___% of the population has a disability.
• Making things more accessible benefits everyone.
• It’s the right thing to do.

~ Things we can do

• Add appropriate alt text to every image.
• Use headings correctly.
• Make your forms work with screen readers.
• Put a “Skip to Main Content” link at the beginning of each page.
• Make all content accessible by keyboard.
• Create significant contrast between your text and background.
• Use an accessible template.

如果想更好的理解课堂或者学术会议内容，或者紧跟行业中的最新动态，亦或者想对新领域有所了解，花费大量时间阅读论文变成了一个必修课。而S.Keshav的《How to Read a Paper》可能是最好的入门。这篇不仅提供如何读一篇论文的方法，同时也提供了如何查找一篇论文及写作论文等后续工作的建议。

Three-pass 方法

~ First-pass: A quick scan to get a bird’s-eye view of the paper.

Four Steps

1. Carefully read the title, abstract, and introduction
2. Read the section and sub-section headings, but ignore everything else
3. Read the conclusions.
4. Glance over the references, mentally ticking off the ones you’ve already read

Five Cs:

1. Category: What type of paper is this? A measurement paper? An analysis of an existing system? A description of a research prototype?
2. Context: Which other papers is it related to? Which theoretical bases were used to analyze the problem?
3. Correctness: Do the assumptions appear to be valid?
4. Contributions: What are the paper’s main contributions?
5. Clarity: Is the paper well written?

通过first-pass，判断一篇论文值不值得读:
“This could be because the paper doesn’t interest you, or you don’t know enough about the area to understand the paper, or that the authors make invalid assumptions.”

~ Second-pass: Read the paper with greater care, but ignore details such as proofs.

1. Look carefully at the figures, diagrams and other illustrations in the paper.
2. Remember to mark relevant unread references for further reading

通过second-pass，总结文章主体内容以及相关论据:
“Summarize the main thrust of the paper, with supporting evidence, to someone else”

~ Third-pass: Attempt to virtually re-implement the paper: that is, making the same assumptions as the authors, re-create the work.

Third-pass需要大量时间，对细节进行详尽且具有批判性的论述，同样试着通过这些论证来让读者产出论点。

如何筛选一篇论文（Literature Survey）

1. Use an academic search engine (Google Scholar or CiteSeer)
2. Find shared citations and repeated author names in the bibliography and download the key papers, then go to the websites of the key researchers and see where they’ve published recently.
3. The website for these top conferences and look through their recent proceedings

后续工作

1. If you are reading a paper to do a review, you should also read Timothy Roscoe’s paper on “Writing reviews for systems conferences”
2. If you’re planning to write a technical paper, you should refer both to Henning Schulzrinne’s comprehensive website and George Whitesides’s excellent overview of the process.

Resource

1. ‘How to Read a Paper’ by S.Keshav
2. Feedback from readers of ‘How to read a paper’
3. How to Read a Paper Efficiently (By Prof. Pete Carr)

核心：转换率（conversion rate）

通过跟踪有百分之多少的用户被你“转化”到了下一个步骤，就能衡量你的网站在达到“商业目的”方面的效率有多高。

任何在用户体验上所做的努力，目的都是为了提高效率。这基本上是以两种主要形式体现出来的：“帮助人们工作得更快”和“减少他们犯错的几率”。

5 Plans

图片源于作者博客，根据《用户体验要素:以用户为中心的产品设计(原书第2版)》添加说明。

根据课程《人机交互与用户体验设计》确定，每个部分后面数字表示在教材《人机交互：软件工程视角》豆瓣链接中对应的章节。

1. 初始人机交互和用户体验

1.1 从 HCI 到 UX（1.2）

• 什么是 HCI

  “HCI is a discipline concerned with the design, evaluation and implementation of interactive computing systems for human use and with the study of major phenomena surrounding them.” — ACM SIGCHI

• 什么是用户体验
  “User experience encompasses all aspects of the end-user’s interaction with the company, its services, and its products.”—— Donald Norman

  💡不能够设计用户体验，只能为用户体验而设计
  

• 用户体验设计

  • 借鉴了人机交互、交互设计、视觉设计、信息架构、用户研究等相关学科
  • 主要方法是以用户为中心的设计（User-Centered Design，简称UCD）
  • 没有一种用户体验设计方法是完美

• 用户体验 UX vs. 人机交互 HCI

  User Experience	HCI
  * 广泛的用户基础 * 受业界青睐 * 常见于产品设计、工业设计领域	* 较为学术化 * 常见于计算机专业研究员 * 如今也包含体验的诸多方面

• 交互设计 IxD
  包括：

  • 用户界面设计
  • 软件设计
  • 产品设计
  • 网页设计
  • 体验设计

1.2 为什么要学习 HCI（1.2）

• 人机交互的研究内容
  • 人
    • 对人的感知特性有所了解
    • 如何处理信息？
    • 可能会犯哪些错误？
  • 机器
    • 有哪些特性可供使用？
  • 交互
    • 提供了哪些便利？
    • 受到哪些限制？
    • 怎样在具体设计的时候进行选择？
      
• 人机交互的重要性
  人机交互是一门交叉学科
  

    💡 孤立地从一个学科出发永远不可能设计出一个具有良好用户体验的交互式系统
  

1.3 为什么软件会不好用（2.2）

• 框架
  • 提供理解或定义某种事物的一种结构
  • 能够帮助人们结构化设计过程
  • 认识设计过程中的主要问题
  • 定义问题所涉及的领域
• 执行评估活动周期（Execution-Evaluation Cycle，简称EEC）：交互设计领域最有影响力的框架
  • 目标（Goal） & 意向（Intention）
    • 目标：想做什么
    • 意向：达成目标的一系列活动
  • 执行（Execution）
    • 要实现目标必须进行的操作
  • 客观因素（World）
    • 执行活动时必须考虑的客观条件
  • 评估（Evaluation）
    • 用于衡量活动执行的结果与目标之间的差距
      
• 为什么有些用户界面会给用户带来问题：执行隔阂（gulfs of execution）与评估隔阂（gulfs of evaluation）
  • 执行隔阂（gulfs of execution）
    • 用户为达成目标而制定的动作与系统允许的动作之间的差别
  • 评估隔阂（gulfs of evaluation）
    • 系统状态的实时表现与用户语气之间的差别
• ECC 模型的启发
  • 设计人员要思考如何才能够使用户简单地确定哪些活动是被允许的
  • 确定系统是否处于期望的运行状态等问题

2. 交互设计的原则和目标

2.1 “以用户为中心的系统设计”由来（9.2）

• 相关技术
  • 以用户为中心的系统设计（User-Centered Systems Design, UCSD）
  • 人本中心的系统设计（Human-Centered System Design, HCSD)
  • 用户体验（User Experience, UX）
  • 以用户为中心的设计（User-Centered Design, UCD）
  • 交互设计 （Interaction Design, IxD）
  • 人机交互（Human-Computer Interaction, HCI）
  • 旨在改善人与计算机的交互方式，但研究侧重和范围各不相同
• 用户为中心的设计（用户为中心的系统设计）
  • 该领域的从业人员汲取了人类学、社会学和信息科学等领域的基础研究成果
  • 近年来与人因工效学（Human Factors）、UX、HCI、计算机支持的协同工作、以计算机为媒介的交流信息，以及普适计算等存在相当交集
    • 人因工效学：
      • 目的是使工作环境和工作操作中的安全和健康达到最优，并确保工具、设备还有其他物品的可用性
      • 人因工效学关注的是人与其工作或休闲环境提供良好的“匹配”
• 以用户为中心的设计思想：人类应该被看作是信息系统中最重要的元素，应该被引入设计
  • 包含对用户需求的关注，对活动、任务以及需求的分析，早期的测试和评估，以及迭代式的设计
  • 重点：更加强调用户，而不是关注与征集需求和说明的规范化方法
    • 不是一个死板的设计过程，而是一个更加灵活，迭代式的设计方法
  • 以人为中心的设计则更进一步
    • 不光关注用户与系统的交互，并且还考虑除了与界面或者系统自身直接交互外，系统还可以怎样影响人们的能力和特征
• 用户体验（UX）
  • 用户对于使用或者预期使用产品、系统或服务的感知和反应
  • 用户体验不仅涉及界面设计，还关注人在使用产品前、使用产品时以及使用产品后的心情、信念、喜好、感知、身体和心理的反应、行为以及成就感

  💡经常和可用性交替使用，但是两者的关注点有明显的不同
  ~ 可用性和可用性工程关注的是与任务相关的方面（即完成工作）
  ~ 用户体验与体验设计则将用户的感觉、心情、价值观等放在首位
  

• 人机交互（HCI）
  • 对人（用户）与计算机之间交互方式的研究
  • 涵义较界面设计更加宽泛
  • 根源是社会科学
• 人机交互发展的三股浪潮
  • 第一股浪潮
    • 吸收了认知理论和人因学的观点
  • 第二股浪潮发生在20世纪80年代后期到21世纪早期
    • 关注使用多种应用程序的用户群体，吸收了“情境行为”“分布式认知”以及“活动理论”等多种理论。
    • 在这个阶段“僵化的指导方针、规范化的方法和系统的测试方式”已经不再是主要的关注点，因为人机交互的研究和从业人员已经转向如“参与式的设计研讨会、系统原型和情境问答等各种主动式方法”
  • 第三股浪潮
    • 认识到计算机已经被应用到各种私有和公共领域，从公共场合进入到日常生活，其使用不再具有明确的工作相关性、目的性和合理性。
• 关键技能：确定哪些是核心、主要，哪些是边缘、次要

2.2 可用性 （3.2）

• Affordance：“可供性” 或者 “示能”
  • 指一个物理对象与人之间的关系。该物理对象可以是动物或者人类，甚至也可以是机器和机器人，二者之间发生的任何交互作用。” ——Donald Norman《设计心理学》
  • 示能指所有操作的可能性，而非特定指好的交互操作
• Mental Modal：“头脑模型” 或者 “心智模型”
  • 确定程序充分反映用户关于特定任务的心智模型
• 可用性目标
  
  • 易学性 learnability
    • 指使用系统的难易，即系统应当容易学习，从而用户可以在较短时间内应用系统来完成某些任务
    • 最基本的可用性属性
    • “10 分钟法则”
  • 高效率 efficiency
    • 效率：当用户学会使用产品之后，用户获得的生产力水平
  • 易记性 memorability
    • 用户在学会使用软件后应当容易记忆
    • 对偶尔使用的用户，也能够借助一些简单提示即能够使用系统，而不用一切事情从头学起
    • 影响因素：
      1. 位置：将特定对象放在固定位置
      2. 分组：对事物按照逻辑进行恰当的分组
      3. 惯例：尽可能使用通用的对象或符号
      4. 冗余：使用多个感知通道对信息进行编码
  • 低出错率 （low error rate）
    • 与计算机不同，人是会犯错误的
      • 有些错误会被用户发现并纠正
      • 有些错误会带来灾难性后果
    • 措施
      • 保证导致灾难性后果错误的发生频率降到最低
      • 保证错误发生后迅速恢复到正常状态
  • 主观满意度（satisfaction）
    • 用户对系统的主观喜爱程度
    • 某些情况下，系统的娱乐价值比完成任务的速度更为重要（如家用计算、游戏等非工作环境的系统）
• 可用性
  • 是衡量交互式系统质量的一种重要度量
  • 体现了软件质量观念的转变
    • 传统软件质量观
      • 侧重内部效率和可靠性
      • 如程序代码运行时的效率以及灵活性、可维护性
    • 人机交互软件质量观
      • 转向用户视角

2.3 可用性工程（Usability Engineering）(3.3)

• 关键步骤
  • 了解用户
  • 竞争性分析
  • 设定可用性目标
  • 用户参与的设计
  • 迭代设计
  • 产品发布后的工作
• 简易可用性工程（DUE: Discount Usability Engineering）
  • 步骤
    • 用户和任务观察
      • 了解产品的目标用户

        ⚠️ 注意
          - 要直接与潜在用户进行接触，不要满足于间接的接触和道听途说
          - “你”不是用户
          - 不要“闭门造车”
      

    • 场景（scenario）
      • 简便易行的原型工具，可节省时间和成本
      • 作用：
        • 在界面设计过程中可以把场景作为用户最终如何与系统进行交互的描述手段
        • 在用户界面设计的早期评估阶段，可以在没有实际可运行原型的情况下通过场景来获得用户的反馈
    • 边做边说
      • 最有价值的单个可用性工程方法
      • 让真实用户在使用系统执行一组特定任务的时候，讲出他们的所思所想
      • 可了解用户为什么这样做，并确定其可能对系统产生的误解
      • 对用户而言不是那么自然，因而实验人员需要不断地提示用户，或请他们事先观摩测试案例
    • 启发式评估
      • Jakob Nielsen等人开发的非正式可用性检查技术
      • 过程
        • 专家使用一组称为“启发式原则”的可用性规则作为指导，评定用户界面元素（如对话框、菜单、导航结构、在线帮助等）是否符合这些原则
      • 启发式规则不是一成不变的
        • 评估不同的设备，如玩具、WEB应用、可穿戴计算设备等，需要根据设计原则、市场研究和需求文档，相应地修改相关原则
          
          其中：
          1. N 是设计中存在的可用性问题的总数，L 是单个参与者所能够发现的可用性问题的比例 （经验取值约为31% ）
          2. 5 名专家能够发现约 80% 的可用性问题，被认为是最恰当的可用性测试用户数量
          3. 若用户数量较多，建议将测试分阶段进行

2.4 设计的基本原则 （3.4）

• 标准与原则
  • 标准
    • 由专家制定的，汲取了研究领域中公认的知识和最好的实践。
  • 原则
    • 不仅详细列举了那些可以支持设计决策的一般性理论想法，还能够解释为什么有些产品是成功的，以及可能是什么原因导致了产品的不成功，相较而言更具宽泛性。
    • 理想情况下，原则都是以基于大量数据的采集和测试中得到的理论观点为基础的。
• 代表原则
  • Alan Dix（基本规则）
    • 可学习性：新用户能用它开始有效的交互并能获得最大的性能
    • 灵活性：用户和系统能以多种方式交换信息
    • 健壮性：在决定成就和目标评估方面对用户提供的支持程度
  • Ben Shneiderman：黄金规则
    • 尽可能保持一致
    • 符合普遍可用性
    • 提供信息丰富的反馈
    • 设计说明对话框以生成结束信息
    • 预防并处理错误
    • 让操作容易撤销
    • 支持内部控制点
    • 减轻短时记忆负担
  • Donald Norman:
    • 应用现实世界和头脑中的知识
    • 简化任务结构
    • 使事情变得明显
    • 获得正确的映射
    • 利用自然和人为的限制力量
    • 容错设计
    • 当所有都不成功时进行标准化
  • Nielsen and Molich: 启发式（Heuristics）规则
    1. 系统状态的可见度
       • 系统应该始终在合理的时间以适当的反馈信息让用户知道系统正在做什么
    2. 系统和现实世界的温和
       • 告诉用户他们可以做什么；阻止受限制的操作
    3. 用户享有控制权和自主权
       • 对于因错误而做出的选择，提供一种“返回方法”［如撤消或重做］，或者重新启动的方法［如网站上的返回主页］
    4. 一致性和标准化
       • 不要在不同的地方为同一个功能使用多个概念或名称
       • 提示符、菜单和用户手册的术语要保持一致
       • 使用没有歧义的图标或图像
       • 在整个应用程序使用一致的颜色、布局、大小写和字体
    5. 避免出错
       • Avoid possibility for users to make errors
    6. 依赖识别而非记忆
    7. 使用的灵活性和高效性
       • 对于新手用户，提供简单（但流程较长）的交互操作
       • 对于高级用户，提供快捷键，宏操作等
       • 充分考虑不同类型用户的使用偏好
    8. 审美感和最小化设计
       • Do not put too much, irrelevant information in Dialog boxes
       • Use standard and commonly accepted controls (sliders, buttons etc.)
       • Select fonts/sizes that are suited for screen display to maximize readability
    9. 帮助用户识别、诊断和恢复错误
       • 错误信息应该用简单的语言表达（没有代码），准确指出问题所在，并建设性地提出解决方案。
    10. 帮助和文档
        • Must provide help/manual/user-guide
        • Language and format of User-guide should use simple, standard terminology

3. 如何定义交互系统的需求和用户

3.1 交互需求的差异（5.2，5.3）

• 不论初始情形如何、项目的目标是什么，都需要讨论、提炼、澄清用户的需要、需求、以及期望
• 了解用户及其对产品的使用能力，产品相关的所有目标，产品的使用条件，和产品性能需求等
• 需求获取是项目设计的第一个阶段
  • 关于自标产品的一种陈述，它指定了产品应做什么，或者应如何工作
  • 应该是具体、明确和无歧义的
    • “完整下载任何网页的时间应少于5秒”：具体的需求“
    • 女孩们应觉得这个网站吸引人”：不具体的需求
• 交互需求的差异
  • 产品自身决定
  • 用户群体决定
• 产品特性差异
  • 功能不同
  • 场景因素
  • 非功能需求
    • 交互式设备涉及许多类型的非功能需求：如大小、重量、颜色、有效性等
  • 环境因素
    • 设备环境（物理环境）：所处的物理环境可能会影响交互范围的选择
    • 社会环境： 需要考虑协作和协调等社会因素
    • 组织环境：用户支持的质量、响应速度如何？是否提供培训资源或设施？
    • 技术环境： 产品应能运行于何种平台上？应与何种技术兼容？
• 需求验证：迭代式
  • 检查获取的需求是否真的符合用户的要求
  • 原型的优点
    • 能够给用户一个更加直观的产品形象
    • 是用户乐于接受并愿意与设计人员合作的一种需求验证方式
    • 特别对交互方面的需求验证，原型可谓最为恰当的验证工具
  • 原型的重要性
    • 用户往往不能准确描述自己的需要
    • 用户在看到或尝试某些事物后，就能立即知道自己不需要什么
    • 原型可用于检查需求获取结果是否存在偏差
    • 对设计方案也有很好的验证效果
  • 原型分类（5.6.5）
    • 低保真原型：多数项目的首选
      • 定义：与最终产品不太相似的原型；使用与最终产品不同的材料
      • 优点：简单、快速、便宜、易于制作和修改
      • 常见形式：草图、故事板、绿野仙踪法
    • 高保真原型：
      • 定义：与最终产品更为接近，使用相同的材料
      • 缺点：制作时间长，难以修改
      • 风险：用户会认为原型就是系统，开发人员可能认为已找到了一个用户满意的设计

3.2 用户的差异（5.4）

• 背景
  • 任何一款交互式计算系统其所面对的用户都是成干上万，上百万，上千万的。而这数以干万计的用户并不是完全相同的。
  • 设计人员应该意识到个体的差异并在设计中尽可能地体现这些差异。
  • 长期差异：性别、身体能力、智力
  • 短期差异：压力、疲劳
  • 年龄：随着时间变化
• 计算机操作水平的差异
  • 新手用户
    • 特点：敏感，且很容易在开始有挫折感
    • 设计要求
      • 不能将新手状态视为目标
      • 让学习过程快速且富有针对性
      • 确保程序充分反映了用户关于任务的心智模型
      • 无论什么样的帮助，都不应该在界面中固定
      • 具有向导功能的对话框在不需要帮助的时候消失
  • 中间用户：数目最多、最稳定和最重要的用户群是中间用户（或称主流用户）
    • 特点
      • 高级特性的存在会使其放心
      • 能够区分经常使用和很少使用的功能
      • 高级功能的存在让永久的中间用户放心
    • 设计需求
      • 常用功能放在用户界面的前端和中心位置
      • 工具提示（Tooltip）是适合中间用户最好的习惯用法
      • 提供高级功能特性，即便不需要
  • 专家用户
    • 特点
      • 对缺少经验的用户有着异乎寻常的影响：”专家说不好就不好”
      • 欣赏更新的且更强大的功能
      • 不会受到复杂性增加的干扰
    • 设计要求
      • 对经常使用的工具集，要能快速访问（提供快捷方式）
  • 存在的问题：程序员只创造适合专家的界面，而市场人员要求只适合新手的交互
  • 目标
    • 让新手快速和无痛苦地成为中间用户；
    • 避免为那些想成为专家的用户设置障碍；
    • 让永久的中间用户感到愉快
• 年龄差异：感知、身体和认知
  • 老年用户
    • 误解：老年人缺乏对新技术的热情
    • 事实：老年人有更多空闲时间和可花费的收入——市场巨大
    • 技术应能提供对缺失能力的支持
    • 设计必须清楚、简单并且容许出错
    • 信息访问应该采用多种方式（冗余）
  • 儿童用户
    • 他们有自己的目标、喜好和憎恶
    • 在为儿童设计交互式系统时让他们参加很重要
    • 允许多种输入模式（包括触觉或手写）
    • 通过文本、图形和声音呈现信息的冗余显示也将增强他们的体验
• 文化差异：语言、文化符号、姿势和颜色
  • 在不同的文化中符号有不同的意思
    • 勾（√）和叉（X）分别表示肯定和否定
    • 不能假设每个人都以同样的方式解释符号
  • 姿势的理解存在差别
    • 点头 vs. 摇头
  • 颜色的使用
    • 通过冗余阐明特定颜色的指定意义
    • 切忌在界面上仅以颜色作为信息区分的标志
• 健康差异
  每个国家至少有 10% 的人口有残疾
  • 视觉损伤
    • GUI 应用的增加将阻碍视觉损伤用户的使用
    • 辅以声音的应用和触觉的应用（Hearme，seeing AI）
  • 听觉损伤
    • 较视觉残疾对与图形界面交互的影响要小
    • 给听觉内容加文字描述
    • 姿势识别可作为信息输出方式
  • 身体损伤
    • 身体损伤导致的肢体控制问题，语言表达能力的损伤

3.3 理解用户 （2.4）

• 人类处理机模型 Model Human Processor
  • 最著名的信息处理模型，描述了人们从感知信息到付诸行动的认知过程
  • 三个交互式组件
    • 感知处理器：信息将被输出到声音存储和视觉存储区域
    • 认知处理器：输入将被输出到工作记忆，能够访问工作记忆和长时记忆中的信息
    • 动作处理器：执行动作
      
  • 用途
    • 人机交互本质上也可以被看作是一个信息处理过程
      • 在进行界面设计时，可将与人的信息处理能力相关的知识和理论作为参考
      • 可评估完成不同任务所需的认知要求
      • 可预测不同界面下任务的完成效果
• 人脑的记忆结构
  
  • 感觉记忆
    • 又称瞬时记忆在人脑中持续约为1秒钟
    • 作用：把相继出现的一组图片组合成一个连续的图像序列，产生动态的影像信息
  • 短时记忆
    • 感觉记忆经编码后进入短时记忆（Short-Term Memory，STM）
    • 又称工作记忆，约保持30秒
    • 储存的是当前正在使用的信息，是信息加工系统的核心，可理解为计算机的内存
    • 容量
      • 实验证明，人的短时记忆的存储容量大约为 个信息单元，这一发现被称为 理论，有时也被称为“MAGIC NUMBER”
      • 通过将信息组合成一个个有意义的单位可以帮助我们记住复杂的信息
      • 正确理解 理论
        • 界面设计时要尽可能减小对用户的记忆需求，同时可考虑通过将信息放置于一定的上下文中，来减少信息单元的数目
        • 对命令行界面设计非常有用
  • 长时记忆
    • 短时记忆 -> 长时记忆
      • 短时记忆中的信息经进一步加工后会变为长时记忆；
      • 只有与长时记忆区的信息具有某种联系的新信息才能够进入长时记忆；
    • 长时记忆的信息容量几乎是无限的
    • 启发：注意使用线索来引导用户完成特定任务在追求独特的创新设计时也应注重结合优秀的交互范型
    • 遗忘
      • 短时记忆中的信息经进一步加工后会变为长时记忆不代表长时记忆区的信息丢失了
      • 可能失去了提取信息的途径，或原有联系受到了干扰
• 视错觉
  • 知觉感受的扭曲
    • 前后景互换实际上就是视错觉的一种
  • 视错觉是不可避免的
  • 启示：对于物体的视觉感知与物体所处的上下文密切相关

3.4 格式塔（Gestalt）心理学（2.4.2）

• 认知心理学（Cognitive Psychology）
  • 有助于理解人与计算机的交互过程，同时也可对用户行为进行预测
  • 人对于外界的感知有 80% 来自于视觉获取的信息
• 格式塔心理学 (Gestalt)
  • 研究人是如何感知一个良好组织的模式的，而不是将其视为一系列相互独立的部分一 事物的整体区别于部分的组合
  • “GESTALT”一德语，“完形（configuration）”或“型式(pattern) “
  • 格式塔心理学又称完形心理学
  • 表明：用户在感知事物的时候总是尽可能将其视为一个”好”的型式
• 主要原则
  • 相近性原则
    • 空间上比较靠近的物体容易被视为整体
      • 设计界面时，应该照相关性对组件进行分组
  • 相似性原则
    • 人们习惯将看上去相似的物体看成一个整体
      • 功能相近的组件应该使用相同或相近的表现形式
  • 连续性原则
    • 共线或具有相同方向的物体会被组合在一起
      • 将组件对齐，更有助于增强用户的主观感知效果
  • 对称性原则
    • 相互对称且能够组合为有意义单元的物体会被组合在一起
  • 完整性和闭合性原则
    • 人们倾向于忽视轮廓的间隙而将其视作一个完整的整体

3.5 如何构建人物角色（5.5）

• 什么是人物角色
  • 交互设计中的问题：似乎每个调研到的用户都略有差异，如何满足所有用户的需要？
  • 人物角色 （Personas）
    • 不是真实的人
    • 基于观察到的真实人的行为和动机，并且在整个设计过程中代表真实的人
    • 是在人口统计学调查收集到的实际用户的行为数据的基础上形成的综合原型
• 人物角色的构建
  • 理想过程
    
    • 现实情况
      • 跟用户说什么
      • 提什么问题
      • 应该怎样进行对话

        ⚠️ 注意：过分依赖用户或者怀疑用户都不会带来最好的设计
        

    • 方法
      • 从构思带有少量细节的候选角色着手，将类似或相关角色归到一组，然后再填充细节

        ⚠️ 注意：要特别关注使角色之间彼此相区别的那些特征
        

• 人物角色包含的内容
  • 姓名、年龄、性别和照片。
  • 关于他们在“现实生活”中所做事情的描述。
  • 他们在产品或服务领域的经验水平。
  • 他们将如何与你的产品互动，以及他们使用产品的频率。
  • 他们执行相关任务时的目标和关注点：速度、准确性、彻底性或任何其他可能影响他们使用的需求。
  • 引用用户的话来总结该人物角色的态度。
• 人物角色的作用
  • 弹性用户
    • 产品团队的每一个人都有对用户及其需要的不同理解，这种不确定性会使产品变成“四不像”
    • 如设计医院产品时，考虑设计能够满足所有护士的产品
  • 自参考设计
    • 设计者或者程序员将其自己的目标、动机、技巧及心智模型投射到产品的设计中
    • 非程序员用户通常难以理解产品的工作方式
  • 边缘情况设计
    • 边缘情况指的是一定会发生，但通常不会发生在人物角色上的情况
    • 必须考虑边缘情况，但它们又不应该成为设计的关注点

3.6 基于人物角色和场景交互需求定义（5.6.3）

• 人物角色 + 场景剧本 → 需求
  需求定义的 5 个步骤（迭代）
  1. 创建问题和前景综述
     • 问题综述：定义了设计的目标
       • 应该简明反映需要改变的情况，来服务人物角色和提供产品给人物角色的商业组织
     • 前景综述高层次的设计视图是问题综述的倒置
       • 从用户需要开始，转向如何用设计视图来满足商业目标

         ⚠️ 注意
           - 问题和前景综述直接从研究和用户模型中获得
           - 用户目标和需求应该从焦点和次要人物角色中推导出
           - 商业目标应该从利益相关人的访谈中获得
         

  2. 头脑风暴
     • 在创建情境场景剧本时，需要摒弃头脑中先入为主的偏见和成见
     • 开展头脑风暴的原因
       • 将头脑置于“解决问题模式”
       • 不受约束且不加以评判
       • 将所有想法表达出来，并整理记录下来
     • 头脑风暴的时间
       • 不要花费太多时间
       • 当想法开始重复或出现得越来越慢时停止
  3. 确定人物角色的期望
     • 心智模型 Mental Model
       • 一个人思考或者解释事务的方法，是其对外部现实的内部表达
       • 一个人的心智模型通常是根深蒂固的
       • 人们对产品的期望和对产品工作方式的想象大部分来自于他们的心智模型
     • 界面表现模型与用户心理模型尽量匹配是非常重要的
     • 理清如下问题
       • 理解人物角色目标、经历、渴望，以及其他社会、文化、环境和认知因素
       • 人物角色在使用产品体验方面可能有的一般期待和愿望
       • 人物角色对产品行为的期待和愿望
       • 人物角色关于该领域下基本数据单元或者元素的认知
  4. 构建情境场景剧本
     • 情境场景剧本
       • 关注人物角色的活动，及其心理模型和动机
       • 将注意力集中在设计的产品中怎样能够最好地帮助你的人物角色达到目标
       • 专注于高层次的从用户角度描述的行动，做到广而浅
         • 不应描述产品或交互的细节
         • 专注于高层次的从用户角度描述的行为
       • 与人物角色不是一对一的关系
         • 大多数时候可能不止需要一个情景场景剧本，尤其是当有多个首要人物角色时，但有时单个首要人物角色也可能有两个或者多个不同的使用场景。
  5. 确定需求
     • 直接提取需求
     • 分别提取数据和功能需求
       • 数据需求：必须在系统中被描述的对象和信息
       • 功能需求：系统对象必须进行的操作
       • 其他需求：开发时间表、产品价格、重量等

4 如何开展交互设计

4.1 交互设计的活动和步骤（6.2）

• 过早地把重点放在小细节、小部件和精细的交互上会妨碍产品的设计
  • 先站在一个高层次上关注用户界面和相关行为的整体结构（设计框架）
• Allan Cooper 定义的交互框架
  1. 定义外形因素和输入方法
     • 外形因素：设计什么样的产品
     • 产品输入方法
  2. 定义功能和数据元素
     • 在需求定义阶段确定的，需要按照用户界面的表现语言来描述
     • 数据元素
       • 交互产品中的基本主体，是能够被用户访问和操作的基本个体
       • 如相片、电子邮件、订单
       • 数据元素应符合人物角色的心理模型
       • 考虑数据元素之间的关系也很有用
     • 功能元素
       • 对数据元素的操作及其在界面上的表达
       • 对数据元素操作的工具，以及输入或者放置数据元素的位置
  3. 决定功能组合层次
     • 目的：更好地在任务中和任务间来帮助促进任务角色的操作流程
     • 需考虑的问题
       • 哪些元素需要大片的视频区域
       • 容器如何组织才能优化工作流
       • 哪些元素是被一起使用的
         • 一个过程的多个步骤
       • 产品平台、屏幕大小、外形尺寸和输入方法的影响
  4. 勾画大致的设计框架
     
     • 对界面布局进行粗略的描述最初阶段：界面的视觉化工作应该非常简单
     • 方块图
       • 用粗略的方块图来表达并区分每个视图
       • 方块图对应窗格、控制部件为每个方块图添加上标签和注解
       • 为每个方块添加上标签和注解
     • 注意：不要被界面上某个特殊区域的细枝末节分散了精力
  5. 构建关键情境场景剧本
     • 描述了人物角色最频繁使用界面的主要路径
       • 重点在任务层
       • 举例：电子邮件应用中关键线路的活动主要包括读和写邮件，而不是配置邮件服务器
     • 注意事项
       • 必须在细节上严谨地描述每个主要交互的精确行为，并提供每个主要线路的走查
       • 可使用低保真草图序列的故事板进行描述
  6. 通过验证性的场景剧本来检查设计
     • 验证性的场景剧本不用具备很多细节
       • 但包含一系列“如果怎样，将怎样”的问题
       • 目标是对设计方案指点，并根据需要进行调整
     • 三种验证性的场景剧本
       • 关键线路的变种场景剧本
         • 关键途径的替换
       • 必须使用的场景剧本
         • 必须要执行但又不是经常发生的情况
       • 边缘情形使用场景剧本
         • 非典型情形下产品必须具备，但不太常用的功能
  • 视觉设计框架
    • 确定界面使用的颜色、风格、小组件 （widget）
    • 整体的外形尺寸等
  • 工业设计框架
    • 原型产品的构建
    • 输入方法方面的研究工作

4.2 如何简化交互设计（6.3）

• 简化设计的四个策略

  1. 删除：（最明显的简化设计方法）删除不必要的
     删除什么？：

     • 功能相关：
       • 按照优先级对功能进行排序：关系到用户日常使用体验的功能最有价值
       • 开发团队有限，要尽力保证这部分功能的正常交付
       • 以用户为中心并不意味着要满足所有用户的需求，并获取用户的欢心。而是能给大部分用户一个良好的体验：通过人物角色（Personas）确定
       • 删除可能出现错误的情况
     • 删除视觉混乱
       • 通过删除多余文字，能加速用户的阅读速度，还能让重要的内容变得“水落石出”。
       • 通过删减界面上可能引起视觉混乱的情况，也可以有效减少用户必须处理的信息，从而集中主意力在真正重要的内容上，使得“数据墨水率〞越来越高。
       • 方法：
         • 使用空白或轻微的背景色对界面内容进行分割，少使用线条和各种强调效果；
         • 合理控制信息的显示层次，减少界面元素的大小和形状变化等。

       ⚠️ 注意
         - 问题和前景综述直接从研究和用户模型中获得
         - 用户目标和需求应该从焦点和次要人物角色中推导出
         - 商业目标应该从利益相关人的访谈中获得
     

  2. 组织：组织要提供的

     按照有意义的标准对界面组件进行分组：最快捷的简化设计方式

     • 分块
       • 通过分块可以把繁琐的功能组织成清晰的层次结构
       • 格式塔心理学： 法则
       • 名词：可以按字母表、时间或空间顺序排列的清单
     • 清晰的信息分类标准
       • 切忌从开发人员的视角进行思考
         • 以免设计出不符合用户视角的难以使用的产品
     • 利用不可见的网格进行组织
       • 布局对于设计能否让用户感觉简单十分重要
     • 搜索与页面组织
       • 错误观点
         • 既然有搜索，那么设计者不需要花费过多时间对界面内容进行组织
       • 实际情况
         • 用户只有在缺乏有效导航的情况下才会使用搜索
         • 实现高效搜索功能比组织页面内容困难得多
       • 结论
         • 先对内容进行有效组织
         • 然后再考虑如何设计搜索

       ⚠️ 注意：千万不要被自己规划图中清晰的线条和整洁的布局所迷惑
     

  3. 转移：各司其职

     • 目的：
       • 将功能以最恰当的方式实现
       • 可以是不同设备或平台之间的转移
       • 也可能是设备和用户之间的转移
     • 设备之间的转移
       • 开发不同终端产品时，没有必要完全复制另一端的所有功能
     • 向用户转移
       • 要求用户以计算机易于处理的方式去制定一个精确计划，则很容易使得项目失败
         • 搞清楚工作适合交给计算机，什么工作适合留给用户

4.3 设计体贴的软件（6.5）

• 如何做一个体贴的产品：
  • 效仿一个关心他人的人是如何和别人打交道的
• 体贴的软件是自信的
  • 当用户提出请求时，体贴的软件不仅不应该怀疑用户的请求，同时应该为可能发生的错误做好准备
    • 比如恢复已经删除的文件等
• 软件使用与人的记忆|
  • 为了能够使用软件完成任务，必须记住的两类信息或知识
    • 和软件如何操作相关的内容
      • 比如应当选择哪个命令或操作、文件存在哪个目录、如何去执行某个操作、其对应的快捷键是什么等
    • 和该任务所需的领域知识相关
      • 比如特定编程语言的语法规则、可供使用的标准库函数，这些函数的参数和返回值是什么；普通用户必须记住的网站名称或地址等。
• 体贴的软件会怎么做
  • 赋予产品了解用户行为的能力，记忆并灵活地根据用户之前的行为显示信息和功能
  • 一个简单的原则
    • 如果信息值得用户输入，那么就值得程序记住它们，并在下一次使用时作为默认值
    • 如果这不是用户所希望的，可以让用户纠正
• 减少用户的等待感
  • 今天的用户大多是缺少耐心的消费者，作为软件设计人员应当设法减轻用户的等待感
    • 可以以某种形式的反馈让用户了解操作进行的进度和状态
    • 或者以一种渐进的方式来把当前已完成的处理结果提供给用户
    • 或者给用户分配一些任务，从而分散他的注意力
• 出错信息的设计
  • 用户希望避免错误造成的结果，而不是错误信息
  • 好的出错信息应当遵循以下四个简单原则
    1. 使用清晰的表达语言，而非难懂的代码
    2. 语言应当精炼准确，而非空泛而模糊
    3. 对用户解决问题提供建设性的帮助
    4. 出错信息应当有好，不要威胁或责备用户
• 错误回复机制
  • 允许用户撤销错误命令产生的结果
  • 允许编辑并重新提交以前的命令，而不用从头输入等
• 设计提示
  • 设计的时候更多站在用户的视角思考
  • 通过参与式设计获取用户对特定任务的表征
  • 多次迭代的用户测试

4.4 有用的交互设计模式（6.6）

• 交互设计模式：
  • 不仅仅涉及结构和元素组织，还关注响应用户活动的动态行为与变化

    💡 交互设计模式“是从过去已证明成功的实例中学习的”，是“获得以及重新应用已有知识的一种方案”。 ——Alan Dix
  

• 模式的讨论
  • 设计模式能够帮助提供有价值、有用的设计思路
• 模式不是即拿即用的商品
  • 每一个设计仍然需要创造性和直觉

5. 如何对交互性能进行评估

5.1 为什么要进行评估（10.2）

• 邀请用户进行评估的目的不是设法理解用户，而是特定用户在特定环境背景下如何使用系统来执行特定任务。
• 有一些设计人员错误地认为他们自己能够准确地了解用户工作的方式，然而在实际观察用户操作时就会发现，用户可能会很有创意，并且使用设计人员从未考虑过的方式来使用系统。
• 评估有助于达成的目标
  • 评估系统功能的范围和可达性
    • 不仅包括具有合适的功能，也包括使用户能清晰地意识到需要执行任务的一系列行为，还包括将系统的应用与用户对任务的期望相匹配
  • 评估交互中用户的体验
    • 特别对休闲和娱乐系统而言，这一目标就更为重要
  • 确定系统的某些特定问题
    • 如用户是否能准确定位到特定菜单项，页面文字显示是否具有良好的可读性等
• 原则：
  • 最具权威性的评估不应该依赖于专业技术人员，而应该依赖于产品的用户：对软件交互性能的评估，主要应有用户来完成
  • 评估与设计应结合进行
    • 交互评估是一个过程，这个过程早在产品的初始阶段就开始了。因此一个软件在设计时反复征求用户意见的过程应与交互评估的过程结合起来进行。在设计阶段反复征求意见的过程是评估的基础，不能取代真正的评估。
    • 仅靠用户最后对产品的一两次评估，是不能全面反映出软件的可用性的。
  • 交互性能评估应该在用户的实际工作环境下进行
    • 交互评估不能靠发几张调查表，让用户填写完后，经过简单的统计分析就下结论
    • 必须在用户实际操作以后，根据其完成任务的结果，进行客观的分析和总结
    • 如果能够在用户的实际工作环境中开展测试可能会得到更为实用的结果
  • 要选择有广泛代表性的用户
    • 参加测试的人必须具有代表性

      ⚠️ 注意：
          - 尽早测试、经常测试
          - 快速但存在瑕疵的测试好过什么都没有做的测试
  

5.2 评估实验的规划（10.5）

• DECIDE 评估框架
  1. 确定（Determine）：评估需要完成的总体目标
     • 检查设计人员是否理解了用户需要；
     • 确保最终界面满足一致性要求；
     • 调查新技术的引入对用户工作的影响；
     • 决定如何修改已有产品的界面，以提高可用性。
  2. 发掘（Explorer）：需要回答的具体问题
  3. 选择（Choose）：用于回答具体问题的评估范型和技术
     • 定性数据（陈述性数据）
     • 必须权衡实际问题和道德问题
       • 最适合的技术可能成本过高，或所需时间过长，或不具备必要设备和技能
     • 可结合使用多种技术
       • 不同技术有助于了解设计的不同方面不同类型数据可从不同角度看待问题组合有助于全面了解设计的情况
  4. 标识（Identify）：必须解决的实际问题，如测试用户的选择
     • 明确实际问题
       • 用户：先做小规模测试确定用户技能所属的用户群
         • 类型：
           • （如新手和专家）具备不同技能的用户
           • 年龄
           • 性别
           • 文化
           • 教育程度
           • 个性
         • “如何让用户参与“
           • 稍事休息和走动
           • 努力消除用户的焦虑
           • 支付报酬，有礼貌
           • 在任务执行前，安排用户熟悉系统
       • 设施及设备
         • 所有实验设备运转正常、电量充足、项目期限以及经费预算
       • 期限及预算
       • 评估人员的专门技能
  5. 决定（Decide）：如何处理有关道德的问题
     • 应保护个人隐私
       • 除非获得批准，书面报告不得提及隐私（姓名、健康、雇佣情况、教育、财务、居所）
       • 评估前签署协议书（IRB）
     • 指导原则
       • 向参与者明确说明研究的目的以及参与者需要做的工作。
       • 向用户说明他们提供的地址、财务、健康或其他敏感资料属于机密。
       • 向用户说明测试的目的是对软件进行评价而不是对用户个人进行测试。
       • 向用户说明关于实验的任何特殊要求。
       • 实验人员应该告知用户自身与待测系统没有关系。
       • 尽量不摄录用户的面部，以减轻他们对录像的忧虑
       • 欢迎用户提问
       • 在可能情况下，应支付用户费用以建立正式的合作关系，并明确双方的义务和责任。
       • 说明参与测试是自愿行为。
       • 避免在引用和描述时无意中透露用户身份。
       • 征得用户同意以后才能引用用户的话语，且引用过程只能以匿名方式进行。在正式报告发布之前，应为用户提供报告副本
       • 牢记“己所不欲，勿施于人”的一般原则。
  6. 评估（Evaluate）：解释并表示数据
     • 可靠性
     • 有效性
     • 偏见
     • 适用范围
     • 环境影响
       • 霍桑效应（Hawthorne Effect）
         它描述了在进行观察或实验时，研究对象会表现出与他们平常行为不同的行为。具体来说，霍桑效应通常表现为当人们知道自己正在被观察或参与实验时，他们可能会改变他们的行为，通常是表现得更加积极或更加注意，以满足观察者的期望或要求。
• 小规模试验：可能会有多次试验
  • 测试评估计划
  • 避免问题：
    • 含糊不清的指令
    • 错误的时间估计
    • 模糊的任务完成标准
    • 问卷中带有误导性的问题
    • 设备使用中的一些问题
    • 练习访谈技巧

5.3 评估范型及选用（10.3）

• 评估范型（Evaluation Paradigm）

  • 在使用具体的评估方法前通常需要先考虑最适宜的评估范型，同时需要注意到每种范型都有自身的长处和短处，且并不一定适用于所有类型的系统。

  • 分类

    • 快速评估（Fast Evaluation）：可在短时间完成
      • 设计人员非正式地从用户或顾问获得反馈信息，以验证设计构思是否符合用户需要，以及是否能够令用户满意。
      • 适用于所有阶段
        • 设计初期：与用户进行非正式接触了解用户对新产品的意见
        • 设计末期：了解用户对图标设计的看法
      • 得到的信息通常是非正式、叙述性的
        • 口语
        • 书面笔记
        • 草图
        • 场景
    • 可用性测试（Usability Testing）
      • 基于特定任务场景记录用户的出错次数、完成任务的时间等
      • 根据这些观察数据计算执行任务的时间、出错次数，甚至分析用户的行为及其原因
      • 基本特征
        • 实验是在评估人员的密切控制之下实行的
        • 用户不会受到干扰
      • 主要任务：获得用户执行情况的量化数据
    • 现场研究（实地研究，Filed Study）
      • 基本特征
        • 在自然工作环境中进行
      • 目的
        • 理解用户实际工作情形以及技术对他们的影响
      • 优势：
        • 告诉人们是如何真正工作的
      • 缺点
        • 难以根据实际情况来控制实验过程
        • 难以侧重于任务变量之间的关系
      • 适用范围：
        • 往往用于非安全攸关的系统
    • 预测性评估（Prediction Evaluation）
      • 预测性评估中，一方面评估专家们可以根据自己对典型用户的了解来预测产品中可能存在的可用性问题；另一方面也可以基于已有理论模型得出评估结论。
      • 基本特征
        • 用户可以不在场
        • 整个过程快速、成本较低
      • 缺点
        • 专家可能存在个人偏见
    • 各种评估范型的特征

    评估范型	快速评估	可用性测试	现场研究	预测性评估
    用户角色	自然行为	执行测试任务集	自然行为	通常不参与
    控制权	评估人员实施最低限度控制	评估人员密切控制	评估人员与用户合作	评估人员为专家
    评估地点	自然工作环境或实验室	实验室	自然工作环境	类似实验室的环境，通常在客户处进行
    适用情形	快速了解设计反馈。可使用其他交互范型的技术，如启发式评估	测试原型或产品	常用于设计初期，以检查设计是否满足用户需要 ，发现问题，发掘应用契机。	使用启发式评估的原型测试，可在任何阶段进行；模型可用于评估潜在设计的特定方面
    数据类型	通常是定性的非正式描述	定量数据，有时是统计数据。可采用问卷调查或访谈搜集用户意见	应用草图、场景、例证等的定性描述	专家们列出问题清单，由模型导出量化数据（如两种设计的任务执行时间）
    反馈到设计	通过草图、例证、报告	通过性能评估、错误统汁报告等为未来版本提供设计标准	通过描述性的例证、草图、场景和工作日志	专家列出一组问题，通常附带解决方案建议。为设计人员提供根据模型计算出的时间值
    基本思想	以用户为中心，非常实用	基于试验的实用方法，即可用性工程	可以是客观观察或现场研究	专家检查以实用的启发式原则和实践经验为基础，采用基于理论的分析模型

• 评估技术

  • 观察用户
    • 用途
      • 有助于确定新产品的需求
      • 也可用于评估原型
    • 输出：笔记、录音、录像和交互日志
    • 挑战：
      • 不干扰用户的前提下观察用户
      • 分析大量数据
  • 询问用户意见
    • 访谈和调查问卷
  • 询问专家意见
    • “角色扮演〞的方法，模拟典型用户执行任务的情况，并从中找出潜在问题。
    • 优势：
      • 成本较低
      • 快速完成
  • 用户测试
    • 通过测量用户执行任务的情况，比较不同的设计方案通常在受控环境中进行
  • 基于模型的分析和评估
    • 用于在设计初期（即制作复杂原型之前）预测设计的有效性，找出潜在的设计问题。
    • 常用技术
      • GOMS 模型
      • 按键模型

• 常用组合

  • 启发式评估+边做边说
  • 排除显而易见的可用性问题重新设计后，经用户测试，反复检查设计的效果
  • 选择理由
    • 经验性评估不需要用户参与就可以发现并消除系统或产品中存在的许多可用性问题。
    • 这两大类可用性评估方法所发现的可用性问题有明显的不同，这意味着两种方法可以互补而不会重复。
  • 访谈和问卷调查
    • 通过对一小部分用户进行开放式访谈，来明确定义封闭式问卷中的具体问题

5.4 评估的对象（5.6.5）

• 在开发过程中进行评估时会先使用某种原型然后在系统到一定程度后再对整个系统进行评估
• 纸质原型法非常经济适用于设计的初期阶段
  • 收集到的数据一般是定性而非定量的， 其结果只是指导设计
• 基于计算机的原型
  • 目前有很多工具可以在多各层次来构建原型，包括从草图原型到交互式的工作原型。
• 原型分类
  • 渐进式
    • 最初的原型在每次开发迭代后，都会向着最终可交付版本不断靠近。
  • 变革式
    • 当前原型在每次迭代开发周期结束时都会被丢弃，并开发出新的原型。
• 低保真原型
  • 定义：与最终产品不太相似的原型；使用与最终产品不同的材料
  • 优点：简单、快速、便宜、易于制作和修改
  • 常见形式：草图、故事板、绿野仙踪法（Wizard-of-Oz）
• 高保真原型
  • 定义：与最终产品更为接近，使用相同的材料
  • 缺点：制作时间长，难以修改
  • 风险：用户会认为原型就是系统，开发人员可能认为已找到了一个用户满意的设计
• 构建原型的成本因其复杂程度以及评估的周期而不同，如同在实验室内开展的用户测试和在现场开展的测试成本就有很大不同。但可以肯定的是，无论采取哪种评估方法，原型技术都有利于得到一个好的结果，并且适用于设计过程的很多阶段。

5.5 通过“看”来评估（11.2）

• 观察的作用
  • 观察用户怎样工作：获得数据
  • 重要性：用户并不是总是能够客观和完整的对自己使用产品的实际情况进行描述
  • 基于观察数据，可以分析用户在做什么并统计用户花在任务各个部分的时间，以及情绪反应
• 观察的优点
  • 适用于产品开发的任何阶段
    • 初期：理解用户的需要
    • 开发过程：检查原型
    • 后期：对最终产品进行评价
  • 现场观察是发现同使用环境有关问题的最佳手段
• 观察涉及看和听两个方面

5.6 通过“问”来评估（12.2，12.3， 12.4）

• 尤其适用于客观上较难度量的与用户主观满意度和可能的忧虑心情相关的问题。

• 问卷与访谈

  • 快速评估
  • 可用性测试
  • 现场研究

  问卷调查	搜集大量用户的意见从中找出普遍性的意见
  访谈	方便、快捷，若用户没有时间完成问卷，就可以考虑使用访谈方法

• 在设计问卷的过程应考虑

  • 需要什么信息？
  • 如何分析问卷？

• 为了减轻回答问题人员的负担鼓励用户提高回答率，应尽可能应用有限的问题

• 注意问题的先后顺序

  • 先提出一般化容易回答的问题再提出较难回答的具体问题

• 对征求用户意见的问题

  • 应提供一个“无看法”的答案选项
  • 避免使用专业术语等

• 访谈

  • 策略
    • 先进行小规模试验
    • 目标是消除问卷设计中的任何问题
    • 问题是否可以理解、结果是否是所期望的、以及问卷是否是期望的信息获取方式
    • 在最后版本发出以前，可以改变表述（并重新测试）
  • 避免
    • 设计问题时注意不要暗示答案
    • 访问人的肢体语言对受访人也有较大的影响

• 数据处理

  • 数据的走向和模式
  • 数量较大时，应进行数据的标准化，并计算百分比，以便比较不同组别的调查结果

• 焦点小组是集体访谈的一种形式

  • 非正式的评估方法
  • 6-9 个典型用户组成
    • 例子：大学网站评估——行政人员 + 教师 + 学生三个分别的焦点小组
  • 主持人工作
    • 列清单 + 保证不离题积极讨论 + 结果分析
  • 存在风险
    • 用户真正想要的东西并不一定等于他表达出来的东西
    • 避免风险：可以让用户接触在焦点小组中所可能讨论技术的具体实例。

• 理想情况下

  • 评估应该贯穿于整个设计过程中

• 实际过程中

  • 规律性地进行用户测试的费用是很高的
  • 寻找用户并不容易，并且很难从不完全的设计和原型获得交互经历的精确评估。

• 询问专家

  • 角色互换
  • 压力测试
  • 穷尽测试

5.7 启发式评估（12.5）

• 启发式评估是分析界面可用性的一种相对非正式的方法

• 具体方法

  • 每位专家以他们的方式独立地使用用户界面，记录符合启发式评估标准的设计。

• 步骤

  阶段	步骤
  准备（项目指导）	a）确定可用性准则。
  	b）确定由3~5个可用性专家组成的评估组。
  	c） 计划地点、日期和每个可用性专家评估的时间。
  	d） 准备或收集材料，让评估者熟悉系统的目标和用户。将用户分析、系统规格说明、用户任务和用例情景等材料分发给评估者。
  	e）设定评估和记录的策略。是基于个人还是小组来评估系统？指派一个共同的记录员还是每个人自己记录？
  评估（评估者活动）	a） 尝试并建立对系统概况的感知。
  	b）温习提供的材料以熟悉系统设计。按评估者认为完成用户任务时所需的操作进行实际操作。
  	c）发现并列出系统中违背可用性原则之处。列出评估注意到的所有问题，包括可能重复之处。确保已清楚地描述发现了什么？在何处发现？
  结果分析（组内活动）	a） 回顾每个评估者记录的每个问题。确保每个问题能让所有评估者理解。
  	b）建立一个亲和图（又称KI法“或A型图解法），把相似的问题分组。
  	c） 根据定义的准则评估并判定每个问题。
  	d）基于对用户的影响，判断每组问题的严重程度。
  	e）确定解决问题的建议，确保每个建议基于评估准则和设计原则。
  报告汇总	a） 汇总评估组会议的结果。每个问题有一个严重性等级，可用性观点的解释和修改建议。
  	b）用一个容易阅读和理解的报告格式，列出所有出处、目标、技术、过程和发现。评估者可根据评估原则来组织发现的问题。一定要记录系统或界面的正面特性。
  	c）确保报告包括了向项目组指导反馈的机制，以了解开发团队是如何使用这些信息的。
  	d） 让项目组的另一个成员审查报告，并由项目领导审定。

• 关于评估专家的人数

  • 通常情况下，只需要3~5名专家来做启发式评估，给出有用的结果。
  • 非硬性规定：很多人也就认为这是对所有评估类型的硬性规定，这种理解其实是完全错误的。
  • 评估所需要的用户数量在很大程度上取决于最终用户群体的多样性。

• 启发式评估的优点

  • 不涉及用户，所以面临的实际限制和道德问题较少，成本相对较低，不需要特殊设备，而且较为快捷。又被称为“经济评估法”

• 启发式评估的缺点

  • “专家每找到一个真实的可用性问题，将发出约一个假警报，忽略大约半个问题”
  • 专家找到的问题，可能并不是普通用户面对的问题

5.8 通过“用”来评估（13.2）

• 用户测试
• 明确用户
  • 用户的组织
  • “between-subjects”（被试间设计）
    1. 每个用户只进行一种自变量的实验
    2. 要求有足够多的测试用户，实验结果可能会受到个别参与者的影响
  • “within-subjects”（被试内设计）
    1. 每位用户都参与了所有的自变量实验
    2. 需避免“顺序效应”：参与者在执行前一组任务时获得的经验不会影响后面的测试结果
• 明确测试任务
  • 通常在设计实验时我们都会选取对于大多数用户通常都会执行的任务，即所谓的典型任务
• 度量数据
  • 定量数据
    • 完成任务的时间
    • 停止使用产品一段时间后，完成任务的时间
    • 执行每项任务时的出错次数和错误类型
    • 单位时间内的出错次数
    • 求组在线帮助或手册的次数
    • 用户犯某个特定错误的次数
    • 成功完成任务的用户数
  • 定性数据
    • 例如：用户为什么使用菜单会产生问题
      • 通过访谈或问卷调查获得

6 交互设计模式与理论

6.1 如何对用户任务进行分解（5.6.4）

• 任务分析
  • 一种用来描述用户的任务以及子任务、这些任务的结构和层次，以及执行任务时用户已经具有的或是需要具有的知识的方法。
• “层次化任务分析（HTA）”是人类工效学领域中最广泛使用的方法。

  • 目标/任务 — > 子目标/子任务

  • 采用层次图结构或表格文本格式表示

  • 每个目标以及子目标都有一个描述如何实现该目标的计划

    • 子目标序列
    • 并发需求
    • 行为对任务绩效的指导等方面的信息

  • 细分的终止规则

    • 对于不能再进一步细分的子目标，在方框下面画一条横线，表示已经不能再细分。

  • 不能细分的任务

    • 包含复杂机械响应的子任务
      • 如”移动鼠标”
    • 涉及内部决策的子任务
      • 如“选择感兴趣的商品”

  • 用途

    • 手册和教学
    • 需求获取和系统设计
      • 用来指导新系统的设计
      • 任务分析本身不是需求获取
      • 有助于需求的完整表达
    • 详细的接口设计
      • 如果知道某个任务频繁执行，就会让用户能够很容易地按照合适的顺序执行子任务
      • 如果频繁改变状态，在不同的菜单之间移动将是不可接受的

        ⚠️ 注意：
            - 层次化任务分析非常耗时，且不完善
            - 会给出一个有用的、有代表性的描述
            - 但没有说明如何去收集那些我们希望表达的任务信息
    

  • 优点

    • 有经验的分析师能够使用HTA相对快捷地提供有用的设计信息，可在早期使用

  • 缺点

    • 分析结果的展现方式不容易和软件工程师所用的表示方式联系起来

6.2 如何预测任务的完成时间（8.2）

• GOMS 模型
  • 主流的支柱之一
    • 基于人类处理机模型
    • 关于人类如何执行认知一动作型任务以及如何与系统交互的模型
    • 采用“分而治之”的思想，将一个任务进行多层次的细化
  • 四元素：用于描述用户行为
    • 目标（goal）
      • 用户执行任务最终想要得到的结果
      • 高层次目标如“编辑文章”
      • 低层次目标如“删除字符”
      • 高层次目标可以分解为若干个低层次目标
    • 操作（operator）
      • 任务分析到最底层时的行为，是用户为了完成任务必须执行的基本动作（如双击鼠标左键、按回车键等）
      • 操作不能再被分解
        • 在GOMS模型中它们是原子动作
      • 假设用户执行每个操作的时间是上下文无关的
        • 操作花费的时间与用户正在完成什么样的任务或当前的操作环境没有关系
    • 方法（method）
      • 描述如何完成目标的过程，用于确定子目标序列及完成目标所需要的操作
    • 选择规则（selection rule）
      • 确定当有多种方法时选择和方法
      • GOMS认为方法的选择不是随机的
  • 分析
    • 侧重于描述无错误的、专家级的行为
    • 可以用于评价采取多种策略来执行相似任务的情形
    • 常用于电话和全球定位系统的交互预测
      • 用户的相关知识和用户界面需要尽可能统一
      • 但专家级水平的操作人员执行任务的方式可能不同，此时适用
        GOMS模型进行分析
    • 对于多任务或并行任务的分析存在困难
• 击键层次模型（KLM：Keystroke-Level Model）
  • GOMS模型的一个简化版本，也是一种认知任务分析方法
    • 可以快速而近似地计算出用户需要多长时间执行一个任务单元
  • 分析
    • 同GOMS模型一样，KLM假定了一个简单的环境
      • 在一个时间专注于一个维务
      • 一个完全定制的界面
      • 无交叉的目标、无干扰、无差错、专家级的熟练行为等
      • 无需担心任务之间的选择关系

6.3 如何预测指定任务的执行效率（8.2.3）

• 组件与交互
  • 交互式系统界面中常常含有各种各样的交互组件
    • 用户在与系统交互的时候需要频繁地在屏幕范围内移动鼠标以激活屏幕组件
    • 用户访问组件的时间对系统的使用效率是至关重要的
• Fitts 定律
  • 基于对人类的运动特征、运动范围和运动准确性等因素的分析
  • 能够预测某种定位设备指向某个目标所需时间
  • 可指导设计人员设计按钮的位置、大小和密集程度
  • 对图形用户界面设计具有显著指导意义
  • “最健壮并被广泛采用的人类运动模型之一”
  • 定律认为
    • 如果一个任务的困难程度可等价于“信息”，那么用户完成任务的速率即可等价于人类信息处理系统的“信息量”
    • 换言之，如果我们知道一个动作的难度和执行该动作的速率，通过计算难度除以速率的商，就可以得到表示人类执行能力的值
    • 即：性能指数IP、任务难易ID和运动时间MT之间存在如下关系
      IP (Index of Performance) = ID (Index of Difficulty) / MT (Movement Time)
    • MacKenzie改写为：
      
      A 是振幅（与目标的距离），W 为目标宽度
    • 更好地符合观察数据
    • 精确模拟支撑 Fitts 定律的香农信息论
      
      常数a和b来自对实验数据的线性回归
  • 移向屏幕的某个目标所用的时间与两个因素有关
    • 设备当前位置和目标位置的距离（A）。距离越长，所用时间越长；
    • 目标的大小（W）。目标越大，所用时间越短
  • 性能指数IP
    • 也被称作吞吐量TP（Throughput）：TP = ID / MT
  • 建议：
    • 大目标、小距离具有优势
      • 对选择任务而言，其移动时间随到目标距离的增加而增加，随目标的大小减小而增加
    • 缩短到达目标的时间有两种措施
      • 缩短当前位置到目标区域的距离
      • 增大目标大小以缩短定位时间
  • 适用范围
    • 可用于指导桌面应用开发中的屏幕布局
    • 对基于移动设备的交互系统开发同样具有指导作用

ABCs

~ CS2023
全球范围内最权威、最系统的计算机科学本科教育指南，也是企业招聘和人才标准的“背后模型”。参考此文件的“Human-Computer Interaction (HCI)”进行查缺补漏。

~ Recommended Reading List for First-year HCI Ph.D. students
香港城市大学（CityU）教授写给博士生的入门清单，不仅有 HCI 相关书籍、文章还有更基础的如何阅读、写作论文的建议。

~ 想加入老师的课题组，有没有相关的阅读清单推荐？
北大教授写给对 HCI 方向感兴趣的学生的阅读列表，包括书籍、文章、研究方法等。

~ What books are required reading for HCI students and practitioners?

~ 用户体验书籍：2020年用户体验者书单40本

Courses

~ 人机交互与用户体验设计
MOOC 上由南京大学软件学院出品的基础课程。 教材 笔记

~ Interaction Design
Coursera 一门经典课程

📚书籍

HCI

~ 《人机交互:软件工程视角》 链接

UX

• 《用户体验要素:以用户为中心的产品设计(原书第2版)》（原著：The Elements of User Experience: User-Centered Design for the Web and Beyond，Second Edition） 链接 笔记
• Don’t make me think, revisited: A common sense approach to web usability (3rd ed.)链接 笔记

~ 交互设计

~ 界面设计

🐮大牛

~ Amy J. Ko, Ph.D.

~ Zhu, Haiyi

~ Xiaojuan Ma
这位老师在教学的第一线，有相关课程材料可作参考。

~ Jesse James Garrett
~ jjg.net
“Ajax 之父”博客，后一个为老版本

~ Bruce Tognazzini

~ Edward Tufte
Edward Tufte 数据可视化

~ LukeW

~ Joel Marsh’s ProTips

Top Conference

1. Computer Human Interaction (CHI)
2. Proceedings of the ACM on Human-Computer Interaction
3. International Journal of Human-Computer Interaction
4. Behaviour & Information Technology
5. IEEE Transactions on Affective Computing
6. International Journal of Human-Computer Studies
7. Proceedings of the ACM on Interactive, Mobile, Wearable and Ubiquitous Technologies
8. Virtual Reality
9. International Journal of Interactive Mobile Technologies
10. ACM Transactions on Computer-Human Interaction
11. ACM Designing Interactive Systems Conference
12. ACM Symposium on User Interface Software and Technology
13. ACM/IEEE International Conference on Human Robot Interaction
14. Frontiers in Virtual Reality
15. IEEE Virtual Reality Conference
16. International Conference on Intelligent User Interfaces (IUI)
17. Universal Access in the Information Society
18. IEEE Transactions on Human-Machine Systems
19. HCI International
20. Multimodal Technologies and Interaction

学校相关

~ Degree Programs
Reddit 全球关于 HCI 项目，绝大多数为硕士课程。

~ CSRankings: Computer Science Rankings
根据发 paper 对学校进行排名。不仅有 HCI 方向，也包括 CS 其他研究方向。

排名不分先后

大牛

• Eric A. Meyer

• Jonathan Snook

• Jeffrey Zeldman

• Steve Smith

• Marijn Haverbeke

• David Flanagan

• Brendan Eich

• Paul Irish

• JavaScript Daily

• John Resig

• Addy Osmani

• css-tricks

• TJ Holowaychuk

• Nicolás Bevacqua

• Sindre Sorhus

• Kitty Giraudel

• SitePoint

• Smashing Magazine

• A List Apart

• Rob Dodson

• Eric Bidelman

• Margaret Stewart

• Thomas Fuchs

• Lea Verou

• Mark Dalgleish

• ppk.css

• David Walsh

• ReactJS News

• nader dabit | nader.lens

• Simon Marlow

• Andrea Verlicchi

• Evan You

• Rich Harris

• daniel:// stenberg://

• Robin Wieruc

• Bradley Farias

• Marc Harter

• Nathan Rajlich

• Loiane Groner

• Kent C. Dodds

• дэн

• steveklabnik

• Joyee Cheung

• flavio

• Mark McGranaghan

• Harry Wolff

• Luis Atencio

• Barry Pollard

• Andy Hunt

• Dave Thomas

• Seb ⚛️ ThisWeekInReact.com

• vjeux

• Mike Bostock

• Jeffrey Heer

• Edward Tufte

• Jos Dirksen

• Shu-yu Guo (郭纾宇)

• Xuan Huang · 黄玄

• Andrew Clark

• @brian.blue

• Luna Ruan

• Marco

• React Nabors ~ @nabors.bsky.social

• Ricky

• Sebastian Markbåge

• Seth Webster

• Yuzhi Zheng

网站 & 博客

• A List Apart

• djf.log()

• Paul Irish

• John Resig

• Addy Osmani

• css-tricks

• ponyfoo.com

• SitePoint

• Smashing Magazine

• ebidel

• Lea Verou

• David Walsh Blog

• Nader Dabit

• Daniel Stenberg

• Andrew.

• Kent C. Dodds

• Steve Klabnik

• Flavio Copes

• Harry Wolff

• Tune The Web

• Andy Hunt’s Toolshed Technologies Home Page

• pragdave

• This Week In React

• Vjeux

• The Work of Edward Tufte and Graphics Press

• SmartJava

• rfrn

• Rachel Nabors

• Ricky Hanlon

说明： 本文来自 Deno ,作者：Ryan Dahl, Bert Belder, and Bartek Iwańczuk

文章版权属于原网站/原作者。我依旧只是个搬运工+不称职的翻译。本文不翻译鸣谢部分。

动态语言是有用的工具。脚本允许用户快速高效的将复杂的系统连接在一起，并且在不需要关心诸如内存管理或者构建系统等细节中表达想法。最近几年，像 Rust 以及 Go 这样的语言，使机器代码更易生成；这些项目使得计算机基础架构获得了极大的发展。然而，我们认为拥有一个强大的脚本环境来处理各种问题依旧重要。

JavaScript 是最广泛使用的动态语言，运行于各种浏览器中。大量程序员精通 JavaScript，并且已经在优化其执行方面投入了大量精力。通过如 ECMA 这样的组织的建立，JavaScript 得到了谨慎并且持续的进步。我们相信 JavaScript 是动态语言工具的必然选择；无论是在浏览器环境还是作为独立进程。

我们是这块实践的先行者，Node.js 被证明是非常成功的平台。Node.js 足以构建 Web 开发工具、创建独立进程以及无数其他案例。在 2009 设计 Node 时，JavaScript 是截然不同的。出于必要，Node 发明了一些概念，这些概念随后由标准组织采用，并以不同的方式添加到语言中。在 《Node 的设计问题》 （译者注：安利这个演讲，一定要看哦。）演讲中，提供了更多细节。由于 Node 已经有大量的使用，使得这一系统发展变得困难并且缓慢。

随着 JavaScript 的更新，以及 TypeScript 的加入，构建 Node 项目可能会变得很艰难，涉及到管理构建系统和其他繁重的工具，这使动态语言丧失了乐趣。除此之外，通过 NPM 存储库从根本上集中了链接到外部库的机制，与 web 的理念并相冲突。

我们认为 JavaScript 和相关的软件基础架构已经发生了足够的变化，值得进行简化。我们寻求一种有趣且高效的脚本环境，可用于多种任务。

用于命令行脚本的 web 浏览器

Deno 是一种在 web 浏览器之外用于执行 JavaScript 和 TypeScript 的全新运行时（runtime）。

Deno 试图提供一个独立的工具来快速编写复杂功能的脚本。Deno 是（并且永远是）一个单一的可执行文件。正如 web 浏览器，它知道如何获取外部代码。在 Deno 中，单个文件无需任何其他工具即可定义任意复杂的行为。

1
2
3
4
5

import { serve } from "https://deno.land/std@0.50.0/http/server.ts";

for await (const req of serve({ port: 8000 })) {
  req.respond({ body: "Hello World\n" });
}

在这里，只需一行代码，一个完整的 HTTP 服务器作为一个模块即添加完成。不需要额外的配置文件，也不要提前安装，只需要：

1

deno run example.js

与浏览器一致，代码默认运行于安全的沙盒中。代码无法访问硬件、打开网络连接或者是在没有许可的情况下进行任何潜在的恶意操作。浏览器提供了访问摄像头和麦克风的 API，但前提是通过用户的认证。Deno 在终端中提供类似的行为。上面的示例在没有标明 –allow-net 下会失败。

Deno 小心的不要偏离标准的浏览器 JavaScript API。当然，并不是每个浏览器 API 都与 Deno 相关，但无论它们在哪里，Deno 都不会偏离标准。

TypeScript 的默认支持

我们希望 Deno 适用于广泛的问题领域：从简单的一行代码，到复杂的服务端商业逻辑。随着程序变得越来越复杂，有一定的类型检测变得越来越重要。TypeScript 是 JavaScript 语言的扩展，允许用户选择性地提供类型信息。

Deno 在不需要任何外部工具下支持 TypeScript，内置 TypeScript 是其设计理念。deno types 命令是 Deno 提供的所有内容提供类型声明。Deno 的所有标准模块由 TypeScript 编写而成。

Promises 贯穿其中

在 javascript 之前 Node 设计时就引入了 Promises 或者是 async / await 的概念。Node 的 Promises 对应的是 EventEmitter，所有重要的 API 都基于这个，比如 sockets 和 HTTP。抛去对编程时使用 async / await 的好处来看，EventEmitter 存在背压（back-pressure）问题。拿 TCP 套接字（socket）来举例，套接字在接收到传入数据包时将发出“ 数据（data） ”事件。这些“ 数据 ”的回调将以不受限制的方式发出，从而使事件（events）充满整个过程。由于 Node 会持续接受数据事件，基础 TCP 套接字没有适当的背压，远程发送端并不知道服务端已经过载而继续发送数据。为了降低此风险，添加了 pause() 方法。解决了这个问题，但需要额外代码。由于只有在进程非常忙碌的时候，这个问题才会出现，导致 Node 程序充满了数据。结果是系统严重的尾延迟（tail latency）。

在 Deno 中，套接字依旧是异步的，但在接受新数据时，需要用户明确使用 read()。正确的构造接收套接字而不需要额外的暂停语义。这不是 TCP 套接字所独有的。系统的最底级别绑定层从根本上与 Promise 相关联，我们称之为“ ops ”。Deno 中所有的绑定是 Promises 的一种实现或提升。

Rust 有自己类似于 Promise 的抽象，称之为 Futures。通过 “ op ” 抽象，Deno 使基于 future 的 Rust API 巧妙的与 JavaScript 的 Promises 绑定在一起。

Rust API

我们提供的主要组件是 Deno 命令行界面（CLI）。今天（5 月 13日）CLI 正式发布了 1.0 版本。 Deno 并不是一个单一的程序，而是设计为 Rust 的集合，允许在不同层级的集成。

deno_core 是 Deno 的基础，它不依赖 TypeScript 和 Tokio。它简单的提供了 Op 和 Resource 模块。deno_core 提供了绑定 Rust futures 和 JavaScript promises 的组织方式。因此 CLI 完全建立在 deno_core 之上。

rusty_v8 为 Rust 和 V8 的 C++ API 提供了高质量的绑定。这个 API 试着还原所有原先 C++ API。这是零成本的绑定，Rust 暴露出的对象正是 C++ 的操作的对象（举个🌰，之前 Rust V8 的绑定尝试强制使用持久句柄（handles））。这个模块提供了建立于 Github Actions CI 之上的二进制代码，同样也允许用户从头编译 V8 并调整它的构建配置。所有 V8 源代码均在此模块进行分发。最后，rusty_v8 试着成为一个安全的接口。现在还没有 100% 完成，但我们在逐步接近于此。能够以一种安全的方式与像 V8 这样复杂的 VM 交互是非常令人惊奇的，这让我们发现 Deno 本身存在许多困难的bug。

稳定性

我们承诺在 Deno 中维护一个稳定的 API。Deno 有大量的接口和模块，所以对我们来说的”稳定”保持透明是很重要的。我们创建用于与操作系统交互的 JavaScript API 都可以在“ Deno ”命名空间中找到（例如 Deno.open()）。这些已经被仔细检查过了，我们定会对它们做向后兼容的更改。

在使用 –unstable 命令行标志之前，所有还没有稳定的方法将会被隐藏。你可以在这查看没有稳定的接口。在接下来的时间中，其中的 API 也会逐渐稳定下来。

在全局命名空间中，你可以发现各种其他对象（例如 setTimeout() 和 fetch()）。我们努力保持这些接口和浏览器中一致，但是如果发现意外的不兼容性，我们将进行更正。浏览器标准定义了自身的接口，而不是我们。任意错误的更正只会是修复问题，而不是更新接口。如果与浏览器的标准 API 不兼容，可能会在大版本发布之前进行修复。

Deno 还有很多 Rust API，比如 deno_core 和 rusty_v8 模块。这些 API 都还没有达到1.0。我们会继续对它们进行迭代。

局限性

需要了解的是 Deno 并不是 Node 的一个翻版，它是一种全新的实现。Deno 只是开发了两年，而开发 Node 已经超过十年。基于到对 Deno 的兴趣，我们希望它能继续发展和成熟。

对于一些应用来说，Deno 是一种好的选择，对于其他的则不是。这取决于需求。我们想说明 Deno 的局限性来帮助人们选择 Deno 。

兼容性

不幸的是，令人沮丧是许多用户会发现与现有 JavaScript 工具缺乏兼容性。Deno 通常与 Node（npm）包不兼容。初步建立在 https://deno.land/std/node/，但还远远没有完善。尽管 Deno 采取了强硬的方法来简化模块系统，最终 Deno 和 Node 是有着相似的目标和相似的系统。随着时间的推移，我们希望 Deno 可以开箱即用的运行比 Node 更多的系统。

HTTP 服务器性能

我们持续追踪 Deno HTTP 服务器的性能。每秒 25000 次使用 Deno HTTP 服务器请求 hello-world 最多延迟 1.3 毫秒。类似的 Node 程序每秒请求 34000 次，而最大的延迟在 2 ~ 300 毫秒之间。

Deno 的 HTTP 服务器是在原生 TCP 套接字之上的 TypeScript 中实现的。Node 的 HTTP 服务器是由 C 语言编写的，并暴露给 JavaScript 的高级绑定。我们阻止了将本地 HTTP 服务器绑定到 Deno 的冲动，因为我们想优化 TCP 套接字层，以及更普遍的 op 接口。

Deno 是适当的异步服务器，能应付每秒 25000 次的请求，可以满足大多数的需求。（如果不满足，JavaScript 可能并不是最好的选择。）不仅如此，我们预计，由于普遍使用了Promise (之前已经讨论过了)，Deno 在尾延迟方面表现得更好。综上所述，我们的确相信该系统还有更多的性能优势，希望在将来的版本中实现这一目标。

TSC 的瓶颈

Deno 在内部使用微软的 TypeScript 编译器来进行类型检测和生成 JavaScript 。与使用 V8 直接编译 JavaScript 相比，这样做非常缓慢。之前，我们想使用“ V8 快照（V8 Snapshots）”来大幅度提升性能。快照当然有帮助，但它仍然很慢。我们认为可以在现有 TypeScript 编译器的基础上进行一些改进，但是很明显，类型检查最终需要在Rust中实现。这是个艰巨的任务，可能在短时间内不会发生；但它可以让开发人员在经历关键路径中提供数量级上的性能改进。TSC 需要移植到 Rust上。如果你对这个问题感兴趣，请联系我们。

插件 / 挂件

我们有一个使用自定义 ops 来对 Deno 运行时进行初步扩展的插件系统。这个接口还在开发中，已经标记为非稳定版。因此，访问 Deno 提供的系统以外的本地系统是很困难。