.png)
Tencent 💠
Over the course of my internship from June 2022 to September 2022, I had the opportunity to build an internal service platform called the Overseas Employee Center (OEC) for Tencent employees. OEC streamlines multiple internal platforms and articles into one website in order to make it easy for Tencent employees to find articles to self help.
This product would allow for an intuitive, self-help approach by looking through articles on OEC without needing to consult a real person. For example, if a new hire wanted to figure out how to request a new mouse, they could use OEC to submit a technology request ticket rather than contact their on-site IT.
🪟 The Opportunity: Build an internal platform for Tencent employees that allows for an intuitive, self-help search.
This project is an ongoing task, and I had the opportunity to build out the first iteration of the platform that focused on streamlining the intern onboarding process.
The first half of my internship comprised of Part 1: Pre-Website Building (organizing articles, coming up with categories, iconographs). The second half of my internship consisted of Part 2: Website Building (wireframes, building a design system, user research, service blueprint).
Part 1: Pre-Website Build
Before my opinions became biased by looking through the material/data that I would be working on, I actually wanted to unearth personal pain points in my own onboarding experience as an intern. This would better inform design decisions I would make later on as we essentially had a very intimate and adaptable user-case.
😖 Unearthing Personal Pain Points
The first thing that I did was to take a step back and recount the pain points (questions, people I wanted to reach/search up) that I experienced during my intern onboarding process to understand how I could best address these issues through the website. This was a very macro-level and subjective exercise as it was unique to my experience, but it help to reveal roots of issues in the onboarding process that we were able to convert to solutions later on.
Additionally, there was a lot of misaligned/outdated information between different internal platforms. For example, although onboarding would be different for different regions, if I tried to use iWiki as a Tencent Americas user, I wouldn't know that I had to create my payroll account in the first day.
📊 Familiarizing Myself with the Overseas Employee Center and Knowledge Base
After finding pain points in the onboarding process, I pivoted to familiarizing myself with the two data sets that the team was working with. First, the beta version of OEC, and second, the Knowledge Base (KB).
The KB was made by my team, the Service Now (SN) team of 11. They were responsible for organizing 400+ articles that ranged from topics like "Requesting a New Mouse" to "Company Culture".
⭐ Critiquing Overseas Employee Center (OEC) Beta
My first exposure to the OEC Beta was again a personal critique from the perspective of a new hire. Below is an image of what OEC looked like, and I compiled a list of issues that I had with the home page as well as an article page of the website.
⭐ Organizing Knowledge Base (KB)
I then needed to familiarize myself with the Knowledge Base, a repository of 400+ internal, informational articles for Overseas employees. Understanding the data was a critical step because if I were going to be ultimately designing the site for our users, I needed to a) understand the foundation of information that was going to be presented on the site and b) therefore understand how to best organize the data through a navigation bar.
Our team needed to ensure all articles were timely and updated, establishing the smoothest information flow our users. This started with making sure that all articles on the KB had content that was relevant, established authors, multiple points of approval from the team (reviewed), and successfully moved to OEC (migrated).
To better familiarize myself with the 400+ articles that existed on the KB, I created a Count of Articles by Requirement (Reviewed vs Migrated vs Grouped), based on the article authors (ie IT, HR, out of both, etc).
Because the OEC was operating on an incredibly quick timeline, my team prioritized a quick initial launch that catered OEC for a new hire and their onboarding experience. Consequently, I was tasked to help group the articles based on high-to-low priority, and high-to-low risk. As a team, my manager and the SN team decided that we would define priority as articles that would be very useful for joining Tencent and high risk as something that may be changes frequently/sensitive to certain people.
Again, because we were running on a tight timeline, we pushed for quick changes on the site. I then grouped 10-20 "Critical" articles, articles that were essential for users joining Tencent. This was important because making the onboarding experience for interns was the greatest priority.
*insert ss of excel sheet of most important articles here*
📊 Creating the Article Taxonomy: Level 1
I then moved into creating a taxonomy for the 400+ articles in order to create a better global navigation bar on the website. Again, the Beta version of the site had two big issues. 1) Only one root "Services" and 2) No drop down/roots below "Services".
I first began with the macro-categories (aka level 1 categories) of how I would group the data.
Exercise 1: Synonym Board
I began by creating a bottom-up synonym board with example articles to understand the initial data. I began with Requests, Errors, and Learning as the initial pools, but after conversing with my manager the Learning section was what we were aiming a user would come to the website for.
* The fault of this method was that I was making assumptions to what articles would be the most relevant to a new intern based off my own experience.
Exercise 2: Sorting Deck
I then used a top-down exercise based off the feedback from my manager. Because users were going to enter OEC with the intention of learning, I tried to focus more of the categories of learning that one may need. These categories were mutually exclusive, collectively exhaustive.
Exercise 3: Bottom-Up Again
We started again from the bottom-up, starting from the articles to grouping them based on appropriate sub-categories and kept going L-> R until we found 4 level-1 categories.
Below is the layout of the articles with the original categories (in green) that I originally proposed. I proposed these categories based on the articles.
Reasoning Behind Changes in Grouping 1
We decided to get rid of the “Set my Equipment Up Category”. I originally included it because we were delivering for onboarding new interns, but we decided to delete it because it felt bottlenecked to fit more for an intern onboarding experience than a general employee.
We also changed the "Get Help" tab on the navigation bar to a button on the article page that would allow users to submit a help ticket
We considered breaking up the "Career" section into "Social" and "Benefits", but ended up deciding against it because the section for "Career" would encompass both the social part and benefits for a Tencent employee..
We changed the names of "Requests (Services, Equipment)" to "Request Something" in order to encompass requests such as PTO and reimbursement that weren't included in Services/Equipment.
We also renamed "Find Answers" to "How-To Guides".
Final Taxonomy
We decided on these 4 categories to serve as the top-down.
As a quick simplification, we changed "Request Something" to "Services" and "How-To Guides" to just 'How-To".
We ended up condensing "Career", "Standards and Policies", and "News and Community" under "Quick Links". These were links to articles like "Tencent Community" that could be primarily used for browsing.
Finally, we changed "Get More Help" to "Open a New Case", which was a feature that allowed Tencent employees to request help from an employee if their question could not be answered online.
Explanation of Sections
We narrowed down the sorting groups and decided on these categories:
Services = any content related to making requests (being served by another team) or self service (any time you can take action e.g. pages with button/link to reset password, submit reimbursement, etc)
Get Help = How To content so users can help get answers to FAQs, user guides or open case if the How To content is not sufficient
Quick links = include frequently used links esp for New Hires (for now), essentially short cut to frequently used systems outside of OEC
Policies =
More/Open a new case = if you need additional help
📊 Creating the Article Taxonomy: Level 2
I then wanted to create the subcategories based on each of the Level 1 categories.
I started with getting hands-on by taking post-its and grouping the articles into their subcategories. I filed out which articles were oddballs from the grouping that others had also done in the taxonomy Excel.
I then started to play around with creating Level 3 categories with the same post-it note exercise
📊 Creating the Article Taxonomy: Level 3
We tried using an Excel to group the Level 3 categories, but eventually used the same framework as our Level 2 ones.
=[]\
In turn, we updated the Global Navigation bar appropriately with these updates.
Part 2: Website Build
Clean-Up of Site
Search-Centric Site
One of our main pain points from our user's side was that a Tencent employee would NOT know what they're searching for. As a team, we proposed multiple ways that we could do so, including a live chat bot, AI, a differently featured Nav bar etc. However, we eventually decided that the best way to make the site prompt users was to make the site "search-centric". This meant structuring the home page of the site to emphasize a search bar as its main feature.
We then brainstormed the ways that we could prompt users to use the search bar. I made two Gifs to explore animation on the site.
However, we eventually decided that this would be too busy - thus, eliminating the animations altogether.
Banners (Placement and Updates)
One of the big changes that we made to the Beta website was the arrangement of the banner. We realized that in the Beta version, the banner was taking up a lot of real estate on the page, but offered little information other than Overseas Tencent announcements. The posters were also inappropriately formatted by size and font. Thus, we created multiple, appropriate banners to fit the website.
We also implemented the idea that the banners, which were mainly geared for new Tencent hires, would disappear after 90 days.
Consistent Design Theme
Part of a good user experience requires a consistent design theme. Thus, I went through the site and made a PPT detailing all the minor details that we needed to fix.
Updating Iconography
I also helped update the iconography of the site. I kept the design style consistent to the Tencent theme and logos on other internal sites. We needed to update the line art of the logos- we wanted something solid instead.
We ended up switching to a darker gradient theme to fit the website. The previous logo feedback was too light in opacity to the point where it looked light blue/purple.
OEC Logo
I also. drafted up various versions of the OEC website logo. We ended up deciding on the last logo because it ticked off all our requirements. It emphasized the OEC brand, was simple and easy to read, and was distinct from all other Tencent platforms.
Submitting a Help Ticket Email
Part of the holistic user experience for an employee was ensuring that help tickets had a simple interface that matches the brand of the OEC website.
Site Architecture
Information Architecture
To dig deeper into the User's Experience as a fundamental part of our website, my co-intern and I worked on creating
Goals after making IA:
- Decide on structural changes for pages (reduce redundancy)
- Emphasize more important sections
- Flag pages for UI changes
Service Blueprint
Part of understanding what our users, Tencent employees, needed, was laying out the services and resources that were possible from OEC. Thus, part of my task was to make a comprehensive Service Blueprint laying out all the interactions between the front-end and back-end, as well as any services that were offered by OEC.
We first began by considering 3 different user personas.
- Using OEC to look for an article using the search bar
- Using OEC to look for an article using the global navigation bar
- Using OEC to access your tasks/requests
We then moved through 3 version of the Service Blueprint. We made sure to emphasize the touch points between the front side and the back side, made each interaction more succinct, and ensured that all possible interactions were listed. For out final service blueprint, we added a “Emotional” section to reflect any points of confusion between users.
Part 3: Iterations using User Feedback
In the final phase of my internship, we began interviewing OEC users to get feedback. To do so, con ran them through multiple scenarios and recorded how they navigated the website. As a team, my co-intern and I predicted the way that they would interact in certain situations based on our own assumptions.
We used both qualitative (task completion success, issue resolved, valid search result, points of confusion) and quantitative (# of clicks, time to complete task, # searches completed, search bar vs. navigation bar usage) and user feedback (rating ease of navigation, quality of content, and open ended questions).
Our three scenarios targeted different areas of the website we wanted to improve upon.
Easy to Search
- Find out the expense limit for traveling to Palo Alto
- I want to request a new mouse
Complex Search/Use of Navigation
- I want to end my contract early
- Goal: Open a new case because there’s no relevant articles
- What scenario reveals: User needs to find articles without necessarily knowing what terms to search.
- iOA connection issue in office.
- Goal: Open a new case/ticket because relevant articles didn’t answer questions
- What scenario reveals: More straightforward situation than the contact question, but still requires a user to open a new case
Here’s a condensed version of our discoveries from our user testability with 4 participants.
Our first step was to address moving the “Open a New Case” button. We considered placing it to the right (both after using the Search Bar and Navigation Bar to search) as well as below the article navigation system. I also included a minor change, a search bar within the article results as a part of these A/B testing metrics.
We first considered placing it to the right as it would allow for users to naturally look from left to right after browning through the most relevant search results. We considered it placing it below the article navitgation system to allow for users to scroll naturally through all visible articles displayed before opening a new case.
After feedback, we realized that the “Open a New Case” button would be best suited for the right side (both after using the Search Bar and Navigation Bar to search).
Ideal Mock-Up
To conclude the end of my internship, I wanted to make UI mockups of what the final site could look like.
Results
Below are the metrics of KB articles from 9/Aug till 1/Sep (The dashboard data was enabled since 9/Aug):
Total Active Users on OEC (Unique Users): 201
Total New Users on OEC (Unique Users): 201
Total KB views: 1001
Total searches: 263
🪞Reflection
✍️ Reflecting on the Design Process
This was my first internship under an established technology company. It was great going in-person and learning from both my manager and my co-intern. I loved learning about the structure of building a website, and all the thought that has to go into planning the best user's experience. I'm glad that I got to build a project from scratch and contributing my research to the fundamental structure of OEC.
🔥 Aspects I Can Improve Next Time
If I had more time to work on Tencent OEC I would
- Spend more time flushing out a stronger UI
- Conduct more user research with a larger pool of participants and with those outside of Service Now
- Reconsider how we could fit in the Tweets/Stocks
- Establish the Requests and Active Items (not touched upon in this portfolio description) to sync with Asana and Slack
