Inside Marketing Design at Chargebee

Welcome back to "Inside Marketing Design." I'm Charli, I'm a creative director in tech, and this is a show where I get to learn from folks who work on brand and marketing design at other tech companies, and it's all recorded so you can learn from them too. 

‍

Today on the show I'm speaking to Shakthi Hari who is a design manager at Chargebee. Chargebee is a platform that helps businesses manage subscription billing and take payments. They're a globally distributed company of around 1,200 people with the majority of them based in India, which is where Shakthi is too. He joined the team about a year and a half ago and you're gonna learn a lot from him in this episode about systems and workflows for scaling output with a relatively small design team compared to the size of the overall company. 

‍

Before we get to that though, I wanna say a huge thanks once again to Webflow for sponsoring this season of the show. If you haven't used Webflow yet, you should try it for yourself to feel just how powerful it is to bring your designs to life on the web without having to actually like write code. For us designers, Webflow looks and feels very much like a design tool. You add elements to the canvas, you style them, but unlike a lot of other drag-and-drop website builders, Webflow is writing nice, clean code for you in the background. More than three and a half million designers and teams are using it to create scalable, beautiful websites. So check it out for yourself at InsideMarketingDesign.com/webflow. But now, let's get into it and take a look, "Inside Marketing Design" at Chargebee. 

‍

Welcome to the show, Shakthi, I'm really excited to have you here and to be learning about marketing design at Chargebee.

‍

Shakthi:- Thank you very much, Charli. I feel great today and tremendously honored to be on the show specifically because my team watches and we discuss the key takeaways from the episodes on a regular basis. So it really feels good to be on the show to share our story with everyone. So I really hope the audience finds this session useful.

‍

Charli:- I'm absolutely sure they will. Let's get into it. Let's give people the lay of the land. Tell us about the marketing design team at Chargebee. Who's on it? How is it structured? Where does it fit into the company?

‍

Shakthi:- Chargebee is a huge organization with an exceptionally well-defined marketing team. So there are at least like 15 functions or sub-departments within the marketing team, like product marketing, pipeline, content, brand partnerships, regional marketing, events, et cetera. So it totally comprises around 75 people right now. Talking about the marketing design in specific, we are a team of 14 people, eight of us are designers, out of which there's a design manager, a design lead, three mid-to-senior level designers and there are two junior designers. The other six actually comprise of developers, out of which there's a front-end development manager, two senior developers and three junior to mid-level developers. So the entire team of design and development is headed by a manager who in turn reports to the chief marketing officer. Collectively, we all work together in enabling the marketing team in achieving its goals by creating webpages, even setups, collaterals like brochures, ebooks, ads, et cetera, and sometimes interesting swag items. It could be running a product release campaign or successfully launching a product or helping the events team host an event, et cetera. That's how the team is structured.

‍

Charli:- So lots of different stuff. And within the marketing design team, you're a design manager, right? What is your role and how many people do you manage?

‍

Shakthi:- My role as a design manager is first to ensure that the team sticks to its business commitments and enables the marketing functions to achieve their goals. The role actually comes with a handful of quintessential responsibilities like resolving conflicts if they arise, keeping the team motivated, treating the team with respect, providing them the space and the resources they need to grow, being inclusive, et cetera. But I personally feel that I'm responsible for the growth of the people I oversee personally, which means that my job is to help them develop their skillsets, both hard and soft as soon as and as strong as possible. I directly manage a team of four people, two junior designers and two mid and senior-level designers. And I report to my manager who is also a designer. He reports to the CMO and is actually responsible for the outcome of the entire team.

‍

Charli:- And you said that there's a bunch of different, like lots of different marketing functions, but am I right in understanding that the marketing design team isn't split by function? That it's like one designer could work on the website, they could work on event stuff, or do you split designers based on marketing function?

‍

Shakthi:- There is no particular designer assigned to work on just one marketing function, but we definitely have specific point of contacts who's responsible for all the design and incomes and the design requesting flows and how we cater and deliver this design request. And the ratio between the number of designers versus the number of marketing functions actually differ a lot since we are just a number of eight people, we couldn't obviously, you know, sit and just cater to one particular function, but rather we act as the point of contact. We check in on whoever is working on the design request, we sit and talk with the particular function leads to understand or gain visibility over what may be coming in the next few weeks and so and so. That is how we operate.

‍

Charli:- And what marketing functions are you a point of contact for?

‍

Shakthi:- Right now, for the past two to three quarters, I have been the specific point of contact for the pipeline and demand generation team. So I've been acting as the pipe through which the request flows and I ensure that all the requests from this particular function gets fulfilled irrespect of who is the designer working on that particular task or that particular project.

‍

Charli:- Right, so it could be even a designer not on your team who is working on something but you are still making sure they've got the information.

‍

Shakthi:- The team structure doesn't actually have to do anything with, you know, the specialty of or the practice of the designer in particular, or it doesn't have to do anything with the function we cater to. So almost everyone in my team is kind of a design generalist with a strength in one particular thing like illustration or web design, and everyone wants to work on everything, right? So it's a pretty coagulative and accumulative set of tasks that everyone works on.

‍

Charli:- That makes a lot of sense. Tell me about how you collaborate with other designers within the company. 'Cause I'm gonna guess that there's more than eight designers within the whole of Chargebee. So how do you like collaborate with those who are working more on the product side for example?

‍

Shakthi:- The Chargebee's design teams are not under the single umbrella, right? So there is a product design team that's spread across the globe. There's a wonderful team of internal communication designers and then, of course, we have the marketing design team. Though we are not part of the same team, you know, we have mutual respect for each other and we connect on an as-needed basis. We connect to share with each other and we try to let each other know what we are working on and try to get feedback. Though regular connectivity is not guaranteed, we have managed to collaborate successfully. For example, we have been working on a design system for the web lately, right? Since the product designers have experience with design systems and in maintaining them, we share our work and try to get criticism or fresh perspective on what could be improved. In fact, whenever the head of product design flies to India, we meet with the team and exchange ideas. The Chargebee design website we currently have was also done collaboratively. One other example could be how we collaborate with the communication design team, which has experts in motion design and storyboarding, et cetera. So whenever we need to create explanatory videos for the website or the Chargebee docs webpages need to be updated or we need interesting videos done for any of the A1s, we seek support from the . That's how we collaborate.

