Designing for China’s web in the mobile age

POSTED 2014.03.11 by

When in May 2010 the Swedish Institute launched Sweden.cn, the official website of Sweden in China, we had gone out of our way to localize the design so that it would present an aesthetic familiar to Chinese users brought up on the busy portals and bulletin boards that typified the Chinese Internet. Numerous workshops and a local design team had ensured that the overall user experience would be seamless for visitors arriving from QQ or Sina.

swedencn

Four years on, the Swedish Institute is revamping Sweden.cn, and now our methods couldn’t be more different. This time, we’ll begin by copying wholesale the design used for the English version of Sweden’s official site, Sweden.se, launched to acclaim late in 2013. Then, once the Chinese-language content is in place, we’ll start user-testing, and tweaking, and testing, until enough iterations convince us that the site can stand proud also in China.

swedense

What has motivated our changed approach to China-facing web design in the intervening four years? In a word: Mobile. For a fuller explanation, read on…

Whether you’re designing a car or a website, good design flows from a harmonious compromise between a number of competing factors. Broadly speaking, these are:

  • Technical constraints: From engine size in a car to processor speed on a laptop, good design exploits the physical limits of the enabling technology.
  • Functional requirements: Trucks differ from sports cars because their functions are so different. Likewise, a shopping site looks nothing like a social media site.
  • Cultural contingencies: For cars, this includes tail fins on Cadillacs and right-hand drive for British cars. For websites, there are “clean” Scandinavian websites and high information-density Chinese sites. These preferences are ad hoc and historical, and come loaded with cultural baggage.

While some of these factors can bleed into each other, it’s clear that there has been an incredible diversity to design approaches for both cars and websites over the years, as these challenges get addressed in a myriad different ways.

Cars — not the same-looking.

Then, over the past five years, mobile devices rose to become the dominant user interface for digital services. This has had a profound effect on website design: For the first time in the relatively short history of web browsers, technical constraints have actually tightened, rather than loosened, with the sudden popularity of a much smaller default screen size for websites.

This small screen size has proved to be a hard constraint. In designing for mobile, designers have had to resort to ruthless triage, removing all non-essential components and superfluous decoration that previously adorned our capacious desktop browsers. Cultural quirks, outranked by functional requirements, have had to be sacrificed to the overarching need to deliver services as efficiently as possible via the mobile screen.

Native mobile app developers have actually led this design innovation, because they are building an entirely new breed of digital services, unburdened by inherited web design principles in need of a rethink.

The end result has been a convergence in web design aesthetics across cultures, as the new design principles invented for mobile bleed into the wider web ecosystem.

To strain the analogy somewhat, the mobile revolution has resulted in websites becoming less like cars and more like jet fighter airplanes.

jetfighters

Jets – looking alike.

For jet fighters, all design decisions are predicated on the absolute need to maximize aerodynamic efficiency, resulting in very similar designs. For mobile devices, all design is dependent on the absolute need for a clear and intuitive user interface on a small screen, resulting in a converged design language that we’ve all quickly grown accustomed to, from Brussels to Beijing: The hamburger menu for options, the magnifying glass for search, the slide-out navigation pane, the spring effect at the end of a scroll… All these design elements are present in the user interface for Sina Weibo as well as for Twitter, in both Weixin and WeChat, and in Facebook as well as Google. It’s become a truly global shorthand in just a few short years; none of these concepts were around in 2010, when Sweden.cn first launched.

This, then, is the insight that informs our current approach to the revamp of Sweden.cn. Since Söderhavet designed Sweden.se from scratch with a responsive, mobile-first design (implemented by Fröjd), it is ready for deployment in China, where mobile web use is proportionally even higher than in Europe and the US.

To be sure, some tweaking remains to be done — we need an updated image brief, and want to experiment with optimum text sizes, and with with some better top-level navigation bars. But this kind of design development is best suited for a new kind of agile design process, one which we’ve been fine-tuning at Äventyret. We’ll first deploy the site as a beta, co-existing with the current Sweden.cn, and then we’ll begin a period of iterative user testing and tweaking that should lead to much faster results. By keeping the launch low key, we can benefit from the feedback of the community of Sweden fans in China, which has proven to be a great help in supporting Sweden’s online presence there.

If national cultural differences in web design aesthetics have been flattened by the rise of a new global mobile aesthetic, are there any new design differentiators on the horizon? This is the topic of heated conversation in our office right now. One possibility is that the geographic divide is being replaced by a generational divide — that while the design language now being adopted by mobile applications such as WhatsApp and SnapChat is completely natural to under-30 mobile users from Chicago to Chongqing, it is just as alien to 40-somethings in Mumbai and Milan, who are still getting used to the Like button.