UX improvements to TYK Technologies Website
Contributers: Richard (UX Researcher), Paul (Marketing Manager) and Ain (UI/UX Designer)
Tools: Miro and Figma
Marketing aims to make products desirable to customers, so they'll spend money to purchase the product. UX design aims to make products desirable to users, so they'll have a great experience while using it. - interaction-design.org
Sharing the same role as the jedi - I bring balance to the force. UX for product is not the same as UX for marketing. It shares the same values but with differing goals.
To many, this can be very tricky when one is not receptive of other’s ideas and solutions.
”UX is always right as it is for the users!” - Says the UXer
“Sales are more important at this time!” - Says the Marketer
Often it ends up in a whole lot of tension and… you guessed it - delays!
Now if you’ve watched Star Wars Episode 3: Revenge of the Sith, on how the galaxy was corrupted by one evil twat and the jedi order fell? That’s not what we want. We don’t want a project to be corrupted by only one voice. It needs to be balanced. Both sides are heard. Both sides will, at the end of the days achieve their respective goals.
Luckily for this project, I worked with the most creative jedis. Their ambition to improve things for the company is inspiring ✨.
The task given was to improve Tyk’s website homepage after noticing a fall in trial-sign ups and a huge 50% dropout rate.
Even before the whole proper research was implemented. We can’t help but to guess,
Was it because of the façade?
Are users able to retrieve information that they want?
Is our content rubbish?
Are we too pushy?
Do we look like amateurs in this whole API game?
And the list goes on…
We then go back into understanding deeper of the goals that the company wants to achieve.
What do we really really want to achieve?
A higher sign-up rates and converting them into sales. (Technically, that’s what every company’s goal to keeping it alive, isn’t it?)
Who are the people that will actually trial sign-up for our API product?
Mainly developers as at the end of the day, these are the ones to say (I LOVE THEIR PRODUCT!)
OK, but who are the actual people that will push the developers to try our product?
Product/Project Managers. The people who wants to see the glimpse of our performance.
There you have it, the number one users we need to impress and captivate - The product and project managers.
What’s the difference between now and the future website?
Now that we know our main users, we have a slight understanding of what they would like to see. Currently, the homepage has all of the information needed, however, the placement is not in favorable to the users. This might be the cause of the huge dropout. For this is an assumption we held and interview to a few front-facing customer roles at Tyk. The results are what we expected.
The content we display are all beneficial. However, to put myself in a project manager’s shoes from a reputable company, I would like to see a glimpse of what you do, who you’ve worked with, I want to see numbers and the performance baby! Currently they’re hidden. - Sedky Abou Shamalah
Very important information are hidden, and not-so important are being put out like our security certificates. Why? - Zaid
I feel like we’re being very pushy by throwing out a lot of sign-up CTAs at the front. How does one sign-up without knowing more about the product? It is like being forced to eat not knowing what you ordered when you have allergies or things you can’t take. - Jia Wu
Creation of the Content Hierachy
And so… the content restructuring begins…
We came together and restructure the content based on the main Tyk’s users and the interviews we held. We separated the section into four.
Section 1: Page intro - Proposition statement of what we do, client logos and quotes and a proposition visual of our products.
Section 2: Proposition Overview and key USPs
Section 3: Social proof and reviews
Section 4: Certificates and compliance
Section 1 and 2 are considered the ‘Star Section’ where we want to boast our performance and the unique selling point of our products. It is true what they say, “first impression counts” and that’s what we did. We want to impress our main users.
The designing stage
I was excited to start on designing. Not gonna lie but I think I was feeling a little bit impatient after a constant wave of UI work I’ve been doing for the past few months. And the day finally came for me to put my UX skills to good use.
Template Introduction
For my part, I have to do a little bit of templating research. Currently there’s no consistencies on some of the pages. You can find one with no hierarchy just pure information and one which has some sort of template applied. It was basically a mess. And that is not good for any users. It is disruptive. I always believe that a website is like a book. Each chapter has it’s own story to tell but the structure is the same - the introduction, the build up and the ending.
Space Constraints
With the brand and the UI in mind, I already know at the back of my fingertips of what template is of good use and what needs to change. I also had to identify what section that is, we can offer to sacrifice space but still able to retain its full content. That was one of the challenges and in my head I say “If I can do this I am a genius”.
CTAs Madness
Next was tackling on the CTAs. I too, agree with Jia Wu. We look desperate, throwing out CTAs on every space we can find. It is like having a rally with thousand of speakers shouting. There’s too much noise. A more successful rally is when there’s one powerful speaker. Everyone will listen and eventually take action. It was hard to convince. Marketing believes that every content section needs to have an action. Every section will bring to other sub-section, in this case pages where they’ll able to make users dive deeper and understand into that content itself.
Although I appose, there is actually some truth behind the reasoning. But I still hate it! And so we came to an agreement that CTAs leading to an ultimate action will be a button and CTAs that that leads to reading more information will be a link with an arrow.
What can I say… I am a jedi. I bring balance.
Interactive Design
I mentioned earlier, a website is like a book, but the interaction can not be like a book. It can not be paragraph after paragraph of content. Users will lose interest. In today’s fast-paced world, people generally wants to obtain or retrieve things easily. We’re just lazier I supposed. And we need to accept that. We need to accept that we are now in a generation that wants information to be spoon-fed! These information can not be any kind of information, it is something that users can remember. Short-punchy headlines can be one of the way. Want to know more? Read the paragraph below it. No? It is enough? Move on then.
But what if a website contains a lot of content, pages gets long and you asked if there’s any content we can simplify? The answer the CEO gave is, no, because to him, every content is important and every content is worthy of SEO rankings.
Now what Ain? I can’t get rid of the lengthy information. I ask myself, ”Can I hide it?”, ”How do I introduce pauses in between?”, “How can I make the users remember certain things between these jungle of words?!”
”Ah ha!" I say, “I will introduce a simple yet powerful interaction between the users and the content!”. But in order to do so I will need to make the headlines bigger and bolder. These headlines needs to have all the content in one sentence. And if the users are interested with the headline, they can read more about it at their own pace.
This formula was used for all section. Some section with a lot of information (a lot as in a lot) are templated in an accordion method leaving only the punchy title to be displayed and paragraphs hidden. Sections with no paragraphs and only titles were given an interactive action where each title will be highlighted by following the user’s scroll. This introduces the “pause moment” to capture their attention and in a way… forcing them to read it.
This method has enables us to save extra space. However, introducing interactive designs can be annoying to some. And that’s where I have to be very careful in finding that balance. I am positive that this will work, but that makes me bias. And so I will leave it till the user testing and understand what works or what doesn’t.
Sadly right after this stage, I handed over my resignation letter. I wasn’t able to work on this further as I was tight down to handovers and other projects. This project after all was in good hands and was in the stage of implementing the UI by another designer.
By far this is one of my most favorite project. I learned so much about the business and how I am able to contribute in wanting to make the business succeed further, through UX. I get to know on higher-level of marketing needs and the goals they have set - something we don’t get to see much in the product team.
Find that balance yall! Till the next one!