‍

Charli:- And does most of this collaboration happen like through Slack, like through some sort of internal chat thing? Do you have regular meetings on the calendar?

‍

Shakthi:- We do not have regular cadence where we connect and discuss these ideas, but like I said, it's done on a on-need basis. So whenever there's a project and most of the times, we just connect to chill and talk with each other.

‍

Charli:- Nice. I like that. And what about your collaboration with the marketing team? So it seems like, you know, you have these points of contact who the marketing team knows who to speak to for, you know, whatever the work is that they need. But what else? What else goes into collaborating with marketing? Do you have regular meetings with the marketing team? Are they joining like crit sessions to give feedback on work the marketing designers are doing?

‍

Shakthi:- The marketing team as a whole has a weekly cadence where we connect with the entire team, we have a set agenda set by the marketing ops team.

‍

Charli:- Let's jump in and talk about the design system that you're working on. How did the need for this arise? Like what problems is it gonna solve having a design system for the marketing side?

‍

Shakthi:- The team has, you know, always been aware that it lacks master design system for the web since the very beginning. But the pace at which the company grew made it challenging to find time to create a single source of truth. We had like just five designers and developers back in 2020, but when we had a chance to scale to the team that we are today, we figured that it was high time we create the DLS and automate a few steps in on the website production. We kind of started the DLS project almost a year ago. The primary objective of the design system is to, of course, create a digital first and consistent, flexible and importantly, modular system that can help us position as a global technology brand, right? Chargebee currently has around 1,400 webpages in our repository in at least like four different languages.

‍

Charli:- That's a lot of webpages.

‍

Shakthi:- Yeah, I know, right? And all these pages were created and hosted in multiple platforms like Contentful, HubSpot and in our backend repository. So currently, just 30% of our webpages follow a template or format that can be reused and the go live time for a webpage post the design phase is almost two to four days now depending on the complexity or the kind of interaction required or the structure of the page. So the scope of our project is to bring in at least 80% of the webpages into a template-based structure using CMS tools and to reduce the goal lifetime by half. So the ultimate goal is to be really fast with the website production by automating as many steps as possible in the process.

‍

Charli:- Wait, so you're saying that the current time that you're trying to improve on is two to four days and you're trying to get it even shorter than that?

‍

Shakthi:- Current time for website production we currently have is two to four days and we want to cut it by half.

‍

Charli:- That's amazing goal to like think that you wanna be able to produce pages just in one to two days. 'Cause for a lot of companies, two to four would be like, you know, fast enough. So I love the ambition, I love that you're doing that.

‍

Shakthi:- The DLS that we are working on, when implemented, I believe, you know, will solve a few interesting things for the team. The first thing would be the go-live team or go-live time. The pre-built sections, you know, in design and development ensure rapid go live because substantial time that have been spent in recreating items and molecules would be saved. And obviously, time to go live is reduced by half. The cumulative time saved in this publishing webpages collected throughout a year's time is humongous, right? So we want to save that time. And one other thing we want to focus on is the scalability of the pages and to ensure consistency because when we start dealing with CMS, it gives us the flexibility to set character limitations. You know, use tools like Grammarly to prevent display of erroneous components, and, you know, keep the content error free and the design structure intact. That I think is a major friction between designers and, you know, content writers wherein we have to set a character limit. We have been able to do this with the help of CMS platforms and one major thing that has been bothering us is the internationalization of the webpages when the actual process is this, right? When you want to create webpages in say German language, right? You need to hire proper translator out of the country and we need need to ensure that it goes through the entire process, check in with the content writers and there's a long process that's involved. And once it's finally done, the document actually comes back to us, the developers, who need to actually copy, paste the entire thing into the code, which is like a redundant process, right? Whereas the developers can actually sit and work on ambitious projects. Implementing this system using CMS standards will help us outsource this content updation process to agencies for internationalization is gonna save us a lot of time. And, of course, when I talk about aspirational projects, it's gonna make us more time for them. Marketers can leverage designers better for aspirational, multi-quarter projects and we are currently only a collection of digital assets, but we definitely want to be more, right? So we would have a unified, accessible virtual system for the web by the end of it. Our one more outcome we look forward is to, you know, loosen the friction with content. So CMS gives us complete control over to copywriting, right? Iterate your copywriting, facilitates a bit of copy and it doesn't have to actually impact the way designers and developers function so they can do it directly in CMS platforms. And this particular CMS library contains well-thought-out sections. We have a number of variations for all these things. So choosing the right variation of section is gonna help communicate in a better way and set a beautiful page flow. DLS, of course, comes with the responsive design outcomes, right? Most of the brands at least that are today, especially the stick brands, they stop optimizing for screen sizes larger than 1,440 pixels and width. But we wanted to build for larger screens because almost 27% of our prospects visit from larger screens that are pretty much larger than 1,536 pixels. So pages built for small screens looked terrible on large screens with white bands on either sides, so we wanted to solve for it, right?

‍

Charli:- I feel like it was, I don't know, maybe it was like 10 years ago now, but we're all about like, let's think about screens that are smaller and smaller and smaller and optimize for that. And now with a lot of people having these like ultra-wide monitors and things like that, especially if we're talking about a tool that's used for people's businesses, you know, it's gonna be done on a desktop and yeah, now we're thinking about going bigger and bigger and bigger again, it's just funny. Now we're having to design for a larger range of screens, aren't we?

‍

Shakthi:- Just when you thought people would be, you know, taking these business decisions using mobile screens they're switching back to the other screens.

‍

