A Whole New Toped Universe

Stevanus Kurniawan
Tokopedia Design
Published in
8 min readNov 14, 2019

Have you ever thought to create a big change to your company?

Initiating big changes in a big company like Tokopedia is not easy, especially when you are dealing with the face of the company (the brand image), that has been considered as a “sacred” thing (can not be replaced, nor be changed because it’s already pretty familiar and stick to our user’s mind). Once you started to iterate this, you will also be dealing with a lot of things, be it user’s perception, or even the approval from the Company itself.

Yes, it’s about changing the mascot of Tokopedia, our dearest little Toped that is already existed and close to people’s hearts.

I’d like to tell you a story of how we brought up the whole new universe of Toped to the company and how did we conquer the hesitation.

The Excitement Began

We never had any thought to explore this before. Who would ever think to explore this? Toped has been the company’s mascot since 2014, and everyone loves it, people are familiar with it. The connection between the mascot and the company is pretty strong (it’s been successful as a company’s mascot).

Product design team put a vision of what we wanted to aim in 2019 (it was December 2018 back then). We knew that on August 2019, we’re going to celebrate Tokopedia’s 10th Anniversary, so we gathered a team and mapping out our timeline towards a new look of Tokopedia design (especially in product side). Illustration was a part of the list that we want to improve. I was in charge of it, but honestly, I had no idea what it would be. Then I started to collectively stored and listed down all illustrations that already live in productions from different tribes, not knowing what to do next.

After several meetings, our Head of Product Design, Momo, jumped in and initiated the idea of iterating Toped’s stories. The discussion escalated quickly to the roots of Toped. From the very beginning of Toped, we never had the background story of it. We don’t know if Toped is a He or a She or genderless, does it have parents and family, or even where does it live. All those questions running through our conversations and the atmosphere began too exciting!

Let’s Just Start It! #MulaiAjaDulu

The direction was a bit clearer now. We need to know how did Toped firstly brought up to public. Did it has a story? Then we set a meeting with Creative team, designers under marketing team, the one who took care of Toped from the very beginning. It turned out that Toped didn’t really have any story at all!

We started to question how are we going to redesign our illustration’s style, be it colors, shapes, or anything. For the very first time, product design and creative team are collaborating to prepare something new!

“New” for this sacred thing is something that sounds a bit tricky and challenging. Creative ever made several initiatives about Toped changes, from 2D style with an outline, to 3D and even tried to bring new human characters to accompany the Toped but got rejected by the stakeholders. This fact made us a bit more pessimistic. We knew that Toped is sacred, and we felt like we only have a small chance to goal the initiatives. We were lucky that Momo cheered us up by saying “Mulai Aja Dulu” (Indonesian phrase for “let’s just start it”), which then brought the spirit inside us. We might have a small chance, but who knows what will happen next?

We began our research on how we should drive the initiatives, what is the right process to get it done, and of course, we made a comparison with others. After collecting data, we reformed our big question: “How might we improve our own illustration?” into 3 main questions that will drive our initiatives along the process.

  • How might we engage our users better through illustrations?
  • How might we stand out from other players?
  • How might we provide a limitless playground for storytelling to build delightful scenarios?

A Given Trust

Once we finished the draft of our proposal, Momo sent it with no doubts. I actually didn’t know what’s on Momo’s mind back then, what a brave action! We kept saying “All is well” and pray for the best result. We realized that we only had a little chance. If we got a little blessing we will make it happen, but if we got rejection or doubts from the leaders, then we were done.

At 1:11 AM, January 31st, 2019, Momo sent us one screenshot of her e-mail that says that our CEO, William Tanuwijaya is showing his support towards the project!

He also share his opinion regarding the illustration’s direction that we’ll explore. This information really meant a lot for us, a given trust that could not be wasted, our hope rises.

Mapping The Imaginations

How did we start the development process? It’s simply answering all of the questions that we’ve stated before! To answer those questions we need some action plans. We had to answer the backstory of Toped and we need to define the Toped’s environment, friends, villain, etc. There’s no one correct way to define it, it’s even possible for us to brainstorm and define it on our own, but we didn’t want to do it. Instead, we prefer to include more people from different perspectives to build this stories.

We believe that Toped is not only belongs to the company but to everyone in the company, Nakama.

Nakama — Business Strategist, Marketing, Product Manager, Designers, Writers, Brand Strategist, Social Media Strategist, Researcher and VP of Product

