Localise Design with Context

16 Aug23:00 – 23:20 UTCTalk

Checking session availability…

Hang tight while we load the latest updates.

In this session, Paya will discuss different perspectives on design coming from a Japanese and US background and while currently residing in Stockholm

Localise Design with Context

at UXDX APAC. Video: https://www.youtube.com/watch?v=lslWr9eT3yY

Readable transcript: edited from the recording's captions for readability (fillers and false starts removed, punctuation and section headings added). Wording is the speaker's own. Timestamps are positions in the video. Names marked [?] could not be verified against the audio.

Introduction

[00:00:03] Hello everyone. My name is Paya [?], and I am currently a design lead at Klarna in Stockholm, Sweden. First of all, I want to thank the kind friends at UXDX for giving me the opportunity to share this talk today. My talk will be about how to localize design with context, based on my experience in Japan and Sweden, and how to make a better product. Let's get started.

[00:00:31] A little bit about myself. I am half Vietnamese, half American. I was born in San Francisco, and since then I have lived in the US, Vietnam, Singapore and Japan, where I lived for about 15 years, and I moved to Stockholm, Sweden, over two years ago. I worked for Action Name Group [?] and Klarna after I moved to the country, hence the "hello world" in four languages. I studied political science, but then I chose to become a graphic designer 10 years ago in Tokyo, and since then I have worked with different clients in the e-commerce and fintech industries. My clients included Raven [?], Diesel and Michael Kors, I worked with Amazon Japan, and also Mercari, the biggest e-commerce C2C marketplace in Japan.

[00:01:22] On a more personal note, I love music, I love collecting vinyl, and hiking; I just went hiking in Spain. I love a lot of impulsive adventures, like the skydiving photo on the right.

Two cities and the cultural and social aspect

[00:01:37] Let's go to Tokyo. This is a photo I took of Tokyo before I left the country. In Tokyo there are about 38 million residents; it's a very highly populated city. And this is Stockholm, where I am currently living. Stockholm is smaller, with more greenery, more white space or negative space. So, one question: how do you navigate two such different cities? This brings us to the first insight I will share: the cultural and social aspect.

[00:02:17] This is a very beautiful minimalistic design, and it's from Muji. Muji is a very popular Japanese consumer brand, not only in Japan but also globally. A lot of people think that Muji is focused on minimalistic design, but actually Muji in Japanese means "no brand" or "unbranded". Muji embraces emptiness rather than minimalism, and they focus on the functionality of the product more than its visual aspect.

[00:03:04] This is a soy sauce bottle. This design is actually one of the most prominent industrial designs from the 1960s, and the designer is Kenji Ekuan. He's one of the most prolific industrial designers in Japan, and he also designed the Japanese bento box and the bullet train. What makes this soy sauce bottle very special is that before this transparent glass bottle, a lot of Japanese families used a ceramic bottle to store their soy sauce, so this has more functionality. This is one of the most prominent Japanese designs that's still being used to this day.

[00:03:54] Here is an orange bag that I came across a lot when I first moved to Sweden. It's everywhere on the streets of Stockholm. It's very straightforward: there's a logo, the bag is huge, and there's a website and a phone number. This is for Swedish people who want to throw away waste that is too bulky. They can call the number, or they can buy the bag online, and they can just leave it on the street, and it's really easy for the people who work for the company to notice the bag and collect it for you. You pay a fee, of course.

[00:04:31] This is connected to the lagom principle, which is very Swedish. It means just enough: not too much, not too little. Scandinavian design back in the 1930s focused a lot of work on constructivism and functionalism, and in some cases surrealism as well. A lot of designers in the 1930s in the area started a golden age of Scandinavian design.

Visual noise and progressive disclosure in Tokyo

[00:05:07] Let's go back to Tokyo for a little. This is the busy street of Shibuya, Japan: a lot of visual noise, a lot of color schemes that are vibrant and very high contrast as well. A lot of people who haven't been to Japan would be very overwhelmed by the amount of people and the amount of visual noise, like in this photo.

[00:05:33] However, if you go to a Japanese train station, you will see a lot of signage like this, to guide you to where you want to go. This is called progressive disclosure. It's an interaction design pattern that sequences information and actions across several screens, for example when we design a step-by-step sign-up flow. Japanese design focuses a lot on these kinds of behaviors. The purpose here is to lower the chances that the user will feel overwhelmed by what they encounter. Japan is a very heavily instructed society, and many design companies in Tokyo have a lot of big public design projects.

[00:06:21] Another example, on the right, is the information board when you go to a train station. Everything is color coded, with different font sizes. One could say, "This is too much for me, I don't understand what's going on." But a lot of Japanese people are more tolerant of heavy amounts of information when it comes to visual cues, and they're more familiar with consuming a lot of information without much white space at all.

[00:06:55] Another fun example: Stockholm and Tokyo train stations are very different. The Stockholm train station is very simple, a bit empty; I took this photo in COVID times. But the Tokyo train station, again, is very yellow, and it's really easy to navigate if you're already used to it. The yellow sign in front of the door here indicates that only women are allowed inside the car.

Layout, typography and search patterns