Charli:- What's been your process for tackling such a large project at this? And like I'm asking this kind of selfishly because we're at the start of doing something similar at ConvertKit, we've got a bunch of pages and like you, not many of them are super templated. What's been your process for figuring out like what should go into the system, how can we bring these non-templated pages like into more alignment?

‍

Shakthi:- It is definitely a long process. So the first thing we did was to define this scope of the project, which included timeline split into phases obviously. And we identified the stakeholders and we split the stakeholders into, you know, a group of a set of people who need to be informed and who need to be making decisions and who need to be active contributors, and we set up various checkpoints for the process. And one good thing that we did was to bring in a project manager, right? It's easy for a designer to assume that we are really good at managing projects as a whole, but it's oftentimes, our focus really needs to lie on the actual problem rather than keeping the stakeholders informed. So there's no harm in taking help from someone who's an expert in that field. So we brought in a project manager and the first thing we did was to create a well-defined questionnaire and, you know, fine tune it so that it's not more than 15 questions. And we circulated it to heads of different teams at Chargebee asking about various things like how they want to position Chargebee as a brand on the website, what works really well in our current website, what needs to be improved or changed or even removed and what the customers or prospects expect to see more of in the website. This particular data was amazing to look at because there are various aspects that a marketing designer wouldn't know otherwise. No one knows what is the pain point behind an implementation team member. So we had a chance to look at all these questions and it gave us really good insights. Once this is done, we started focusing on CRO, which is like conversion rate optimization. We have a really good CRO specialist in the team. He taught us something called Brian Cugelman's Audience Influence Model. So this model actually helps us understand what influences people in making decisions. So based on this particular study and based on his inputs, we were able to segregate the entire set of webpages into two categories called problem aware and solution aware depending on, you know, where they fall in the marketing funnel. And we were able to define the exhaustive list of components that could be in any given webpage, clearly set the templates or layouts and map them to this product feature and solution pages. So that is an excellent solution if you'd ask me.

‍

Charli:- Tell me more about the difference between the problem aware and the solution aware pages. Like what's an example of a page that might appear in each of those categories?

‍

Shakthi:- Imagine you being a patient, let's say you have a bone problem, right? And you wouldn't know you have a bone problem until the symptoms start showing up. During the initial set of symptoms, it's very hard for a general physician to probably identify and, you know, let you know that this is the actual problem. But unless until you don't know or unless until you visit the doctor or the physician, you wouldn't be able to actually identify that you have a problem already let alone, you know, start getting treatment for it. This particular phase is called problem aware. There are like-

‍

Charli:- So I'm like, "My arm hurts," that's the problem.

‍

Shakthi:- Yeah, I mean exactly. There are companies that are actually starting up, they might not know that there is actually a pain point that they're going through. They might think that that is actually a norm, but Chargebee, you know, takes it on itself to let people know or educate them that these are the various pain points that might come up and this is how people are solving for it and this is how people in your particular field have solved for it. I'm sure pretty much every single marketing designer would know about how a marketing funnel works, right? So you have the top of the funnel and then you have the middle of the funnel and the bottom of the funnel. Imagine someone of the top to be the problem of our segment. They'll be just roaming around, they'll be trying to identify the pain points, you pull them in, you let them know that these are the pain points that might come up and you start nurturing them about the industry standards and how companies operate under these pain points. Once we keep nurturing them, right? So they have identified that this particular thing is a actual problem, they'll start looking for solutions to the problem and that's where the solution aware pages come in. These pages are mostly product feature pages, I would say, where you try to give them as much information as possible to make that final decision.

‍

Charli:- And how have you found the splitting the pages up like this impacted the design system? Do the problem aware pages have a different set of like component needs to the solution aware pages?

‍

Shakthi:- Yeah, of course, because when you say you're trying to educate them, you're probably thinking about providing them with as much information as possible about the pain points and how companies have solved for it. And when they gradually come down to the bottom of the funnel, you know, they'll be in a stage where they'll be evaluating your company versus the other products available out there. And that's exactly the point where you need to give them more social proof and tell them, "Hey," let's say, you know, Amazon Prime is a prospect, they have been using Chargebee for the subscription billing for like two, three years now and they are present probably in all places around the globe like APAC or MENA or any part of the world, you name it. And Netflix is in the phase where they have identified the pain point and they're looking for solutions and they want to understand how a streaming platform could benefit out of Chargebee. So that's when the actual solution pages come in, that's when the customer studies come in. So we give them social proof for them to understand and, you know, probably evaluate Chargebee against the competitors and make their final decision.

‍

Charli:- Yeah and give them the confidence, right, that look, other platforms are using this so like it's a good choice for you too.

‍

Shakthi:- Exactly.

‍

Charli:- Keep telling me more about this process then of tackling this project. It definitely sounds like the split helps to focus things and to like, you know, create a system around the components.

‍

Shakthi:- Yeah.

‍

Charli:- What else? What other tips do you have for me as I tackle ConvertKit's design system?

‍

