It is time to resume my blog

I have stopped this blog for about three and a half years due to the block of the Chinese internet and the busy days after arriving Finland.

I would like to record my life sincerely and give my points reflect what I am thinking these days. It is a great job to write "Abigail's life story" as a part of my real life.

I began my studying of HCI in UTA last September. It was an awesome time in my life because I am approaching my dream from then. I hope I can enjoy these two or more years here and to be a real expert in the area of User experience.

[Translation]F-Shaped Pattern For Reading Web Content

Article copyright by Jakob Nielsen

Jakob Nielsen版权所有

作者：Jakob Nielsen
译者：UCD翻译小组，Abigail
原文地址：http://www.useit.com/alertbox/reading_pattern.html

雅各布尼尔森的提示箱，2006年4月17日：
F形网页文字阅读模式

摘要：
眼球轨迹的可视图像显示，用户在浏览网页时经常呈现F形模式：两条水平线然后一条垂直线。

在我们新的眼动追踪研究中，记录了232名用户浏览成千上万网页的方式。我们发现，用户的主要浏览行为在许多不同的站点和任务中是相当一致的。这种主要的浏览模式看起来有点像字母F，包含以下三个步骤：

• 首先，用户通常用水平移动的目光阅读内容的最顶端部分。这个第一步形成了F顶端的横杠。
  
• 接着，用户的目光会下移，第二次水平移动目光，进行阅读，通常这次阅读的覆盖的区域要比上一次的短。这第二步形成了F较短的那条横杠。
  
• 最后，用户用垂直移动的目光浏览网页的左侧。有时这步的浏览速度较慢，也较有系统性和条理性，在眼动追踪的热度图上表现出一条清晰而浓重的路径。而有的时候用户移动得相对较快，只在热度图上留下些许跳跃的斑点。这最后一步形成了F的那一竖。

显然，用户的扫描模式并不总是完全由三部分组成。有时用户会第三次浏览内容，使这个模式看起来更像个E而不是F。有时他们也许只会阅读内容一次，那么这个模式看起来就更像一个倒置的L（横杠在上方）了。不过总的来说，浏览模式基本上与F相仿，虽然上横杠和下横杠之间的距离会有所不同。

三个网站的用户眼动追踪研究的热度图。用户关注程度，从高到低：红>黄>蓝>灰
以上热度图显示了用户浏览三种不同类型网页的方式：

• 一公司网站的“关于我们”部分的一篇文章（左），
  
• 一电子商务网站上的产品页面（中），以及
  
• 搜索引擎搜索结果页面（SERP；右）。
  

如果把焦点放在受关注程度最高的红色区域，这三张热度图均显示了预期的F模式。当然，这其中有些差别。F浏览模式是一个粗略大概的形状，而不是高度统一精致完美的行为。

在电子商务的网页上（中图），F的第二条横杠由于产品图片插入，位置比通常的要低。用户把很大一部分的注意力放在页面右上方显示价格和"添加到购物车"按钮的区域。

在搜索结果页面上（SERP；右图），第二条横杠比上面那条长，主要是因为第二条标题比第一条标题长。虽然用户更少关注网站的第二部分内容，但这个结果证明，头两条搜索结果对用户具有相同的吸引力。

F模式的启示
F模式对网页设计的启示是显而易见的，它强调了遵循网站写法的指导方针而不是重现印刷品上的内容的重要性：

• 用户不会逐字逐句地完整阅读你的文字。详尽的阅读是很罕见的，尤其是潜在客户为搜集供应商名单而进行初步调查的时候。的确，有人会读得很多，但大部分不会。
  
• 前两段必须显示最重要信息。虽然用户更喜欢仔细阅读第一段，但他们仍会关注第二段的内容。
  
• 子标题、段落和列表的第一个单词最好能明确说明内容因为用户使用F模式浏览网页时，它们都正好位于最受关注的那根竖线上。在同一行中，他们读第三个单词的几率要远远小于头两个单词。

