A software engineer loosely shares what he learned from attending CIID’s IDP course (week 2). This week (3/2~3/6) was the week to learn the basics of CIID’s Interaction Design (IXD).
This article is the English version of this below article.
There’s also a post for the week 1, so if you want to read it, please do. There is the link to the English version inside it.
Day 6: What is IXD?
Interaction design is so important to them that they incorporate it into the CIID (Copenhagen Institute of Interaction Design) name. Hence, CIID has its own ideas and processes and has taught them. First of all, on the first day, we were taught that “interaction design is meaning-making”. This is too abstract, so I’m going to go a little deeper into the elements related to “meaning-making”.
The Three Questions.
Mr. Bill Verplank is an outpatient instructor at CIID. CIID follows the idea of interaction design advocated by this person. We are shown the following video at the beginning of the class.
The following three questions exist in Bill Verplank’s interaction design. It’s “How do you do?”, “How do you feel?”, “How do you know?”. To put it simply, “What does a user do for a product? . And after you do something to a certain product, “What do you feel? . Finally, after sensing something from a certain product, “What do we learn? . These are the three questions. These three questions taught me the importance of creating communication between the user and the product. We were also taught that “designing how users think” through this loop is “meaning-making” and “interaction design”.
We made one prototype throughout the week, but this idea was easier said than done. I think the following words made it a little easier for me.
Tangible
The word “tangible” is called out repeatedly. It means “touchable and perceivable” or “visible”. Honestly, I was told this at the beginning of the week and couldn’t figure it out any more than literally. However, I feel that the most important element of this word is that it “exists”.
This week, we were given the brief of “designing an interactive product that connects the lives of people living in a certain environment with nature”. In response to this subject, we spent Monday and Tuesday discussing “What do we design?” We wrote out their ideas on stickies and looked for interesting topics, or wrote them on pictures and scrutinized each other’s ideas. But when we actually build a prototype on Wednesday and Thursday and see it in front of us, we thought, “Isn’t this something that users won’t understand how to use? or “Doesn’t this feedback make it impossible for users to understand our intentions? We have found many points of improvement.
I think it’s similar to the “prototype” of CIID’s culture that we learned last week, but I learned that “tangible” is one of the most powerful ways to learn when designing interactions.
Focus on habits.
Since we learned the importance of “focusing on the question” last week, the first thing we did this week was start by setting the question we were going to solve. As mentioned above, this week’s theme was “Designing interactive products that connect the lives of people living in a certain environment with nature”. This subject is too abstract, so I used the following framework to make it more concrete.
How might we (do something)
for (type of people)
in (context)
that (goal/intent/feelings)?
The framework is a kind of hole-in-the-wall problem, where we fill in each parenthesis to create our own question. Initially, our team failed to brainstorm for each parenthesis in this framework. The question of failure is the following.
How might we design a airplane
for long flight travelers
in the airplane
that makes them feel relaxed?
Initially, we created the question by focusing only on the user’s environment (context) and emotions. However, this turned out to be a design for space, with fewer looping do, feel, know elements. So the doctor told me that there was no habit element. I was also taught that “interaction design is the design of habits and the improvement of habits”. So we interviewed each other about our habits and realized that we tend to retreat to our rooms. So, I created a question that would change the habit of “I tend to retreat to my room”.
How might we decrease the separation between private spaces and natural world
for isolated people
living in cities
so that they feel less disconnected?
We decided on the question. I didn’t realize it at this stage, but I found out later that questions that focus on habits are very important when role-playing them.
Day 7: IXD Process
On this day, we learned about CIID’s interaction design framework. This is also a framework created by Bill Verplank, and it was very hard to understand. However, when I understood it, it was very useful because it allowed me to think about the design object in a simple way. (I’m not sure if I’ve fully understood this yet…)
In a nutshell, interaction design has four layers that can be broken down into eight elements: the four layers are Motivation, Meaning, Modes, and Mapping; the eight elements are Idea, Error, Metaphor, Scenario, Model, Task, Display, and Control; and the eight elements are Idea, Error, Metaphor, Scenario, Model, Task, Display, and Control. A detailed explanation is given in the article below.
In class, we watched the piano video below and received an explanation of the eight elements.
If you take the piano example and drop it into the framework, I think you’ll get the following feeling.
Idea: You will use the stairs on your own
Error: There is always a large queue in front of the elevator
Metaphor: playing the piano
Scenario: Hanako-san is getting on the train in the evening after school
Model: Keyboards
Task: Climbing the stairs
Display: emit sound
Control: Step on the stairs
I would like to elaborate on the “Metaphor” and “Model ” that were difficult to understand among the eight elements.
Metaphor is a door to the solution
The word metaphor means “metaphor”. The first thing our team did wrong was put Metaphor at the center of the experience as it is. We brainstormed tools and entertainment related to “nature”. And we were going to take that Metaphor that we were brainstorming and turn it into a straightforward solution. In a nutshell, our team chose “fishing” as our Metaphor, and we were thinking about the habit of using “fishing” to get users to feel nature. The teacher, who couldn’t stand this, told me to think twice about what the fun is in fishing. And we figured that what makes fishing fun is the “encounter with the unknown where you don’t know what’s stuck” and the “zen time of hanging the line and waiting”. We decided to put these two elements at the center of our experience.
At first I didn’t understand it at all, but now I feel that these two elements are exactly what Metaphor is all about. I think it can be discouraging to solve complex problems head on. However, I think that by putting this complex problem into a familiar image, they are finding a way to solve it. In other words, what makes fishing fun is the “encounter with the unknown where you don’t know what’s stuck” and the “zen time of dropping the fishing line and waiting”, so if we can apply this to our questions, I guess we can apply it to our own.
The article below was helpful in understanding Metaphor, although the frameworks are different.(only Japanese)
A model is an element that evokes an experience
Model is a further bite of Metaphor. Then, we design Task, Display and Control through the model. At first, our team took a pretty narrow view of the “fishing” factor. It’s like “throwing a fishing line” or “hanging a fishing line” or something like that. However, talking to the teacher made me feel that the Model should be broader and better. For example, I thought it would be a good idea to make the element of “fishing” not just “throwing a fishing line” but “throwing a fishing line where you want it to go”. Thinking about it this way, I can think of many things, like “Putting a special bait on it to catch a big fish”. The more concrete this model is, the higher the resolution of the Task, Display, and Control design can be.
The only thing you have to be aware of is that if you can only imagine “fishing”, you will only be able to make a “fishing rod” when you are prototyping. If that happens, you can go back to this model and reduce the number of elements or increase the abstraction.
Below are the eight elements that we have considered.
Idea: You can feel the nature
Error: My living space and nature are separated from each other
Metaphor: Fishing
Scenario: I’m lounging on the bed in my room before going to bed because I’m having a bad day at work
Model: Casting a fishing line, Waiting for a catch, Pulling a fishing line
Task: Shake -> Subtract -> Select -> Discard
Display: clattering, sound of something being stuck
Control: swing, pull, shake strongly
It’s fun to think about the feedback.
As a side note, I was taught a framework called Laban Movement. It was introduced as a breather workshop in class, but I enjoyed it so I’m going to introduce it. This was originally a framework for the emotional expression of dance, and it seems that some people are trying to apply it to design. I’ll post the article below.
In a nutshell, I’m experimenting with how people feel when they change the “Space”, “Time”, and “Weight” of some behavior, respectively. We did a “walk” in class, changing each one up. In addition, the class also added a “context” that told me to walk around as if this were an office, which made me think about how I feel and what kind of situation I recall.
Watching the video of this workshop in hindsight is nothing short of bizarre. Just walking around reminded me that when I’m troubled in the office, I’m walking at a steady, linear, slow pace. It was interesting to see how the emotions that could be imagined change depending on how you walked. This is a bit of a leap in thinking, but I thought that the feelings evoked from the given conditions and context are the feedback and the part of “How do you feel? And I thought it would be good to design and raise feedback using that condition and context.
Day 8: IXD Prototype
From this day on, we started to actually build prototypes. Last week I only had 3–4 hours of prototyping time, and this week I had two days to do it, so I had a lot of fun. It’s still at the elementary school level, but I think I’ve learned a lot even at this level. By actually making it, the issues that we didn’t understand in the discussion became clearer.
Nothing’s real until prototyping it.
This was mentioned earlier in the Tangible section, and I felt this very much when I was prototyping. I think we could have gotten enough points of improvement just by checking the three questions How do you do? how do you feel? how do you know?
I thought I understood Affordance and Signifier by reading “The Design for Everyday Things”. However, it makes us realize how unaffordable what we are making is. Without an affordance, you’re stuck with the How do you do? part in the first place. Also, if you have an actual object, you can add feedback by voicing it yourself while actually moving it within the team. In response to this feedback, we discussed “How do you feel? Then, in order to organize the three questions and understand the interaction, we listed the user’s “what they do,” “what they feel,” and “what they learn” in chronological order on a spreadsheet, as shown in the image below. We then built a prototype to optimize each do, feel, and know.
Furthermore, it was our own bias that we felt was the part that we had to be careful of and the part that was interesting. We’re the builders, so we know everything about the prototype. However, when I gave it to my classmates to use, they used it in a totally different way than I had imagined. When I saw him holding the handle and swinging his torso like a hammer, I realized how important affordances really are.
Can you role play?
When the team was feeling satisfied with the prototype, they asked the teacher, “Can you make a video of us role-playing with the prototype? He asked. Then we did the storytelling below to see what kind of scene we needed.
It was at this point that I realized how important it is to pay attention to “habits” when designing interactions. We had a habit-based framework Scenario for our team, so we were able to do this storytelling pretty quickly. I think the context was easier to imagine when it was based on habits, and it was easier to get the team to agree to narrow down the users. If I had come up with the initial idea and designed the plane, I would have had a hard time narrowing down the context.
The only thing that was interesting was after I finished storytelling and actually started filming the video. When you’re shooting while creating an actual situation, you’re like, “Isn’t it weird to use this in this situation? Or, “Isn’t this feedback weak in such a dark place? This led to a variety of discussions. As you can see, role-playing with actual situations revealed a lot of issues. I was able to realize once again that a product is not complete by itself, but has a context.
As a side note, making design into a “habit” made this kind of role-playing easier, and since it’s complete in your own neighborhood, I thought it was a quick improvement. On the flip side, I was curious about the ways in which people are designing special experiences like airplanes and movies.
Day 9: Polish Interaction
On this day, the day before the presentation, I devoted myself to crafting the interaction. I built in a table of interactions from the day before and created a production for the final presentation by improving the accuracy of the role-plays. So, I would like to introduce the advice given to me by my teacher.
Keep moving.
Honestly, I think our team felt satisfied with the way we did it. After that, I think there was a feeling that we could make minor revisions toward the final announcement. At least that’s how I felt about it. The teacher, sensing this, came to me and said, “Keep moving! Push forward!” Anyway, don’t stand still and move on! That is. Hearing these words, we looked at our prototype again. We used our own prototypes again to find out if there was any missing perspectives, and checked the meaning of each interaction. So I went back to the Metaphor of “fishing” again and discussed what each interaction represented of “fishing”.
The concept of our products was to “collect the world’s natural landscapes like fishing”. Then the team thought, “Why don’t we put the collected scenery in a tank like a fish and preserve it? In fact, the idea was adopted, and the final prototype was made with a lid added.
I don’t know if I was able to embody the meaning of my teacher’s words “don’t stop,” but I thought I was able to incorporate some interesting ideas into the final prototype. As long as I have time, I’ll touch the prototype and try and repeat. Then, once the idea has boiled down, you can raise one layer for further inspiration. I wondered if there were any improvements that could be made if it was tangible until the end.
Don’t make it too complicated.
At first, we misunderstood the aforementioned “don’t stand still”. We were looking for more realistic sound effects to make the feedback sound more realistic. Then the teacher came to me and said, “Partial optimization is good for later. Check the overall optimum. He said. In the end, we decided that the sound effects would be good enough if people could make them with their mouths, so we went back to storytelling again and tested the prototype.
To be honest, I was aware of this when I was working in Japan, but I completely forgot about it and made it up as I went along. I actually showed a video of me role-playing the game at the end of the presentation, but the sound effects were enough for my mouth, and I don’t think anyone cared about that. I thought it was important at this stage that the story made sense and that the prototype fit into its context.
Day 10: Presentation
This was the day to announce the project of the week. We made a prototype called “Scene Fisher”. A total of four prototypes were made. Photos of the prototype and presentation materials are below. (I’m sorry I couldn’t show you the video due to authorization.)
This week was a lot of fun because I got to spend a lot of time working on the prototype. I also feel like we were a good team because we were able to talk more within the team than we did last time and we had a lot to contribute. (Talking is a pretty low goal) I think this was a very important week because I’ll be prototyping in the future using this framework.
Next week will be a more technical class as we have an electrical circuits class. I’m looking forward to being able to embody more of the fusion of technology and design. I’d like to use technology to create something tangible quickly!
There’s also a post for the week 3, so if you want to read it, please do. There is the link to the English version inside it.