Shakthi:- Taking care of the CRO inputs, we kind of went back to the existing system that we have in place currently and we kind of started doing an audit on the existing components like sections and getting rid of the, you know, duplicate or redundant variations. For example, you know, we might have done like four to five different variations of a testimonial section, let's say, for example, one day, a designer might just show up and and say, "Hey, let me try out a new thing for this." We go back and do an audit on the existing components and try to remove the redundant variations, right? For example, we might have done like four to five different variations of testimonials which we actually do not need because for a system to exist properly, there should be constraint on the number of variations unless until, you know, it's really important to differentiate it from the other variations, right? So we did that and then we started doing an audit on the icons, the material illustrations, the photography and accessibility. When I say the team did audit the icons, the first thing we did was to collect a set of keywords that actually influenced the creation of these icons. Our particular use case is website. We have print materials and we have so many things and we have different styles of icons in the website to be precise, but to, you know, come up with a proper set of icons in one particular style, we needed a set of keywords which could be used across the organization, right? Say, for example, a salesperson wants an icon to be used in a sales deck, there needs to be a system where he can pull that out from the entire repository and use it. We started with the audit and once this particular step was done, we started defining the viewport breakpoints, right? Optimizing for almost every major breakpoint, including the large screens. In fact, the new design system, we have eight viewport breakpoints, which is pretty much interesting. So we actually sat and experimented and tested how, you know, different devices actually showcase the webpage in different sizes. That was pretty much fun. And then the development team came up with a suggestion to start using Tailwind UI. For people who do not know what Tailwind UI is, it is a open source pre-coded set of page sections that can be built upon or that can be used to build a secondary website upon. These are basically like the building blocks. We were kind of happy about it because when we validated the inputs from CRO, it was pretty much built on top of Tailwind UI so it could actually save us a lot of time and we were able to identify that. Then we started creating the system in Figma, defining the grids, the type scale, setting up the library of icons, illustrations, designing interactions like button record, hover and clicks, defining the style of product mock-ups, et cetera. So creating the system in all viewports, testing them in actual devices, et cetera. And once this is done, the actual fun starts. So conveying the constraints to marketers, like the character limitations, ensuring that everyone is on the same page, right? And this required us to do a lot of documentation work, which we'll probably talk about in a minute. Then the design to development handover was done and the developers have started doing it in our repository. And the steps that are gonna follow are the development of the same set of components, you know, CMS platforms which can be used to build and use, you know, templates as a whole. We are also thinking about using a brand book system, a tool like say a storybook or something like that where a single source of truth can be created and updated and used by everyone within the organization. We're looking forward to a rollout very soon. And what we have experienced, in my opinion, the most important part of the entire process is to ensure that everyone involved is kept informed about the design decisions and the process. You know, we made more than a few presentations and detailed documents that let everyone know what the design system is, how it actually affect the workflow, how it is, you know, helping them make their lives easier at Chargebee and what changes they need to prepare themselves for. Because at the end of the day, the designers are just a part of the entire process, and in this particular matter, the marketers are our clients.

‍

Charli:- Will the marketers be making design choices essentially using the system in the blocks in the CMS or will it always be designers deciding this is the blocks in the order that they're gonna go on the page and the marketers like putting in the content?

‍

Shakthi:- That is what makes this project ambitious. Initially, when we were exploring how the CMS platforms function, you know, we were under the assumption, or at least the gentle assumption, that a template needs to be set and for it to defer from the actual flow, a new template needs to be used, let alone using the same template for a different page by cloning it. But when we start earlier experimenting with it, our developers were able to find a few gimmicks with which variations of these particular sections can be used. And all these components, let's say the hero banner section and let's say you have the benefit section, right? The order in which this can be used within a page can be set by the marketers. And we didn't know that before we started experimenting this. It was a huge turn. Let me say that, you know, it's an experimentation, it's an ongoing experiment, and we do not clearly know the outcome of it. But what we definitely know is that it will be able to help the marketers do whatever they want with the flow of server pace, right? Because at the end of the day, the way in which a prospect needs to consume the content is set by the marketer and we are here to help them out, so that's how we want to do it.

‍

Charli:- I like that, I like that a lot. It sounds a little bit scary to me to leave the like design choices up to non-designers, but that is something that I need to work on letting go of myself.

‍

Shakthi:- You know, we have had this argument within the team and so in fact, we had a heated argument with one of the, you know, senior managers from product marketing. But it was definitely a constructive session where we discussed the pros and cons of it. Finally, we all agreed that, you know, when we do the design system and when we are saving time by, you know, giving them the actual control of things. I think it's the respect and trust that we should have in each other. And the way to build it is to let them handle things, right? Just like how they believe you on the design choices, we need to start building on the other way. And, you know, the marketing design team is taking it on itself to educate, you know, I actually had a chance to set a really long document extensively on the various combinations in which these sections can be used to build a webpage. For example, there's a banner and there's a footer and there are like a number of sections in between. It doesn't make sense to put the footer up and put the banner down. And these are all being documented like very extensively. You know, one more thing we have thought to have these under controllers actually letting the, you know, developers do a final check before the page goes live, which means that the marketers wouldn't be able to push the page live even from the CMS platforms where they can rearrange things. When it goes through the developer, if they think something is like off the standards, off the things that we talk about in the document, it's gonna come back. We're gonna send people back to reevaluate and restructure things for the page to go live.

‍

Charli:- I like that. So yeah, it's about putting things in place to help the non-designers make good choices, right? Educating them on the order thing should be in and also like us as designers making the components flexible enough that like it doesn't matter if you put this one first or this one first, that it'll still work in the design either way. That makes a lot of sense. I love that. Well, let's move on and talk about documentation some more, what it looks like and why you prioritize it.

‍

Shakthi:- You know, documentation in general solves a number of things for designers and I think it's a highly underrated thing by creative individuals. No designer wants to sit and do the actual documentation work. First thing, you know, a well-defined document can help us keep people informed about everything, especially in a fully-remote environment, right? We work from India on a regular basis with people from, you know, USA or Europe or even Australia. So when every single task should have been completed yesterday, it makes no sense to find a common time slot with the stakeholders to connect with them and convey the ideas or decisions or seek approval. A documentation or a document though sometimes be a tedious process, right? Can help people be on the same page and derive conclusions when you're sleeping on the other side of the world. It's a beautiful thing. You know, a document can also act as a record of context. So over a period of time, any project, you know, loses its importance with the decline of interest of the stakeholders involved. So it is not a sin to lose interest in something because it is something that's hardwired in human beings over 1,000 of years of time. The sin here would be to forget the progress and the decisions made which will lead to people starting the conversation from scratch when we touch base again.

‍

Charli:- Right, right. When you already made some decisions and like already did some research, like let's remember what past us did.

‍