详细的扫描行为
用慢动作回放来观察用户眼睛在阅读和浏览整个网页的移动是令人着迷的。除了我在这里讨论的主要的F模式之外，每个页面都存在着阅读问题。例如，用户会用一种完全不同的、更加有方向性的方式寻找价格或其他数字信息；至于用户如何看搜索引擎的广告栏则取决于有一种有趣的“烫手山芋”现象。同时我们在对人们如何看待网站图片方面也有很多发现。

在芝加哥和阿姆斯特丹举行的2008年用户体验大会上，我们将在为期两天的网站写法研讨会上展示更多的研究结果。

内容可用性的最大决定因素在于用户在线阅读的方式——阅读方式的不同决定了写法的不同。

————————————————————————————————————

原文：

Jakob Nielsen's Alertbox, April 17, 2006:

F-Shaped Pattern For Reading Web Content

Summary:
Eyetracking visualizations show that users often read Web pages in an F-shaped pattern: two horizontal stripes followed by a vertical stripe.

F for fast. That's how users read your precious content. In a few seconds, their eyes move at amazing speeds across your website's words in a pattern that's very different from what you learned in school.

In our new eyetracking study, we recorded how 232 users looked at thousands of Web pages. We found that users' main reading behavior was fairly consistent across many different sites and tasks. This dominant reading pattern looks somewhat like an F and has the following three components:

• Users first read in a horizontal movement, usually across the upper part of the content area. This initial element forms the F's top bar.
• Next, users move down the page a bit and then read across in a second horizontal movement that typically covers a shorter area than the previous movement. This additional element forms the F's lower bar.
• Finally, users scan the content's left side in a vertical movement. Sometimes this is a fairly slow and systematic scan that appears as a solid stripe on an eyetracking heatmap. Other times users move faster, creating a spottier heatmap. This last element forms the F's stem.

Obviously, users' scan patterns are not always comprised of exactly three parts. Sometimes users will read across a third part of the content, making the pattern look more like an E than an F. Other times they'll only read across once, making the pattern look like an inverted L (with the crossbar at the top). Generally, however, reading patterns roughly resemble an F, though the distance between the top and lower bar varies.

Heatmaps from user eyetracking studies of three websites. The areas where users looked the most are colored red; the yellow areas indicate fewer views, followed by the least-viewed blue areas. Gray areas didn't attract any fixations.

The above heatmaps show how users read three different types of Web pages:

• an article in the "about us" section of a corporate website (far left),
• a product page on an e-commerce site (center), and
• a search engine results page (SERP; far right).

If you squint and focus on the red (most-viewed) areas, all three heatmaps show the expected F pattern. Of course, there are some differences. The F viewing pattern is a rough, general shape rather than a uniform, pixel-perfect behavior.

On the e-commerce page (middle example), the second crossbar of the F is lower than usual because of the intervening product image. Users also allocated significant fixation time to a box in the upper right part of the page where the price and "add to cart" button are found.

On the SERP (right example), the second crossbar of the F is longer than the top crossbar, mainly because the second headline is longer than the first. In this case, both headlines proved equally interesting to users, though users typically read less of the second area they view on a page.

Implications of the F Pattern

The F pattern's implications for Web design are clear and show the importance of following the guidelines for writing for the Web instead of repurposing print content:

• Users won't read your text thoroughly in a word-by-word manner. Exhaustive reading is rare, especially when prospective customers are conducting their initial research to compile a shortlist of vendors. Yes, some people will read more, but most won't.
• The first two paragraphs must state the most important information. There's some hope that users will actually read this material, though they'll probably read more of the first paragraph than the second.
• Start subheads, paragraphs, and bullet points with information-carrying words that users will notice when scanning down the left side of your content in the final stem of their F-behavior. They'll read the third word on a line much less often than the first two words.

Detailed Scanning Behaviors

