WuxiaSociety v2.0
Wuxia Blog|Update

WuxiaSociety v2.0

Jenxi Seow
7 mins read
Contents

Exciting times for WuxiaSociety! I have been planning for this update for months and I’m delighted to finally unveil our new look.

What’s new?

  • Mobile-first design since a lot of our visitors are on mobile devices
  • Improved readability on both desktop and mobile
  • Improved tooltip annotation system to give more context on the Chinese characters and translation choices
  • Improved table of contents for better navigation
  • Faster loading times and better performance
  • Anchor links so you can link to specific parts of the articles
  • Dark mode toggle to reduce strain when you’re hooked on the novels at night
  • Complete redesign of the Wuxia Wiki with improved info boxes, and an expanded collection of articles
  • Beta version of a customised search engine that is faster and more accurate
  • Updated About page

Readability and design

While the split between the number of desktop and mobile readers is still close, I went with a mobile-first design once I realised that reading on desktop has a lot in common with reading on mobile.

Typography

I went through a long process of selecting the right fonts for the best readability across screen sizes. Then, it was refining the typography to get the most comfortable reading experience.

We have been using Minion 3 as our body text for years, because it is an excellent serif font for long texts. But more importantly, it has great support for diacritics—crucial for WuxiaSociety since we display a lot of pinyin.

I’ve also switched the Chinese font to Source Han Serif from our previous sans-serif font. This blends better with the English font and taps on the extensive number of glyphs in the Source Han typeface family.

We are serving both simplified and traditional Chinese characters, more on this in the next section. Having to download two separate Chinese fonts slows things down a lot due to the large size of Chinese fonts, so a lot of work went into optimising the font delivery to ensure a good user experience while presenting the information in both sets of characters.

Colour palette

During the redesign process, I did a complete overhaul of the colour palette to ensure a more harmonious look.

We updated to a brighter blue as our brand colour earlier this year, and this time, I updated the whole colour palette with bright blue as the brand colour.

I also made sure the the colour selection process prioritises accessibility to improve the reading experience for some of our readers. The colours we use now passes the Web Content Accessibility Guidelines (WCAG) 2.1 AAA standard.

Simplified and Traditional Chinese

Wuxiasociety used mainly simplified Chinese characters for a long time because that is what most of our non-Chinese visitors would be familiar with if they are learning Chinese.

But I’ve been thinking about this for a while and I’ve decided to switch to add on traditional characters because a lot of these novels were written in Traditional Chinese. I’ve swithced to displaying the novel titles in Traditional Chinese since the novels were published under the Traditional Chinese names.

Where more space is available, I’ve used both the simplified and traditional characters.

Moreover, there is a lot of heritage and meaning in the traditional characters that I feel is important and helpful, especially for our readers who are learning Chinese.

Jyutping

As someone who grew up learning pinyin, it was natural for me to translate and write the articles in pinyin. Since a lot of our readers are Chinese learners, the site uses Simplified Chinese and pinyin as the main way we translate and write the content.

However, I also understand that a lot of wuxia fans grew up watching Cantonese wuxia dramas and films, and they are more familiar with the Cantonese pronunciation. So I’ve also taken that in mind in this redesign.

There are several ways to present the Cantonese pronunciation, but I’ve chosen to use the Jyutping system since that’s the most official one.

Tooltip annotation system

One of the key features of WuxiaSociety is the tooltip function that provides annotations to the translations and articles. I strongly beleive that this is an advantage of reading on the web in a browser, as opposed to reading an ebook or physical book.

By being able to hover over the notes to get more context, I can share more information with you that other formats cannot provide. These notes often come from my own research while translating or writing the articles, and I figured why not share them too. It might be interesting additional reading for some of you.

I also make it a point to annotate Chinese characters of names and places, so you can see the pinyin to help with accurate pronunciation and Chinese-learners can refer to the original characters.

A lot of the annotations link to Wikipedia articles, or Chinese Wikipedia and Baidu Baike articles in Chinese if the English Wikipedia does not have the information. Some of these deserve their own articles here on WuxiaSociety and I’m working on adding them.

I’ve improved the table of contents to help with navigation. It now floats on the side of the screen so you know where you are in the article and can quickly jump to the section you want.

The articles now come with anchor links automatically generated for headings. This means you can easily link to specific parts of the articles—useful for sharing with friends, especially for the longer articles.

Dark mode

We have dark mode on our forum for some time now. Click on the sun and moon icon on the top right to toggle between the light and dark modes.

This feature is something that has been asked often enough that I’ve worked to implement it on the whole site. I tested automated switching based on system settings, but the feedback I got was that people prefer to decide for themselves. As such, I’ve added the toggle on the forum as well.

Wuxia Wiki

The Wuxia Wiki, formerly called the Wuxia Manual, has a new look. The previous name is a cheeky take at wuxia manuals in the novels, but it can be be confusing for those new to the genre, hence the renaming. However, I also see the need for a manual for newcomers, so the wuxia manual lives on in spirit (under construction).

I have written a lot of articles as drafts in my personal notes, and my goal is always to share it with the community.

I’ve had an epiphany this year that I should just share them even if they are just drafts. That way, they could be useful to someone instead of waiting for my perfectionism to let them see the light of day.

Search engine

The search engine is a work in progress. I’m still trying to optimise it for speed and accuracy. The new search function is faster and shows you exactly where the matched search term is in the article.

There is still a lot of work to be done, so I’m labelling it as a beta version for now.

What’s next?

Some sections are still under development, so please bear with it for the time being. Between waiting until everything is ready and letting you enjoy the improvements, I’ve decided to release the site as a constant work in progress.

Follow a route