Shakthi:- One more thing is that, you know, when a new designer joins the team, right? A set of documents that they can read to know how people deal with projects can help them a lot. This is something that we intend to do by documenting everything that we go through, and it also helps resolve conflicts and instill trust among the stakeholders. It is basically like let's say a manifesto where we openly commit to something and we keep sharing the progress till the task is done. So this helps the designers build credibility over time so that the other functions start trusting the design team. And the most important aspect I believe is that documentation when done over a period of time can help us locate any patterns in the process that lead to inefficiency. When we actually worked on our latest product release this summer though almost every stakeholder was efficient in what they did, we found a few pain points that we could have avoided. And looking back, this has been the same since the last few product release campaigns. So our PMM-specific designer jumped in to create a workbook that literally documented the entire process which can help people gain visibility in the hurdles ahead when they prepare themselves for the next release.

‍

Charli:- Oh right. So because you were documenting it as you go and documenting the challenges that you'd hit, you look back and saw like, "Wait we hit these same challenges the last two times as well and so this is a pattern we should like come up with a permanent solution for this or at least be aware that we're gonna hit these challenges again in future.

‍

Shakthi:- Exactly. So this is basically like how people tell you to, you know, develop the habit of reading books. It's easy to find a book and read it when your pain point is discussed about and a solution given in the book, right? If you are already sleeping nicely, it doesn't make any sense to go read a book about sleep.

‍

Charli:- What does documentation look like at Chargebee? Like where is it shared? And I'm also curious to know how you set the expectation for people to actually read the documentation. 'Cause like we said, like that can be difficult too.

‍

Shakthi:- It has been a trial and error process. Initially, we have been using Notion as a documentation tool. You know, whenever we write case studies about the major projects that we worked on, it generally happens in Notion. And Notion is not a tool that's used across the organization, and for that reasons, we started doing things in Google Docs specifically. Of course, we, you know, use the Google suite and we have presentations and so many documents linked with each other. Pretty recently, we have been using Confluence as the document because it also gives us the ability to, you know, share it as a blog post or a published article. It gives more structure, you know, it provides us with the same ability to comment and share feedback on the document whenever someone reads it.

‍

Charli:- I like that thinking of let's put the documentation where people have the most access, where it's gonna have the most visibility 'cause it's already a challenge to get people to read it. So let's not make it even harder by putting it in a tool that they're not going into regularly. What else have you tried for documenting work at Chargebee?

‍

Shakthi:- So we had something called "Grid-Gap Magazine." So if you ask what Grid-Gap is, it is the name that we have given ourselves. So the marketing design team is called Grid-Gap. It came out of nowhere during one of our biweekly catch up where we just chill and talk with each other. People came up with the name and it stuck to us ever since. So we wanted to actually share updates with the marketing team and the entire organization on what's happening with the marketing design team and what we have been learning as a team and as individuals and how successful we have been or the things that we have missed or the things that we have learned over a period of time. Of course, the best possible way to share this would have been a newsletter, but to talk about things celebratively, a newsletter wouldn't do justice. We actually sat and created a long ebook kind of document where we pretty much put everything that we had done over the entire quarter and we talked about the learnings and we talked about the misses and we talked about the future plans. That was a time when we even took up evangelism to be one of our, you know, team goals and we talked about how we are setting up accounts in platforms like Medium, Triple. We started putting it up and it was meant to be like really small and it went up to like magazine that was like 64, 65 pages in length and it was something huge that I'm pretty sure no one would be able to find time to go through it to read it completely, right? It was really good. It acted us a clear document on what the design team went through in three months. When you actually look at it, it doesn't feel like the work had been done in three months. But sometimes, you know, design teams fail to stop, think about what had been done, retrospect on the actual things, retrospect on what could be better and probably plan for the future, right? We had a chance to do that. But unfortunately, since, you know, we were working on so many things at the time, it wasn't circulated and I wouldn't call it a failure, but it was just put on pause. We are thinking about doing it on a regular basis now since we have a really considerably larger team now.

‍

Charli:- So yeah, it was this beautiful like artifact, right, that documented your work and I'm sure was much more interesting to read through than a simple Google doc. So you mentioned at the start and, you know, I'm sure that a lot of designers listening feel this too that stopping to document even though we know it's valuable and we know that it's good for us, it's hard to actually do it in practice. How does your team feel about documentation and any tips, I guess, for making it a part of the process that they can embrace?

‍

Shakthi:- I'm sure that the team feels exhausted by doing the extensive documentation because like I said, it is human nature to lose interest in the things that we already gone through, right? But when we actually do the moral algebra and weigh the pros and cons, there's not a single con except the time we spent when writing. Even this time that we talk about is entirely trumped by the enormous amount of time saved in the future by multiple people going through the same process. So when a designer needs to document something, we help each other understand how it might turn helpful in the long run. It's mentioned in the book, what was it called? "Eat the Frog." So we try to eat this frog so that we can have, you know, a really good time in the future. The only tip I can probably tell people is to just get started bit by bit, right? So writing the first few lines is the most difficult part of the process and there's nothing that could go wrong because they have gone through it already, they're just documenting it.

‍

Charli:- Yeah, like you don't need to figure out what to say 'cause it already happened, you're just describing the process. Well, let's move on and talk about goals, which I know is probably something that comes from the marketing team that you're aligned with them and your work is trying to help towards achieving marketing goals. Tell me more about that. Are those goals passed down to you? Do you take part in setting them? Do you set them as a team, as individuals? How does that work?

‍