[00:07:28] Let's talk about layout and typography. This is a department store poster. When I was living there, I still had to work a lot with print ads, even though I was working for an IT and tech company. As you can see here, there's not much white space, but I had to learn how to play around with hierarchy, how to break the line, and how to play with different hierarchical contrasts in order to prioritize the content. The lesson learned here is to utilize contrast, different images and different colors, because in Japanese typography we don't use lowercase and uppercase, there's no italic, and there's not much space between characters either.

[00:08:31] And how about the search experience in Japanese society? This is a train poster inside a car. It's a poster telling you how not to behave inside a Japanese train. I thought it was really funny, because the bad guy here is seemingly a Caucasian man with blonde hair. So what is this about? You just have to type in the keyword, like in the red box, and go to search. This design pattern is actually very familiar to Japanese consumers, because they lived through an era of flip phones, and back then people were using Yahoo search more than Google search. Even until now, a lot of older Japanese smartphone users still prefer Yahoo search.

Spotify's unified principle and Scandinavian white space

[00:09:29] And Spotify, in Sweden: a very successful streaming company based in Stockholm. One of the design principles from their design system or design guidelines is "unified", meaning everywhere that Spotify designs, they want the experience to be seamless, to reuse the design patterns and adapt them for consistency; nobody should be reinventing the wheel.

[00:10:00] However, I found some interesting examples from Spotify when they first came to Japan. They didn't do a good job with the typography on the website. For example, there's a line break here that is not correct and doesn't make sense, and it can cause some misunderstanding. It's just very deformed, and the typography here is not very consistent. In the eyes of customers in Europe or the Nordic region, some design can be seen as bad design, not very pretty. But sometimes Japanese or Asian design is not bad design; it's just design that we might not be used to and have the least context for, because I believe we're still living in a world of heavily Eurocentric design. But I think Spotify is doing a better job now. The last time I saw it, I think they were doing a better job with the typography and the website in the Japanese language.

[00:11:11] Another example, a positive example that I really love, is from a Swedish musical device manufacturer, and this is their e-commerce website. It's very beautiful, and the white space is designed to be functional: it's used to divide between groups of information. The design here is very light, very open. This is one of my personal favorite design principles of the Scandinavian region: they favor functionality over form, and they use a lot of negative space to create function.

E-commerce journeys: Uniqlo and Klarna

[00:11:56] Let's move on to some e-commerce or digital app journeys. The first one is the Uniqlo app in Japanese. It's very different from the typical e-commerce website or app in the English language. On the left side is the home page. As you can see here, there are no items listed; instead, a lot of Japanese users are used to seeing a lot of promotional images on the home page, and then they know how to navigate to the right item they want. The customer journey here makes sense for Japanese consumers because, again, they are very tolerant of heavy loads of information.

[00:12:44] But the website hierarchy also gives the Japanese user more context: what's going on, what items are on promotion, what's the news, what campaigns they're offering. The typical e-commerce journey here is that the Japanese user takes time to read the relevant information, they understand the context, and they know how to look for the item they want. They navigate, they go to the item detail page, and they decide to purchase or not.

[00:13:17] This is Klarna. This is the app home page; if you have made a payment with Klarna, this is usually the home page that you will see. As you can see here, the functions and the information are laid out in a manner that's very familiar to, I would say, a lot of European or North American users. The app here has a more analytical design approach, and it focuses on the specific needs of the users by laying out the categories. European customers typically don't want to spend a lot of time finding what they need, and therefore the navigation needs to be very straightforward and efficient. The non-Japanese customer will look for the relevant information, navigate, go to the item detail page or the page they want to see, and decide to use the function, or decide to make a purchase.

Inclusive design and an aging population

[00:14:29] The last topic I want to mention about localization is that inclusive design matters regardless of culture. The last project I was assigned to before I left Tokyo was that I had to go to different rural cities around Tokyo to conduct user research with senior Japanese internet users, and I learned a lot. Both Japan and Sweden have seen a prominent trend in improving digital experiences for users of all age groups and all abilities.

[00:15:06] Japan is also very much an aging population. This is one of the clearest examples in which Japan, Sweden and many Western countries share a major social challenge: an increasingly aging population, and how to use digital products for healthy aging. After moving here, I feel like my effort in this area of universal design has strengthened more and more, and a lot of companies nowadays are focusing more on improving accessibility when it comes to design, and engineering as well.

Summary: context is everything

[00:15:51] The last point, and this is a summary of the talk today, is that the ultimate design is very different from the natural world. Beyond trying to fulfill the functionality of our design, empathy is also the tool that helps you understand who is right for your product and who is wrong for it. Context is everything: a design can seem bad because of a context that you haven't gotten used to.

[00:16:20] I have worked in Tokyo for the past eight years, and I often heard comments about popular Japanese digital apps or design as some kind of bad design: too much text, too many images, not very visually pleasing. The truth is that many of us have already gotten used to the Eurocentric design workflow. As designers, we also love to create principles to apply or reuse in many contexts, but customers are different, so we shouldn't use a singular strategy on our users. Smart designers should study how the principles can make it hard to do good design, so we can make a better one.

[00:17:15] In short, please promise me to unlearn our existing design patterns and behaviors, and listen to our diverse users, in order to localize our design correctly, because no persona can represent the real customer in the real world. This is the end of my talk today. Thank you for listening.