TSMC-Online • Customization and Onboarding
Redesign B2B Project - A platform that supports TSMC's clients at every manufacturing step
Role
Product Designer
Team
2 Designers, 10 Developers
Timeline
4 months
Working on the B2B project was exciting because I got to learn a lot about the industry and work closely with stakeholders. I led the user research and UX design of this project and worked closely with the TSMC customer service team and engineers
Outcome
70%
reduce the time required to
find technical documents
65%
save the time of learning
manufacturing knowledge
95
NPS score increase
from 82 to 95
Problem
TSMC-Online require clients spend an enormous amount of time understanding how to use the platform and how to select specific documents.
Introduction of TSMC
World's leading semiconductor manufacturing company.
Focus on Manufacturing customer-designed semiconductor chips
TSMC's clients
Final Designs
and Solutions
Over four months, I drafted multiple design strategies and crafted various wireframes, and discussed them with the customer service team to do rapid test and meet user needs.
Customized widgets for various stakeholders
Based on four different ways of using TSMC-Online, I designed four distinct widgets for users. Users can change the sequence based on their purpose and different stages of manufacturing
Also, I Clearly divide into three different sections
Navigation
Working Area
Search + Tooltip
Onboarding tutorial for Newbies
I designed the animation to help users clearly see the layout and all the features, allowing them to understand the site faster and more easily without any guide
Support Module at every step
Over 50% of users required customer service team support for using document features. However, due to time differences, they needed to wait for the customer service department to provide corresponding tutorials. I designed a module that allows users to access tutorial content in real-time
Design Process
and Ideate
This project allowed me to dive deep into understanding the manufacturing process, the responsibilities of each role, how they collaborate, and when they need to use this platform during the production stages.
At least six roles would be
involved in these three stages.
Each of them will responsible for different tasks by using TSMC-Online different features
Project Manager
IC designer
Foundry Manager
Field Solution Engineer
CSV Engineer
Account manager
(customer service)
Each stakeholder is involved in
different stages of collaboration
Manufacture Process with TSMC
Business
Engagement
Design IC
Tape Out & Mask
Wafer Dispostion
Eng. Analysis
Post Service
Foundry
Manager
Project
Manager
IC Designer
CSV Engineer
Field Solution Engineer
Account Manager
Project Goal 1
Improve customized features for each stakeholders to support their work
Customized widgets are not acknowledged by users
TSMC-Online offer customize features however users complained they don’t know what is this section for and what they can do
How might we redefine the information hierarchy to better support stakeholders in completing their work tasks?
Before
https://online.tsmc.com/
Navigation
Ad Banner
Customization
Features
User Manual for Beginner
Emphasize TSMC's new technology to clients.
After
https://online.tsmc.com/
Customized Features
Favorite Function
Ad for introducing new technology
Document Download Status
Report Download Status
Notification
Navigation
Home
Documentation
Design Portal
Cyber Shuttle
Tapeout
Production Info & Instruction
Production & Logistic Report
ENG Data Analysis
Quality & Reliability
Post Sales Service
Privilege Setting
Tool bar
Navigation placed on the left to draw user attention initially and educate users about TSMC's wafer production process.
Maximize customized features to support different stakeholders' work tasks.
Lo-fi and sketches
During the communication, I also conducted quick sketches and wireframes to discuss with the customer service team how I would design and what my assumptions were.
Customized Widgets
Based on four different ways of using TSMC-Online, I designed four distinct widgets for users. Users can change the sequence based on their purpose and different stages of manufacturing.
Allowed changing sequence based on different roles.
Enabled checking of the download process upon entry.
Notified clients when new technologies were launched.
News
new tech and service launch
Favorite Function
save frequently used features
Relative functions
guide users the next step and explore relative functions
Document Download Status
Report Download
Status
Project Goal 2
Enhance user experience and develop support materials for every step of the process
User manual for each feature and beginners only accessible on the homepage.
User manual for each feature and beginners only accessible on the homepage. All the user manuals are pdf file, some of them are even out of date
Identify new users to provide full tutorial and provide support each step of the way
ensure a comprehensive onboarding process is available on the homepage.
Final Design
Onboarding tutorial for Newbies
I designed the animation to help users clearly see the layout and all the features, allowing them to understand the site faster and more easily without any guide
Help Module - Provide user manual and educate article in each feature
Click “ ? “ icon to call out help module to view support matieral
Provide different ways to view based on users content and preference