We would like to know and listen to their perspectives about this mascot, we want us (Nakama from different roles and positions) to gather and define the future of Toped. To fulfill this objectives, we came up to initiate a workshop way before we explore the illustration process. We gathered people from different backgrounds, designers and non designers, junior to lead level to sit together and share their imaginations, created Toped’s new story under one believes — Everyone is able to imagine!

Cooking the Ideas

Bunch of ideas were coming from the workshop’s output! It’s time for us to cook those imaginations. We shouldn’t waste those ingredients but we couldn’t put them all to our cooking. Then we started to map the ideas and brainstorm which idea should we develop more and which idea that we can combine to support other ideas and enrich the stories, or which idea is not possible or way too far from other stories.

Finally, we had our first draft of Toped and his stories (Yes we agreed that Toped is a he!) Check Toped’s new profile out:

Toped’s new profile

From the draft, now we also had a direction to explore and define new characters aside Toped as the main hero. Even though we had the direction to explore the characters, defining the characters design visually is another challenge. We also experiencing how our design direction feel stuck, but thankfully we then expanding our team.

We invited more designers from Product Designers who are passionate in illustrations to get fresh perspectives. As the core team grew, so did the ideas. We went even crazier on the iterations, tried more possibilities, and breaking the boundaries and finally we found our core design direction! After running through multiple meetings and alignments, bunch of iterations, we finally completed our proposal of a whole new Toped Universe! (Let’s see a whole character design process here)

Wait, this is not the end of the story, we need to pass the last chapter, Management’s approval.

The Babies were Born!

This is the final chapter before the babies were born, Momo passed the proposal to stakeholders. The tension was doubled from the previous approval (when we pitch the idea to explore the Toped). We’ve put a lot of effort, given our time, mind, and heart to this project. Again at night we got the breaking news, it was 23:46 this time!

“Great Job Momo and team. This looks great and amazing,” William said.

All the hard work paid-off, we were near to the “birth-day”! (it’s literally near, it was May, 4 months prior to Tokopedia’s 10th anniversary). Well, we didn’t have time to celebrate, not until we presented our babies to the world. We were asked to launch this Toped Universe in our own platform first with “Make it Happen” approach. We started mapping out and plan all possibilities to implement this new illustration in the product. Considering the effort, timeline, and man-power, we need to set our MVP (list of priorities). How did we set the MVP?

The definition of MVP for this project was how might we show the new illustrations within the most visible pages of user’s journey in our apps (apps have more traffic than desktop). We were mapping out the user’s journey from the very beginning till users do check out.

User’s journey mapping for MVP

Sync up with the leaders from related tribes to get support of this Toped Universe implementations, and also working closely with Apps team within tight timeline (it was only 1 and a half months of development cause we would have an apps — freeze 2 weeks before August — Anniversary event). Finally we managed to deliver the MVP to the users on August! You might ever saw these on our apps :)

Splash Screen and Empty Cart by Sonny Rakhmadi, Waiting for Payment by Jevon Kadim
Lucky Egg Pages by Jevon Kadim
Rating Apps by Stevanus Kurniawan
Lucky Egg Floating Button by Jevon Kadim
On Boarding by Jevon Kadim, Jovanika, Sonny Rakhmadi, Rachel Kurniawan, Ivan Bayu

We didn’t expect for more exposure, but the universe gave us an extra, these babies born beyond our expectations, they became a key visuals for Tokopedia’s 10th anniversary Marketing & Events, check this out:

Key Visual for 10th Tokopedia Anniversary Event
Key Visual for Anniversary’s Billboard

To Infinity and Beyond

Looking back to the very beginning of the story, we never knew that it goes beyond our expectations, all of these starts with small steps along with our legendary taglines #Mulaiajadulu..

What’s next? We don’t know yet, but we believe there are a lot of opportunities to expand this whole new universe. Credit goes to the wonderful team and all who have helped us to Make it Happen!

The Core Team of Toped Universe

Core Team: Ignatius Gregory, Raymond Kristanto, Jovanika, Fahri Syadia, Monika Halim, Judho Pratama, Jevon Kadim, Stevanus Kurniawan, Dania Nadira, Kemas “Acil”, Sonny Rakhmadi, Guruh Jaya, Febrian Wicaksono, Pui Enawati.

Product Implementation Team: Product Leads, Product Design Leads, Apps Team (Oka Surya, Meyta, Oscar Yuandinata, Abram Situmorang), Motion Designer (Ivan Bayu, Rachel Kurniawan, Novi Sucianti).

--

--