Design Manifesto: Human Computer Interaction
What is good design? What is poor design? Isn’t the idea of “good design” subjective in regards to one’s own personal preferences, tastes, and likes? One person might love the design of something, but another might hate it. As I learned this semester the answer is definitely no! There are a multitude of design practices and choices that will provide the optimal experience to humans, regardless of what product we are designing. After all, humans are the ones who will use whatever product is created. Therefore, it is imperative that the product be designed with goal of serving it’s users in the best way possible.
- Human Centered Design starts with Ideation, or careful planning
Prior to this course, I had a strong distaste for UML diagrams, sketches, and prototypes. I felt that they were unnecessary, time consuming, and just overall a pain to create. Anytime I worked on a project, I put very little effort into this aspect. I thought spending more time create the actual product would end with a better overall product.
As it turns out, I was very wrong. Jotting down quick notes and creating sketches helps you get a better overall understanding of the project. In our Design for Others project, creating multiple sketches allowed use to contrast and compare our ideas. The goal of the project was to redesign a poorly designed site to fit a designated user group.
After my first sketches, I was able to notice that there was no way to navigate the web pages. Thus I added a hamburger menu, so users could click the link to the desired page. Had I not sketched this out, I would have never taken this into consideration.
2. Design for desired users
A key part creative a good design is taking into consideration how your users will use, react, and interpret your design. This is something that I had never considered before this course. An important part of this process is interviewing and research. By doing this, a designer can learn trends amongst the user group that they had not previously taken into consideration. A good designer takes this into consideration both before creating and product and after its release.
Take two user groups, one being elderly people and the other teenagers. How would our design be different amongst the groups? Well, elderly people would certain benefit from features such as enlarged buttons, easy to read labels, big fonts, and clear descriptions. Teenagers might prefer features such as social interactions and intuitive icons (because they have probably used apps with similar icons, so they glance at your app and already know what everything does).
In my Design for Others project, the target user group was adults with young children. So in our redesign of , we highlighted aspects of the sight that would appeal to this user group. How did we know what was appealing to this group? Research.
After completing research and analyzing the trends amongst the data, we came up with some ideas for what might be important for this user group. For example, an event calendar, outdoor guide, and safety guidelines are all easily accessible from the home page since these things might be more important to this user group.
If you are interested, our full redesign can be found here:
3. Use Appropriate Data Visualization Techniques
Another takeaway from my HCI course is to use appropriate visualization techniques when trying to display some type of data. Take this COVID-19 info sheet from the state of Alabama:
I can go on and on about how horrible it is, so if you are interested my full critique can be found here:
To summarize, this graphic in painful to look at. What does it even tell us? I wrote the article two months ago and I still do not know. These graphic just throws numbers at us. 31,624 positive cases? That seems like a lot, but how does that compare to the population of Alabama? They don’t tell us. If the population is 50,000 that is a terrible sign. If the population is 100 million, 31,000 cases is essentially nothing. If you are going to throw numbers at people, we need something for those numbers to be relative to. They also use pie charts. AHHHHHHHHHH!!! You can research online for yourself about the use of pie charts in good data visualizations. Also, what do the pie charts even show us? I assumed that the percentages are the percentage of postive tests of total tests for whatever category is in the chart, but the infographic literally does not tell us. I also could not find what they mean in the article that this graphic was from. One more note: The top left pie chart adds up to 100.1%. HUH?
In my redesign, I made sure to use an appropriate graph that gives us a clear picture of the whole story.
In this graph, you can tell exactly who these data is about. It also gives us some background. These data represent are positive cases separated by age group from all 358,319 tests, updated the week of 6/24. The rest of redesigns can be found in my critique, linked above.
Using appropriate data visualization is an essential part of Human Centered Design. More information on good techniques can be found here:
https://www.kixlab.org/courses/cs374-spring-2018/classes/17-Visual-Design/
https://faculty.washington.edu/ajko/books/design-methods/how-to-design-user-interfaces.html
https://socviz.co/lookatdata.ht
4. Your design should incorporate expressive and appropriate form of input / output
Let’s say you want to design a virtual drum set. After you perform research and collect data on drummers, you start to think about how to create this. Being able to play the drums on your computer seems like a lot of fun. How could you do this?
Here’s a cool website that created this project:
If you clicked the linked and played the drums, you noticed that you have to click each drum with the mouse, or press the corresponding key for each drum. Is this the best way to simulate the drum playing experience. One of my groups did not, so we went ahead and created a project where you can play the drums using the front facing camera.
To play, you move you hands over the corresponding drum pad circle. In this fashion, we simulate the drum playing experience to the best of our ability. The motion of moving your wrist onto the circles allows users to pretend they are really playing the drums, something you can not do by clicking a keyboard or mouse.
Our full medium post is linked here:
Each and every project will obviously be different, but as a designer it is your responsibility to create the best possible experience for users while using your product. Using expressive and different forms of input can be the difference of what makes a billion dollar product, or failing startup.
Here are some resources for more information about expressive forms of input and output:
https://faculty.washington.edu/ajko/books/user-interface-software-and-technology/#/body
https://faculty.washington.edu/ajko/books/user-interface-software-and-technology/#/hands
https://drive.google.com/file/d/0B9wW7gtF6dvRd0lrQUlpQVBHczg/view
5. Document Everything
A final point of my takeaways from HCI class is to document everything. This applies not only to design, but also to any type of work you may be doing. Documenting everything may seem like a waste of time, but is very important if we want to improve upon our original product. In computer science, a great example of this is using GitHub. With GitHub, you can track every change or revision you make to code, so that you can always revert back (if you use it properly). This way, you can revisit previous thought processes, take feedback, and improve upon it.
Documenting everything also gave me a clearer idea of what point we were at in each project. Our class only met twice a week, so revisiting project notes before we begin our work each class period gave me a better understanding of what needed to be done that day.
In my Design for Others project, we documented everything. We kept a running log of all our data and thoughts in a google document. This included the sketches and reviews shown above. Here are some of the other things we documented:
Conclusion
In my HCI course this semester, we learned about other various aspects of design. From this course, I believe I have gained important skills that will carry over to my job in the real world after college. I had no idea that the design process was so long, or that there are even set principles to follow. The five principles I highlighted are not the only design principles that will help you create a good product, but they are the five that I feel have the most influence on the design process when I am creating a product. Once again, careful ideation, targeted user groups, appropriate and appealing visualization techniques, expressive I/O, and proper documentation the five main points that I think about when designing a product.