Shakthi:- Chargebee has, you know, started adapting the concept of OKRs lately as the model for setting goals and keeping track of them. I'm sure people know what , right? It's a wonderful way to set goals and drive people towards saving them. In fact, I would urge the listeners to read the book "Measure What Matters" by John Doerr, it's a wonderful book about the OKRs. And coming back to the point, Chargebee's, you know, board of directors actually set goals for the organization on a yearly basis based on various factors like market conditions, the rate at which we as a company want to grow, scale, et cetera. So these goals are then split into quarterly goals. You know, the goals actually trickle down to the CXO-level executives who, in turn, set objectives for the individual departments that they had, which further trickle down into objectives for the individual functions within the department. In our case, our CMO sets objectives for the marketing team based on the objectives set by our CEO. And then the marketing functions, including the design team, set our objectives for the quarter based on the marketing objectives. This is basically like having a common objective or having a common vision that can act as the North Star. Once we set these objectives, right, we set the key results which we can measure at regular intervals to keep track of the progress. And the key point is that oftentimes we as marketing designers get lost in various tasks that we do on a day-to-day basis when we start functioning, you know, like a button basically. So the OKRs actually are like our superpower which helps us to say no to projects that can be de-prioritized.

‍

Charli:- Right, because if it's not gonna help towards the OKR, then it's not gonna be worked on.

‍

Shakthi:- Yeah, unless it's on the OKR board, it's not as important it seems to be. This also helps us, you know, clearly define which projects can be done with the help of design agencies and which can be, you know, dealt with in house. The design team actually checks in on the OKRs every month to see where we stand and we evaluate what's going well and what's not. The entire marketing team has a quarterly review where we meet for a couple of hours to review and retrospect on what went well and where we could have done better. This is how the general system works for the entire team. As far as the growth of individuals is concerned, we have a system of setting I work cares or individual cares. Now this is an interesting thing because we as individuals get a chance to basically do a SWOT analysis on ourselves and define the areas where we want to improve. Once this particular analysis is done, the person with the help of his or her manager sets up a roadmap for at least like six months for up to a year where we clearly set the objectives and key results for the quarter. There are actually, you know, two challenges associated with this process. The first thing is our ability to set objectives that align with the objectives for the organization. Because at the end of the day, if the company is investing time and resources to help a person grow, it is fair for them to expect the skillsets we develop during this period to be put in use for the good of the team immediately. For example, if a person wants to become a really good web designer, right? His objective can be to become a kick-ass web designer in two quarters, let's say. Now the manager can help the person achieve this goal by providing him with the right resources, having a regular cadence with him to check progress, routing the web design tasks towards this person at work and sharing feedback on a timely basis. The second challenge that I had in mind to discuss is the extremity in the ambitiousness of the goals we set, right? OKRs are about setting very ambitious goals, yet achievable goals. Now we do not clearly know how much ambitious is too much ambitious. So the people with the help of the managers, they need to experiment with this for a couple of months to set realistic expectations for themselves. If the goals are very easy to achieve, right, they're not good enough, and if they're not achievable at all, they don't help you but just tire you up. The thumb rule we have in place is that if you're able to achieve like 60 to 80% of our goals, it's good.

‍

Charli:- It means you set them at about the right level, and if you achieved 100, 110%, maybe you were too easy on yourself and you should set harder like more challenging ones next time. What sort of metrics end up on the key results for the marketing design team, I'm wondering? Is it like the site conversion rate, site speed? I don't know. What metrics are you looking at there?

‍

Shakthi:- We have things that vary like from end to end. Let's say, you know, the previous product release was around multi-product go to market. When we set the goals, we had a common goal between PMM and mark, the design team, where, you know, doing the GTM multi-product would be one of the objectives and go to market in one by end of this particular quarter would be the objective. And there are various key resource associated with it, one of which is successfully doing the product release campaign, and that would be one of the KRs. You know, the metrics are basically segregated into different types based on how they're measured, right? So it can be done or not done metric, it can be measured in terms of percentage or it can be measured in terms of number of things that we are committing to, right? Let's say I want to increase the website traffic by N percentage, right? So that is one way of measuring it. You can say I want to bring in 10,000 more customers or prospects to my website that can be measuring the numbers. Let's say I want to, you know, successfully create 10 new pages by end of the quarter. So that's how we roll and it pretty much trickles down to every single team and then further to every single person and to reduce or get rid of redundancy. So when I say redundancy, people actually might get tagged in the key resource associated with PMM as well as design as well as marketing, right? So we have a system, we use the tool Gtmhub across the organization. When a goal is set by PMM as a key result, design can be tagged as the owner in that particular board. When I say let's say increase brand awareness by N percentage as one of my goals, you know, the brand marketing can be a co-owner in my objective board and can be part of the key result. These are a few things which we had to keep in mind while defending these goals. I personally think it's not an easy thing because on an average, I think every organization that starts implementing all care we'll need at least a buffer period of like one to two years to adapt to the system. It's basically like a love-hate relationship with the OKRs. You love the fact that you have a North Star, but you hate that you have to do regular check-ins. It's a really good system if you'd ask me.

‍

Charli:- So it's one that we used at ConvertKit for a time and have kind of gone away from it and part of me wishes we had stuck with it and like stuck it out 'cause I think you're right, that one to two year period to like get really good at setting the OKRs, I don't know if we gave it the time that it needed to be honest.

‍

Shakthi:- And Chargebee is pretty lenient about it, so it's not like a hard stop, it's not like a mandatory to stick to everything that we commit to, but it's definitely making it a practice for everyone to go through so that it becomes a habit in the long run.

‍

Charli:- Tell me more about your philosophy at Chargebee when it comes to like iteration and improvement. 'Cause obviously, you're measuring a lot of things, you're very metrics-driven company it seems. Yeah, how often are you revisiting projects that you've worked on in the past and like looking at how they perform and deciding to make an improvement to them?

‍

Shakthi:- We iterate a lot if you would ask me. I personally think that our marketing team has built an amazing engine only because they had the ability to rapidly iterate, learn from mistakes and react by altering the course in a faster way, right? So the team was really significant in this matter and believes in trying fast and failing faster. Though this is not a slogan, this is what the designers do. Every single webpage or collateral that we design would've gone through at least a couple of iterations, at least a couple of hard boats. The frequency of revisiting projects totally depend on the importance and the priority of the projects, right? For example, we do a yearly revisit of our bottom of the funnel pages where we change the visual experience of the set of webpages, right? Because it needs a refresh. It's been almost a year and the pattern with which the people react to it or interact with the page could actually change. So we keep experimenting with it. Whereas there are like projects where we need to iterate much faster like in the case of our design system, it required a lot of experimentation with a lot of viewports and it had to be done in a faster environment. We actually took the time to do it.