It's fascinating to watch the slow-motion replay of users' eye movements as they read and scan across a page. Every page has reading issues beyond the dominant F pattern I'm discussing here. For example, users scan in a different, more directed way when they're looking for prices or other numbers, and an interesting hot-potato behavior determines how users look at a list of search engine ads. We also have many findings on how people look at website images.

Many of the detailed findings are presented in our two days of seminars on Writing for the Web at the User Experience 2008 conference in Chicago and Amsterdam.

The biggest determinant for content usability is how users read online — and because people read differently, you have to write differently.

[Translation]“How to Solve It” never goes out of style

Article copyright by Kate Rutter
Kate Rutter版权所有
作者：Kate Rutter
译者：UCD翻译小组，Abigail
原文地址：http://www.adaptivepath.com/blog/2008/10/08/how-to-solve-it-never-goes-out-of-style/

白天，我做体验设计工作，建立抽象概念的模型，制作界面，被铺天盖地的邮件所淹没，在无数工作生活完美兼顾的人群中往来。

当我回到家里，我就画草图、哼歌、看看数学。

我想说明的是我的计算能力很糟糕。直到现在，有的时候我还需要依靠我的手指。我非常庆幸我的电脑上有一个小数字计算器。至于概念上的数学呢？我太喜欢了.....阿基米德, 费尔马, 柏努利, 巴贝奇, 洛夫莱斯, 梅森, 傅立叶, 图灵, 帕斯卡, 斐波纳契, 莫比斯, 笛卡尔, 鄂尔多斯, 波利亚…这些都让我津津有味！

数学有很多基本要素和模式。数学概念是成熟的，并且带有隐喻，可被应用于日常生活中。正在探求时间上的变化规律吗？与组合数学狂欢吧。正在为你的收件箱从来只接近零而从未到过零而疑惑吗？你好，微积分！渴望用全新的方式去思考？来，读一下艾伯特的《平面世界》。

现在，当我看到乔治波利亚1945的经典著作《怎样解决问题》。作为提高我们生活品位的方法，数学再次让我惊叹于它的美好，它的简单，它的全能。以思考解决一个问题的过程为基础，波利亚的所提供的方法能很好地被用来解决数字王国之外的大量问题。

举个例子，为了即将开展的一系列在用户家里举行的领域研究访谈，我一直在集中精力准备访谈会议。这里用到了波利亚关于了解任务的说明：

Q: 我应该从什么地方开始？
A: 从任务陈述入手。

Q: 我可以做些什么？
A: 使任务整体尽可能地被清晰而生动地形象化。这时不要纠缠于细节。

Q: 这么做我可以获得什么？
A: 你将会理解任务，熟悉任务，并把它的目标刻在你的脑海里。对于任务的关注还会刺激起你的记忆，让你回想起与之相关的要点。

这是一个具有直接应用性的简单明了的指示：
理解任务和问题：我们想要通过这次研究实现什么目的？我们需要了解什么？
准备接受体验：身临其境……人们存在着什么问题？他们在每天的生活中都在经历些什么？
开放思维看到正确的事物：与任务紧密联系可以使你的脑子优先接收到最相关的、最有效的信息。

数学，就像设计，只有当它简单而且明显时才是绝妙的。而设计作品，也像数学，只有在清楚地致力于解决重要问题时才是绝妙的。这就是优秀的基本要素。

感谢波利亚，你是最棒的。
———————————————————————————————————
原文：
In the daytime, I work on creating experiences, building models of abstract concepts, making interfaces, feeling deluged by email and navigating the myriad of human contacts that make work and life play nice together.

But when I get home, I sketch, hum and play with math.

I’ll make one thing clear: I’m terrible at computation. I still count of my fingers on occasion. I thank the heavens for the little digital calculator on my computer. But conceptual math? I’m all over it…Archimedes, Fermat, Bernoulli, Babbage, Lovelace, Mersenne, Fourier, Turing, Pascal, Fibonacci, Mobius, Descartes, Erdos, Polya…yum, yum.

