Zalo is a top leading social network app based in Vietnam with 100.000.000 users mostly in Southeast Asia and still counting. The app does not make it easy for users to add new friends like Facebook but succeeds in making each connection a meaningful one.

What I did

-Design and rebrand Zalo. 

-Develop wireframes and product design for the latest updates

-Developed a visual language across both iOS & Android platforms

-Set and lead design/UX/UI strategy and process

-Mentor and lead product team in user research and testing.

-Create user-centric designs through intuition, experience, and data

-Present new design direction to CEO, VPs, Engineer and Product teams

-Travel to Vietnam and mentor design team ​

The BRIEF

40 Million users in less than 5 years

 

I remember Vietnam 5 years ago, the social network space was crowded with apps from foreign countries like Facebook from the US,  Wechat from China and Line from Japan. At the time the country just signed WTO and most local brands were killed by the international brands. Despite the harsh condition of the market, Zalo still thrives and beat most international brands and became the second leading social network app to Facebook. 

 

THE PROBLEM

 

-Zalo is a pure Vietnamese product. The design was tailored to appeal to the locals only and it does not offer the universal experience to take Zalo to the international market.

-The design language was over 5 years old and it was done quickly during the startup stage. 

-There was little effort toward design thinking which led to a weak foundation of what the product/brand is about.

-Top-down culture still dominating the company instead of customer first approach.

-Cultural barriers between East and West.​

The SOlution

 

 

Zalo sponsored several trips for me to fly to Saigon and meet with the team. This gave me the opportunity to talk to almost everyone team from product, brand, marketing, engineer team to better understand and pick up patterns of the problems. I also work with the product team to set up user interviews to learn both internal and external POV. This is also part of guiding the team on putting customers first.​

"Customer first. Not Ego"

The team wanted me to start the design fresh but also want me to understand the Vietnamese customers. So that we can come up with a design that not just new but also familiar to the existing customers.​

We started out with the main navigation of the app. We found out that one of the key problems was the current structure allows users to view content but there is no easy way to create new content. This limits the user from interacting with the app or with others. The idea was to introduce a contextual "Create" button across the main tabs to create new DM, new contacts, a new group, or even scan a barcode or make payment. Here are some of the very early prototypes:

In these prototypes:

-We explored many different directions with "Create" button being on different locations like bottom right, top right, in the middle of the main Nav. We were interested in the last prototype with the camera button in the middle because the team wanted to promote video/camera features.  

-We explored using line icons instead of filled icons like before to reduce visual weight.

-We moved the main navigation to the bottom since phone screens are getting larger every day and users often use the phone with only 1 hand. ​

CROSS-PLATFORMS DESIGN

At the time, Android and iOS had two different structure. Android used Material Design and the main navigation was on top (Google later updated the location of the main navigation to bottom). On iOS,  the main navigation has always been at the bottom. It makes sense to just adapt to the platforms. But my argument was that guidelines don't define how people respond to the experience. Android or iOS the users will continue to use one hand with their thumb switching between tabs. We discussed, chatted and we decided to make the nav. work universally to the bottom of the screen on both Android and iOS.

By the end of that business trip, we were kind of happy with the directions. I was on my airplane ready to get back to California. I opened up my messenger app. I saw Facebook updated the app with the exact same direction as the "Create" Button in the main nav.

Note: Latest Messenger App. Not the one that Messenger had a while ago.

A REBRAND

Not just that, the overhaul redesign of the Messenger app is quite similar to what I am heading to. Messenger no longer use their colored header banners, it looks quite minimal. But there are differences like New Messages button location. The New Message button on Facebook quite vivid and getting in the way of the content. However, everything that I was working on is just a prototype so nothing final yet.

 

Later that week, the team had the discussion. Some said that it was coincidental, some said I spy FB and offer that design to the team. The conversation was interesting but quite upsetting because Trust was not there. As a result, I had to move away from direct and keep the Main Nav without the "Create" button in the middle. We went back to many of the ideas we had and go with the top right location of the page. 

 

 

We started the process with user research. I worked with the design team to come up with sketches, we sat together in a room and just talking about what matters most to the company and the customer. 

The original logo was created during the startup stage with no customers. The team has expanded to thousands of employees and still count, Zalo is no longer a startup, it is a multi-million dollars company. Trust is what important to the customers, Zalo should be a company that continues to build a strong relationship but with a mind of a mature entity. The design has to speak for the growth stage and move away from the cartoonish look.

With 60 Million Users at the time, change is scary. The team wants a design that is upgraded but not too far from the original. If this succeeds, this design will be seen by a nation of people and I was under some pressure. I wanted to do it right.

We captured good ideas from paper to computer and have interviews with the customer the next day. We repeat this stage quite some time until we narrow down to the best direction. Once we have something that works with the customers, we start to improvise even more than present to the stakeholders in several rounds with data in mind. The key to this process was to understand what the user think but not totally rely on statistics and numbers to pick our direction. It's a combination of art and data to decide what's best for the company in the upcoming years.​

 

We narrowed down to 3-5 options then apply them to contexts like app icon, intro, and welcome screens. I tested these designs with customers and continue to narrow it down further more.

In each set, we also explore iconography, colors, layout, graphic design. This process took several rounds, the debate was how much change we can apply in the new logo. We had options reusing the bubble chat background, logomark, first letter Z. The took the same approach for the UI, we didn't want to freak people out if the app looks too different than the current version.​

The final stage of this part gave us two distinct directions. One using only the logotype, this direction is less risky but limits the option to have an icon like other apps company such as Snapchat, Apple, Microsoft. The other direction was to use logomark, the logomark open doors to many possibilities of Zalo visual language. However, this direction will ask the user to relearn about the brand and it may not be the best thing to do right now.  The team had a lengthy conversation, took both directions to test and even thinking of introducing the logomark in the app first, get the user to know the new icon then make it into the app icon later on. 

 

From test results, the team decided to go with the logotype for now as the new design is already brand new to the customer.​

Here are other design explorations of this project:

The outcome

-In this project, I've learned the differences in working cultures and perceptions. It is not easy to translate what's working in the West and apply to the East. I believe the way people interpret design depends on the language and the culture around them. Localization is the key to success.

-To date, the app continues to grow and Zalo user base just reached 100 Million users. 

-I am grateful for this opportunity and get to know Zalo team.