Driving Growth Through (Re)Design:
TCDCCONNECT.com
What is TCDC?
TCDC (Thailand Creative and Design Center) was established in 2004 to pushed forward the development of creative economy to promote creative entrepreneurs as the key element of Thai economic driving force. Also, TCDC has built a knowledge management network through 14 miniTCDCs nationwide and opened TCDC Chiang Mai in 2013 as a center for exchanging creative ideas and readying regional entrepreneurs to keep up with ever-changing global demand.
What is TCDCCCONNECT?
TCDCCONNECT is one of the TCDC service. It was first launched as a portfolio website in 2009. The long-term vision is to be Thailand’s largest professional network targeting Thai creative and entrepreneur community. It will be something like Behance plus LinkedIn for Thai market.
My company, Boonmee Lab, won a chance to redesign User Experience of the website in late 2014. We teamed up with TNT, a developer team who made the original website. The goal was to increase traffic and user engagement as a whole.
Existing Problems
Here are samples of problems we found in the original website.
- Long registration form
The registration form and add portfolio were very long with too many required fields. There was also no preview mode for users to review the portfolio before published.
Note: Make sure we only ask what we need and make the experience so tempting for user to fill or upload more information.
- Content is difficult to scan:
There is no established design language or guideline throughout the website. For instance, there was no distinguishable difference in the thumbnails of Portfolio, Article, and Activity menus on home page. They were all represented using card view with exactly same size and label. It requires more time for users to differentiate. Moreover, on Portfolio, images were displayed as a carousel. Such representation has a navigation disadvantage because users prefer scrolling than clicks at the pagination every time. - Too many functionalities
Using Google Analytics, we looked into the data and measured which secondary features were ignored. We found out “Estimate project” and “Message” were not going to be the key features for the redesign due to the low engagement.
Note: Only develop what users need the most and prioritize regarding timeframe and budget.
- Too difficult to manage
The original flow of content management is too difficult to manage when the service got more complicated. With limited staff resources, it is impossible to monitor and refine contents in the entire website.
Note: Service design methodology can be used to discover new solution.
The Changes We Made
We made changes to the website in 2 phases. The 1st phase focused on the UX with original UI. The 2nd phase was to refine the UX we made and introduce a totally new UI language, which will be implemented with other 2 services from TCDC (TCDC Resource Center and MyTCDC)
Consistency in Grouping Information
The problem of old version was its unorganizedness. It included much information, but not in order or in hierarchy. Users can easily be lost where they are or where to get the specific information due to its inconsist display.
We saw the needs to consistently group sections for every category. There are three categories, a project, an event, and an article. And they all have three main panels that needed to be displayed: detailed explanation panel, author’s information panel, and related projects panel.
Seamless Registration Process
We redesigned the registration process based on Best practice especially from Web Form Design: Filling in the Blanks. We shortened the steps and divided it into 4 sections; Basic Info, Education, Work Experience and Account.
We also applied the WYSSYG idea by having a User Profile sidebar that is updated realtime as users input. This will ensure users’ privacy and visibility before submitting.
Effortless Adding Content
What we found out from 1:1 interview and bouncing data was that half of the users tend to leave while uploading content to the website. We broke down the process to 2 steps: Add Content and Setting. We chose to use blog style to display contents because it is easy for audience to consume and for project owners to manage. We implemented WYSWYG method to Add Content process to make it more intuitive to preview compare to old website.
Go Responsive
Responsive is default for web design these days. We used 12 column CSS grid system for every project.
New Feature: Collection
After long discussions with clients, we decided to add “Collection” feature in the 2nd Phase. Existing Portfolios, Articles, and Activities are carefully curated by staff under one theme and displayed in “Collection”. Users can also share to social media. It generates new contents as well as engagement by notifiying the owner of the content when they are selected. The number of referral increases when users share to others.
New Feature: Quick Edit Function(For admin)
The CMS of this website is Bitrix. We could hear complaints from TCDC staff about its lack of usability. The UX and UI of backend was the cause of confusion. Backend staff had to spend lots of hours to create and manage contents. We came up with “Quick Edit” feature to edit each content types as a solution for this phase. In the new TCDC website, staff can simply manage contents from the front end. It is also an easy way to create “Collection” content abovementioned.
The New Process
Set Up R&D Process
Before we worked on this service. There is no clear R&D process. Client started the project by writing down ideas and content structures on Microsoft Word or Power Point then hand to developers to develop. Graphic designers work seperately only on the surface level, visual.
For this project we analysed the existing data mostly on the google analytics and did some interview with users and staffs. Then sketch to exchange idea with clients and dev team. Card sorting and information architect sketches lead to the final sitemap. After we finalized the wireframe with detailed annotations, developer can start developing along with the UI design. Interactive prototype and high fidelity wireframe will be made case by case to validate important interaction with the team. UI tuning will be perform during or after the almost complete programing. QA and testing are the final stages before the website go public.
Service Design Thinking
TCDC is the only major organization that promote service design in Thailand. I was fortunate enough that clients already open to this idea so that I can use the service design and design thinking in every part of the development process.
Launch Early
We worked on this project like a small startup. We want to test and learn because it is the only way to make better product and service. This year ( September) we already launch 2 version compare to 2 version in 6 years before.
Challenge
This project is the collaboration between 2 company., Boonmee Lab and TNT. We, Boonmee Lab took care the Research, UX and UI while TNT do the rest. It’s very challenging to communicate remotely. We tried to meet as much as possible throught countless meeting, skype. Eventually, the detailed UX/UI documents, Trello and InVision prototype helps a lot during the process.
Summary
The website is still far away from a complete version. It still needs a lot of sweat to reach the expected goal, Thailand’s largest professional network targeting Thai creative and entreprenuer community. However, the recent data collected four months after its launch shed some the light to the staff and design and dev team. Here is a quote from TCDC staff.
With new design, there is an increase in 200% more MAUs, 31% more portfolios uploaded and 20% more registered users with 33.5% retention rate.
Acquisition, Activation, Engagement are the key matrix that showed increase. And we can carefully make a soft conclusion at this point that we have led it to the right direction. So what is next? I believe if we can continue to design, implement and learn. Then the goal we set will surely achivable in a near future.
Go check TCDCCONNECT website here