‍

Charli:- I know when we're talking previously that an example of a project that you've iterated on for improvement specifically recently was this email project that you finished an overhaul of recently or maybe not so recently by the time this episode comes out. Tell me more about that. What was the project and why did you need to iterate on it?

‍

Shakthi:- This particular, you know, project was a nurturing campaign through emails. So the rev og and the demand generation team had come up with an email list which we wanted to, you know, share information with and keep nurturing about the pain points. And we started with the problem aware and got towards the solution aware. So this was an interesting campaign because this was targeted at the startup segment in specific, we kind of split the prospects or the people we want to go after into like different segments out of which startup segment is a really interesting one. So there's an introduction email, right, where we talk about who we are, you know, as a company or a brand. And then we actually set different parts for these prospects based on how they interact with the email. There is navigation in the email, there's infraction in the email and the flow actually is set by the user in what and how they choose. So we kind of identify the use cases, right? It has to be like really solution specific. We want to instill and create the curiosity and we wanted to set the context or relevance for the users through the emails. The ultimate goal was to educate them so that they start coming into the funnel. We wanted to make them problem aware first and then the solution awareness and the social proof that Chargebee has like, you know, Forrester Reports, the GTM badges that we have got and the customer stories and case studies and whatnot. So this is how the flow was set, right? And finally, we wanted to bucket them into hard leads and send it to sales. So that was the process behind it. As for us, you know, how it went. There were 16 email headers that were specifically designed and optimized for emails because, you know, we had a supporting data that most of our emails were opened in mobile devices. Designer to designer, we generally know that we tend to create really thin banners in the top. It looks really good on desktop devices. I hate it when the title or the company logo is actually smaller than the body copy when you look at it on mobile devices, right? And that's very crucial because that is making the very first impact, especially when you are making the first contact. So there were two of the designers, me and another designer called Vinod who was working on this, and we, you know, got the brief and we actually had a lot of time, so we wanted to have fun. The actual flow that we talked about, the original emailer had like four to five different set of components that can be interacted with based on which section they click or which title or solution they want to click. It takes them to a set of emails that they're gonna get in the next consecutive few days. And each of this flow has like four to five emails. So let's say we have five parts and each of it has like four to five emails and there is a final email. So it's kind of like a diamond structure, right? So it starts with what Chargebee is. Hey, do we have problem A, do you have problem B? And based on how they interact, it's gonna nurture them with information required, and finally, we're gonna send them out an email that says Chargebee is providing these solutions and they can offer it. You know, the marketers specifically wanted different themes for this different verticals of the parts the user chooses. And it's very interesting because, you know, a user can jump from part A to parts three or C or D right in middle of it because each of these individual emails have buttons that can actually set them into different parts at any point of time.

‍

Charli:- Right, so it had to make sense, you had to be able to mix up the order that they were sent in and it had to make sense for the design, for the communication, very flexible system.

‍

Shakthi:- Exactly. So we finally optimized for the mobile screens by having really large email headers. In fact, we even had a hard stop thinking if it would be right for the desktop version, but we went ahead with it anyway. It gave us really good results because, you know, we were able to share industry reports, blogs, web guides, and we're able to nurture them with information where they can, you know, click and read the white paper or case study or even take them to solution or feature pages, right? Let alone the landing page specifically designed for the campaign. We have, let's say X percentage is our typical click through rate, right? And via this campaign, we almost got like 50% better responses, like-

‍

Charli:- Amazing.

‍

Shakthi:- Yeah, it was pretty good. People responded, people were curious about the things, the pain points, it was good.

‍

Charli:- It's probably because it was so personalized you think too, right, that people, you were giving the reader or the user exactly what they needed in that moment rather than making it general. And so that probably led to an increase in the conversion rate, yeah. What did these emails look like before? So we've heard about like what you iterated them into and like some of the challenges there. What was in place before?

‍

Shakthi:- The emails which we had earlier used to be really small in the height that we talk about. And we do not have themes set for different parts or the email journeys. They were optimized but they are not well optimized for the mobile devices to be precise. The virtual system that we chose to experiment with, it was pretty fun because each of the emails just had a header line, a copy and a supporting icon, like a spot illustration. There was nothing else, it was really flat just with an icon indicating what the topic actually is. It was really good.

‍

Charli:- And so these were the email headers?

‍

Shakthi:- These were the email headers and these were the cards within the emails. And this was the social proof with the CTA and these were the different parts and each of this will again have, you know, different sections like this where they can click and navigate to a different path. And finally, they'll be, you know, given a final CTA where they can sign up for the product and start using the Freemium model of Chargebee.

‍

Charli:- You mentioned that you had a while for this project, so was one that you could really like take the time, develop a cool system and have fun with. How long was the project from like start with the brief to shipping it?

‍

Shakthi:- So the project was well planned so we had an enormous time to actually sit and experiment this. So we actually got the brief almost a month before the campaign would go live. And we usually get a short span of time considering the different kinds of experiments the marketers want to do. This particular thing was really interesting so we kept iterating for almost like three weeks. We never, you know, set up mood boards for email campaigns, that never happens, right? And we had a chance to do for this particular campaign. So we found inspiration and we decided on the virtual system that we want to go with and we decided on the kind of icons or the spot illustrations that we want to go with. We wanted to use really bright colors because like I said, this is the first contact.

‍

Charli:- Mm, you wanna make a good impression. Maybe we're seeing here that like if you give designers time to experiment, it can lead to really great results, like you said with this like 50% increase in the click throughs, that's awesome. Let's end by talking about some of the main challenges you're facing right now at Chargebee. It could be you as an individual, as a marketing design team. What are you gonna be working on solving next?

