Talk with Tony Hogan

I am more than surprised and excited, finding my English teacher Tony Hogan an experienced designer, a Googler, and someone sharing similar career transferring experience with me.

Tony was a design director in London before moving to Spain. He is now teaching himself coding and database and running a tech-based project.

What Tony inspired me on UX and career today is far more valuable than the scheduled English topic “perfume”. In the rest of this post, I’m be summarizing my takeaways from our talk today.

1. Find common language

The course started like an ordinary one until Tony heard from my saying “I’m a user experience designer.” Then he asked me two straightforward questions:

1) What do you do on a daily basis?
2) What software do you use?

It’s often diverse when it comes to the answers to question: what is user experience design? – Not only designing websites! As reminded by Don Norman. So beginning with picturing daily routines and tools applied is a good idea.

2. On design

1) Graphic design is: you have a concept, I can quickly put it on the paper;
2) Go for good, clean, and easy-to-use design;
3) As a user, I have these (microphone, timer, buttons) and don’t want anything else; anything else is distracting;
4) Remember: less is more, and; function over decoration.

3. Advises for junior designer

1) Unless it’s really difficult, stay with it;
2) You look young enough to adapt new;
3) People criticize, they look areas to criticize;
4) Bigger knowledge is always helpful.

Fun part:
Tony asked whether I’ve studied somewhere outside of China. “Amsterdam, I did my first year of Ph.D. there.”

Aha, I knew that. You have a Dutch accent!

Task flow vs. interaction flow

It’s not uncommon for UX practitioners to confuse between task flow and interaction flow when it comes to task analysis. Although the two share pretty similar forms, they differ from each other because they serve distinct purposes.

A task flow focuses on the user’s goal and how the user achieves this goal. In reality, there is always a gap between user’s current situation and the goal. To cross over the gap and reach the goal, the user must take certain key steps. And the key steps are what to cover in a task flow.

Let’s take Yelp for an example. A user’s purpose is to have a great dinner. To have the great dinner, he needs to arrive at a restaurant. And to arrive at the restaurant, he needs to direct from current point to the restaurant. To direct to the restaurant, he needs to choose one restaurant. And these are what to cover in a task flow.

It doesn’t matter if the user swipes or taps on the screen, or whether he reads a restaurant’s comments. Likewise, it doesn’t matter what messages pop up to the user or what navigation app does Yelp brings him to. These user actions and system feedbacks fall under the umbrella of interaction flow.

An interaction flow directs on the interactions between the user and the product which assist the user completing his goal. These interactions include the appearances of the interface, the gestures the user performs, and the feedbacks the system gives.

While an interaction flow reveals micro steps, a task flow stands on a higher level. The task flow is a powerful tool because it lays a foundation for the product’s information architecture.

Information architecture, which is majorly about organizing a product’s content, is determined by the user’s task flow. By looking into the key steps in a task flow, the designer could clarify what types of information to cover and what hierarchy the information follows.

Excerpts from Book: Grid Systems in Graphic Design

Müller-Brockmann, J. (1996). Grid systems in graphic design: a visual communication manual for graphic designers, typographers and three dimensional designers. Arthur Niggli.

Every visual creative work is a manifestation of the character of the designer. It is a reflection of his knowledge, his ability, and his mentality. (Page 10)


Information presented with clear and logically set out titles, subtitles, texts, illustrations and captions will not only be read more quickly and easily but the information will also be better understood and retained in the memory. This is a scientifically proved fact and the designer should bear it constantly in mind. (Page 13)



Mobile Paper Mockup

I made this paper mockup in shape of iPhone 6S this morning.


It’s made of fluting paper. I got some from a parcel box.


I can sketch prototypes on blank paper, and cross the prototype through below the pink frame on my mockup, and then ask users questions in agile usability testing.


Blank paper could slide vertically and also horizontally.



Pogo-Sticking Effect

Pogo-sticking is defined as going back and forth from a search engine results page (SERP) to an individual search result destination site. In other words, pogo-sticking is when the searcher clicks on a link on a SERP, sees that it’s not what she is looking for, and immediately bounces off by hitting the back button. She then chooses another result from the results page to satisfy her informational need.

– Joe Breed, Weekly SEO Tip: How to Avoid the Pogo-Sticking Effect (Nov 22, 2013), retrieved from: