HyChinese understands that online visibility is essential to the success of its business. However, at that time, HyChinese website did not perform as it had expected. With the aim to attract more traffic, improve customer experience, as well as increasing brand awareness, HyChinese decided to have a complete revamp of its website.
For a Chinese dedicated website, HyChinese needed to adapt all the UI/UX to fit Chinese preference, bring a localized and personalized experience to Chinese travelers.
The second challenge was to manage the current database structure effectively and efficiently. HyChinese runs two websites:
- B2B website: the site for HyChinese to manage its partners, including their offerings, prices, activities, etc.
- B2C website: the site where users can look for information and suggestions for restaurants and hotels, etc.
With these two sites, the most challenging task was to unify and control them at once, so that any information changed in the B2B website could be automatically be updated in the B2C one. Without the proper technologies, this process takes a lot of effort and raises expenses.
Hotels, restaurants, etc. are certified by China Tourism Academy
After carefully researching the user behavior, an improved design for HyChinese was proposed. Red was used as the main color for HyChinese website: this color not only reflects HyChinese brand identity but is also well-received by Chinese people for cultural reasons. Flat design, large visuals, and seamless toggle effects are the latest digital design principles that have been applied to HyChinese website.
Certifications on HyChinese are provided by the Chinese Tourism Authority and identified by a colored squared icon at the corner of each hotel, restaurant, etc. The design of those certification icons was inspired by the design of a Chinese seal, bringing a sense of trust to the customers.
There are different certification levels and standards accordingly.
- Gold Level: Chinese International Television Station, Chinese breakfast, Chinese staff, Chinese TV channel, Welcome Chinese magazine, Hot water bottle, Chinese UnionPay
- Jade: Chinese International Television Station, Chinese TV channel, Welcome Chinese magazine, Hot water bottle, Chinese UnionPay
- Red: Chinese website, Special discount, Chinese UnionPay
- CGTN: Chinese International Television Station
- Ctrip preferred: Chinese menu, Wi-Fi
In order for Chinese users to get a better experience when using the website, WeChat login was integrated. When logged in, users can have their customized profile with some interesting features. By using this feature, HyChinese serves as a “personal tour guide” and “travel diary” that follows the travelers along their trips over the years.
The first one is My footsteps. In this section, there is an interactive world map where users can click on the map of each country and mark that place as "I have visited here" or "I would like to visit here".
You can record your "travel diary with My footstep
The "visited countries" and "would-like-to-visit" countries will be changed in color and appeared in two lists below. From the flags, users can be directed to travel recommendation for those countries.
By allowing customers to personalize their profile, this feature encourages the users to revisit HyChinese regularly to record their achievements and also plan for future trips.
The flags will direct users to travel recommendations
HyChinese gives travel recommendations on several categories such as restaurants, hotels, theaters, museums, themed leisure parks, etc. Each category has several filters to help users choose a customized list based on certification level, destination, prices, etc.
Famous landmarks recommendations
Each recommendation will include a description and real pictures of the place, the services it provides, contact information and a map built on Leaflet. A "Book" CTA will direct the users to the relevant website where they can do the booking. Users can also add a place to their Wishlist, or leave a comment to share their opinion or previous experience.
Hotel recommendations (1)
Hotel recommendations (2)
HyChinese usually distributes vouchers to its user, with multiple benefits, depending on the deal with its partners. A blog featuring topics about traveling is also included for leads generation purpose, as well as inspiring the users during their experience with the website.
Due to the huge amount of information HyChinese is providing to its users, database management needs to be handled effectively and efficiently. HyChinese has two distinct websites, one site to manage information from its partners and the other to show publicly to its users. Making sure that information from these two sites is updated automatically is not an easy task.
To solve this problem, React was applied to develop a connection between these two sites thanks to its efficiency, flexibility, and maintainability. By implementing this connection, all information in the B2B website will be pulled to the B2C website, so that the admin does not need to manually fill in everything again in the back-end. When any content in the B2B website is changed, the content in the B2C website will be updated accordingly. This process helps HyChinese save a lot of time and effort in database management. On top of that, HyChinese website will always be updated with the most recent content, bringing a good impression to its users.
Handling database is a complicated process, but we took the challenge and completely made an automatic system that can keep the content on these two sites aligned when any changes are made on either of those.
Another pillar of the technologies that contribute to the success of HyChinese website is Drupal. The website is built with Drupal 8 as one of the most suitable CMS for easy management of a large amount of content. One of the Drupal developers at ITC who worked on this project, Bertrand, commented on the choice of Drupal:
"In the case of HyChinese, Drupal can perform up to its potential. Drupal allows admin to easily manage the content, which is of great help for HyChinese since the website is frequently updated with the latest information about its partners. In addition, Drupal is much prefered in terms of customization compared to other CMS. Building API to connect the back-end and front-end is also facilitated with a custom module developed for HyChinese only. With this module, different types of content created on Drupal are ensured to properly uploaded and displayed, guaranteeing the highest performance of the website."
The complete revamp has brought a brand new feeling to HyChinese website. Menus, layouts, navigations, filters, etc were carefully designed in order to optimize every step of the user journey. This new website, with interesting features and optimized UI/UX, has helped HyChinese attract more users to come searching for travel recommendation, and more partners to have their places featured on the website. Besides, HyChinese is now able to manage its sites with a consistent database. Drupal and React are the powerful technologies behind this project, transforming HyChinese website with a more comprehensive backend, and seamless connection between the database platform and the main website.