Here are my notes and thought while reading “Design for the mind” by Victor S. Yocoo
Author: yuwei22
On label-following && some thoughts on GitHub project
When I read “Usability Inspection Methods”, I realized the importance of knowing how the user would describe the task. Only if the instruction and feedback should be in the user’s vocabulary, users can pick the correct actions. I remembered last time I did usability test of Carle on my volunteer, the task was indeed really easy (because I found it easy when I did it on my own) but she just did not understand. After the test, I showed her what I really meant for my task and then she rephrased my task instruction in a different way.
Besides, I connected it to my Assignment 4 “GitHub project”. During the lecture, Professor also mentioned that GitHub was some unfriendly to new users and learning curve was demanding. This means if I use cognitive walkthrough method on a new GitHub user for usability test, it probably leads to unsatisfied usability testing result. Because cognitive walkthrough is based on a theory of learning by exploration, new user probably takes long time to finish a task with incorrect result. Another point, I know that unless a user will use GitHub very often, it is very likely that user will forget how to use it quickly
Stories about Ration Button
This week I read “Chapter 36: Case Study: One-or-More Button” from “Tog on Interface”. I really agree with one of the sentence that “face your own denials and rationalization” and “get honest with yourself”, even if it probably takes a long time. From my own experience, when I was responsible for Front-end development of a website, sometime I could feel that there was something weird in my design, but I just did not know where it was, pretended everything was fine and let it go.
This time, I really need to ask a favor of peer design review. “To infuse fresh ideas and explode false assumptions that may have crept into your design.” And from this week’s paper prototyping class, I also learned the same thing when classmates from the other group came to test our prototype. There should be so many things we needed to modify, even if we though it could not be much better previously.
Besides, after reading this paper, I also read a post “Radio Buttons: Select One by Default or Leave All Unselected?” from Nielson Norman Group website. I never thought that such a little ration button should have a lot of implications and function. This post is really informative and full of examples.
1. If you decide to design your ration button with “Select one button by default”, you’d better also decide on which one is the default button based on organization’ goal and users’ typical behavior. Because “the default ratio selection can assist the person, and sway a person in the direction in which the organization wants him to go”.
(Picture from the post)
(Picture from the post)
2. Also default selection has its own disadvantage that it might be confusing and unexpected, and cause people to feel OUT OF CONTROL.(Why do you force me to choose on something I dislike!!)
Rewrite and revise — from bad to good
This week I read “Why good design comes from bad design“, a very good article full of practical suggestions.
At the beginning, I was confused by its title until I realized that it taught us to make a list of our drafts and embrace our awful original versions. It is not uncommon that when people design something, they usually have high expectation and want to make their first draft as perfect as possible, even if they do not have a clear idea of the prototype.
Successful designer will not spend too much time just thinking about the best one, instead they document all their bad ideas which reveals problems early, and then help the designer focus on the essential qualities and make continuous improvement. This method is not only useful for producing progressing products continuously for each software development life cycle, but also make the designer’s idea more convincible and recognizable as designer can explain pros and cons of each discarded ideas.
I think this methodology is really familiar to most people when they make a decision on their preference. “Although currently I am not sure what I really want, I definitely know what I really do not want. When I exclude those less-preferred choices, the left will probably be my most preferred one”.
Secrets of Homepage
In this week’s reading, it is related to Web design, specifically the Home Page Design. This Chapter give out a lot of suggestions on designing a single web page.
1. Your homepage is the Initial impression of your website. It is understandable that people want to display enough info/pictures on the homepage to attract their reader, so that they cram too much things on the homepage and overwhelm their reader with such huge volume of info. So it is time to make compromise and make a priority list on things that should be displayed. This helps to “convey a big picture” and make reader catch the key info/function of this website.
2. Check your website with The four questions. 1. “What is this?”; 2.”What can I do here?”; 3.”What do they have here?”; 4.”Why should I be here and not somewhere else?” From my personal experience, when I browse a website homepage, if I form wrong ideas about what things are and how they work at the first impression, it is likely that I will keep use such first “knowledge” to interpret everything I continue to see. Therefore, it is important to make your homepage more predictable and facilitate them forming a correct image of your website.
WeChat: China’s Integrated Internet User Experience
In this week reading, I chose this artice. WeChat: China’s Integrated Internet User Experience
I chose this article not only because I am familiar to this topic, but also I want to introduce WeChat to more people around the world after I found some of my professors really love it. Some might think WeChat is similar to Facebook, but the truth is not.
At the beginning, WeChat was just a mobile instant-messaging app. It gradually added many other features such as payment service, commerce platform, social networking, games and so on to involve into an essential integrated user experience in people’s daily life.
Here I just take emoji in WeChat as an example. One of my professor speaks highly of various interesting and vivid emoji on WeChat. As is known to all, emoji can be a powerful tool to express our feelings. Particularly in China, people can update his own emoji collections frequently not only from WeChat official emoji, but also created by himself or from his friends. In this case, everyone can design his own emoji and deliver to other during the conversation. This makes people more pride of himself and becomes engaged into WeChat use. Compared with Facebook, there are limited emoji available and it easily bores user. Especially the conversion function is separated from the Facebook as an independent app called Message, which is not convenient for user to use both functions interchangeably.
Test-Driven Design
In software development, there is a programming technique called Test-driven development, which requires developers to write actual code and automated test code simultaneously. This ensures that programmers test their code quickly, frequently and easily. This can also apply to design area as designers launch as many user testing as they can during their designing.
Test-driven design is a great excuse to think about the problem before we think about the solution. The final design has no value unless we can prove that it solves the right problem and works as expected. User testing is an iterative process and works as an alerting system to remind of mistakes. Each iteration produces design necessary to pass that iterations’s test. Contrasting this piecemeal improvement with how usability testing has traditionally been done—at the end of a project— this allows for unprecedented flexibility and, indeed, usability of the final product.
Besides, I find this interesting picture. In this user testing, most people can find the “Publish” link – good news! This shows that the layout is working.
F-Pattern for reading the web
When I was reading the “Don’t make me think”, I was quite interested in one of three facts it mentioned about how people read webpages. Particularly, its accompanied picture reminds me of how human eye reads a website. To make numerous information in a right visual hierarchy, UI designers are supposed to understand how human eyes process web content — “F Pattern“.
According to a research conducted by Nielsen Norman Group on eye tracking visualization, the dominant reading pattern for human eyes looks like an F.
Source: https://www.nngroup.com/articles/f-shaped-pattern-reading-web-content/
It is consistent with the reading materials that “People scan rather than read”. And this also explains the fact that when people can not find the info they want “at the glance”, they feel frustrated and then have to waste much time to read in lines. So it is important to make the webpage self-content, obvious and self-explanatory.
After seeing those awful website, I made a little summary.
1) Do not cramming too much info in a long page. In fact, people are not willing to scroll for more information and just skip those hidden ones. And to make the web more accessible like for the mobile users, it is wise to build the web with built-in responsive design.
2) Lack of main point. Just like writing paper, every page should has one main point. If you do have a lot of information to display, do have an intuition navigation which is critical for user to find what they are looking for.
3) Colors are important. Not too many and have right color combinations.
（Besides, I found endless “rules” online talking about how to make an exceptional web page. 🙂
The ILLINOIS Experience
Want to experience #ILLINOIS in virtual reality? Explore a robotics lab, Ikenberry Dining Hall, Alma Mater, Business Instructional Facility, Grainger Engineering Library, Krannert Center for the Performing Arts and more in 360° video
This project was posted on UIUC Official Facebook page.
GitHub Design Workshop
This GitHub Redesign project is for our Assignment 4, consisting of 4 parts. Our goal is to analyze and design a better interface for GitHub and make it a more user-friendly tools for all users. This project is estimated to be a 4-month iterative development.
GitHub is a web-based Git repository hosting service, offering all of the distributed version control and source code management functionality if Git as well as adding its owen features.
There are 2 members working on this project:
You are more than welcome to contact us about our project.:)
Do please use this link to see our effort.
UX-relection 