There’s something elemental and patternist about math. The principles are ripe with metaphor and opportunities to apply to everyday life. Looking for transformation over time? Have a ball with combinatorics. Wondering why your inbox always approaches zero but never gets there? Hello, calculus! Yearning to think outside the box? Welcome to Abbot’s Flatland.

So today, when I picked up George Polya’s 1945 classic How to Solve It I was again inspired by the beauty, the simplicity, the utter power of math as a system to better understand life.

Starting with the basics of thinking through a problem, Polya’s approach is applicable to a wide range of problems well outside the realm of numbers.

For example, I’m about to head into a series of field research interviews with people in their homes. I’ve been working to center my brain to prepare for the interview sessions. And here is what Polya says about Getting Acquainted with a problem:

Q: Where should I start?
A: Start from the statement of the problem.
Q: What can I do?
A: Visualize the problem as a whole as clearly and as vividly as you can. Do not concern yourself with details at the moment.
Q: What can I gain by doing so?
A: You should understand the problem, familiarize yourself with it, impress its purpose on your mind. The attention bestowed on the problem may also stimulate your memory and prepare for the recollection of relevant points.

That’s a clear, concise message with direct applicability:
Know the problems and questions: What are we trying to accomplish with this research? What do we need to learn?
Prepare yourself to wear the experience: Be vivid…what issues exist for people? What are their experiences in day-to-day life?
Open your mind to seeing the right things: Be in tune with the problem so that your brain is primed to receive the most relevant, potent learnings from the experience.

Math, like design, is best when the concepts are so simple they become obvious. And design work, like math, is best when it’s clearly focused on solving important problems. That’s good stuff.

Thanks, Polya. You’re the best.

HCI Courses in CMU

In China, there is few courses are about HCI (human computer interaction). So I have to check out the systemic courses of this major in the foreign universities. One day I came into the list of HCI courses in CMU, and I think maybe I should keep it and make it be my studying referrence.

They are:
05331 Building Virtual Worlds
05410 Introduction to Human Computer Interaction Methods
05413 Human Factors
05417 Computer-mediated Communication
05430 Programming Usable Interfaces
05431 Software Architecture for User Interfaces
05432 Cognitive Modeling and Intelligent Tutoring Systems
05499 Special Topics in HCII
05540 Rapid Prototyping of Computer Systems
05571 Undergraduate Project in HCI
05589 Independent Study in HCI-UG
05600 HCI Pro Seminar
05601 HCI Seminar
05610 Introduction to Human-Computer Interaction Methods
05611 Introduction to HCI Lab
05630 Programming Usable Interfaces
05631 Software Architecture for User Interfaces
05650 Interface and Interaction Design
05671 HCI Project
05672 HCI PROJECT II
05689 Independent Study in HCI - Grad
05750 Graduate Design Seminar
05771 HCI Process and Theory
05810 Computer Supported Cooperative Work
05811 Cognitive Model for HCI
05813 Human Factors
05814 Perception
05815 Computers in Organizations
05816 Applied Research Methods
05817 Computer-mediated Communication
05830 Adv. Topics UI Software
05831 Building Virtual Worlds
05832 Cognitive Modeling and Intelligent Tutoring Systems
05833 Adv. Topics UI Technology
05835 Speech Recognition and Understanding
05851 Introduction to Product Design
05871 Dramatic Structure of Interactive Games
05872 Rapid Prototyping of Computer Systems
05873 HCI Project Workshop
05874 Advanced Lab in Speech Recognition
05875 Rapid Prototyping Summer Project
05876 Interactive Media and Role of Sound
05888 Practicum in HCI
05889 Directed Research
05899 Special Topics in HCI
05997 Reading and Research in HCI

Preface

Jingjing is a Chinese girl, simple and sincere. She has few idea about future and just want to take everyday seriously. She is a Chriatian and hopes where she had walked will be the property of Yahveh. Welcome to her blog and I hope you will like it.