‍

Shakthi:- There's this really good thing that happens in a physical workspace. You know, an entrepreneur from India called Kunal Shah, he calls it learning by osmosis. When we are in office we tend to learn things that otherwise we wouldn't learn by passively listening to the people around us, right? And generally, designers do this a lot. It is easy for me to look at a video or a Pinterest item that inspires me, but I'll not make an effort to share the link with the team to pass it on. The inspiration dies within me. This happens instantaneously when we meet in person, but it doesn't happen at all when we work remotely. So I think that is a major challenge and I think most of the other challenges are psychological. The marketing team has scaled up really fast in the last few months and we have been unable to personally connect with everyone in the team, which we used to do a lot. And this is something that I think we'll be working on in the next few months because it's a two-way relationship, right? Unless until the designers or any of the stakeholder make a move and want to know about the other person, it doesn't happen. So I personally think that it is important to build and nurture the rapport with everyone to develop a deep sense of belonging and a sense of belonging is crucial at a workspace for us to work for the benefit of the brand. Because I have understood in the past few months that a transactional relationship with your peers might really work in the West, but a personal connection is required and helpful when it comes to the country I live in specifically. So this is in fact was the feedback I received from my manager, which really helped me create meaningful connections with my colleagues, so I do this a lot. One other thing is that it's easy to feel not motivated when working on a fully-remote environment. And I think it's completely normal. We're trying to level up our internal engagement by connecting often. So we are trying to not keep the communication just work related, we try to empathize with our fellow team members by giving them enough time and space. So these are the few challenges that we have been facing and these are a few ways that we have been trying to come up with.

‍

Charli:- Makes a lot of, especially like we were talking earlier about the trust, right? Having trust in your marketing partners to make the right design choices, to follow the documentation. And all of that comes from the space of like mutual respect and mutual understanding. And so putting time into those personal relationships can help with that too, I like that. And what about you? What are your future plans for growth in your career? Or is there like a specific skillset that you're working on building next?

‍

Shakthi:- One of my goals is associated with the goal of my team and as far as my team is concerned, since we would have automated most of the website design processes in the near future, right? We are collectively looking at utilizing the time we'll save to initiate ambitious marketing projects that are completely owned and driven by design, right? We have already identified a few and are currently working on the research phase of it basically. Personally, you know, since I've transitioned into a manager role, like it's just been like 10 months I guess, you know, I'm currently unlearning a lot of things that have helped me the past which do not help me anymore, right? My approach to work has completely changed. I've probably started becoming less competitive and more empathetic, right? So my success is not my success anymore, my success is defined or directly proportional to the success of my team. My plan is, you know, probably to enable my team to realize, optimize and utilize their potential and I think this will happen over a period of time, but hey, no pressure.

‍

Charli:- Well, okay. Well, speaking of that then, from your time at Chargebee so far, I'm curious to hear what is like a project or an impact that you're most proud of and maybe it's something that actually you did as a team from what I'm hearing here.

‍

Shakthi:- When I joined Chargebee almost like 20 months back, the first project that I took up was to create a Chargebee Learning Hub, we can even call it a resource center. So we had our content spread over different platforms like Contentful, HubSpot, like I said. We wanted a common space where we can list out everything and we can let the users or the website visitors, you know, fine tune, select, search using keywords and whatnot. So we wanted to give them the complete control over how they want to consume the content from the Learning Hub. So that was my first project and it was very brief, it kept going on for like I believe six months, two quarters. The team was really supportive though and it was a really good project because I learned a lot. I came across a few tools and, in fact, we started using a tool called Algolia for our advanced keyword search in the Learning Hub. And I had a chance to set the architecture and I had a chance to actually set how people interact with the interface, how they select a particular topic or how they select the form of the content they want to consume, right? Let's say I'm driving, right? I just want to hear a podcast about Chargebee as a product or I'm sitting in a library, I just want to read a blog about a product or its capability so I should be able to consume the way I want, right? So that was the first project and it was really good. I think that's one of the projects I'm most proud of. About recent projects, I think the very recent summer product release that we did and the campaign around it, it's the largest and the first multi-product release after we acquired a few other companies. It was pretty neat, the team did an amazing job at completing everything on time and staying due diligent.

‍

Charli:- Nice.

‍

Shakthi:- That the team has like pretty good standard right now. We have set a good benchmark and we have a good rapport with the marketing team, so it's been really good.

‍

Charli:- Nice. It's nice when it all works well, isn't it?

‍

Shakthi:- Mm-hmm.

‍

Charli:- Well, thank you so much, Shakthi, for everything you've shared in this episode. There's lots of great like systems thinking that you have that I know a lot of designers can learn from. So thanks for sharing all about your expertise at Chargebee.

‍

Shakthi:- Okay, thank you very much for having me on the show, Charli. I had a great time talking with you, thanks again.

‍

Charli:- And shout out to the Chargebee team because we know you listen. A huge thanks to Shakthi for everything he shared in this episode. He actually has a podcast of his own, did you know, called "Design Combo" podcast. You can check that out at the link in the show notes. And I also loved hearing that he and the team listened to this show and share notes with each other on the takeaways. That is honestly my hope for "Inside Marketing Design" is that we can all just like learn from each other, get ideas for new processes and systems we could try out with our own teams, so I hope you are doing that too. I would love to hear what your takeaways have been from this episode, from all the others in the season so far. Please feel free to tweet me or tag me in Instagram with your thoughts while you're, you know, also sharing the episode with your design friends. I am @charliprangley on both of those platforms. We are getting close now to the end of the season, just a few episodes left. So I would also really appreciate if you wanted to head over and leave a rating and review on Apple Podcast if you've been enjoying the show. That would mean a lot to me and really help us get out there and find more listeners. Thanks to Webflow for sponsoring the season. Thanks to you for listening and I will see you next time.

‍