At a Glance

Delivering a full redesign of the trilingual Sony Global Education corporate website.

In Detail

Sony Global Education is a bold new initiative by Sony that sets out to inspire a passion for science, technology, engineering and mathematics (STEM) learning among children using the most advanced 21st-century tools and educational materials. Its services and products include KOOV, a series of kits that open up coding and robotics for young innovators, as well as Global Math Challenge (GMC), a worldwide math competition held online.

SonyGE originally approached us to create a new blog section for their website. This initial task then expanded into a full redesign of their corporate web presence.

The project ultimately involved a series of tasks:

• Website planning
• Interface design
• Responsive web design
• CMS integration
• Trilingual integration
• Web SEO and content strategy consulting
• Staff training

The Challenge

A difficulty we faced was integrating the ambitious goal of trilingual content, with some web pages only available in certain languages, into a smooth user experience. And when the languages are English, Japanese and Chinese, this also entails knock-on challenges related to social media integration, since users in these languages want to share in very different ways and on very different platforms. Moreover, since the typographic requirements for Roman- and Kanji-based writing systems are radically different, the interface had to be customized for each language.

Finally, we also had to ensure our design was fully responsive and met the strict accessibility and security standards of Sony.

Our Approach

To our delight, we found that the existing SonyGE visual identity guidelines provided a lot of flexibility and fun details that could serve as the foundation for our web interface design in terms of colors, fonts, decorative elements, and so on. The client requested a design that conveyed a sense of playfulness, but we also paid attention to professionalism and staying “on brand.” Teachers and educators would be browsing the content, so no matter how fun it looked, we always wanted to maintain the key educational message of the services and products. We also introduced large engaging banners below KOOV and GMC articles that would actively encourage users to explore the external websites for these projects.

Lastly, our strong experience with web typography for Kanji-based writing systems, quality assurance for responsive website design, and intuitive navigation would be essential for this project.

Website Design

The SonyGE website is effectively a portal site filled with content about the company’s various initiatives and products, published as news or featured blog posts. With so many posts and updates confronting website visitors, the crux of the revamp lay in ensuring visual clarity and an intuitive user experience.

As such, we assigned tags based on SonyGE’s core projects (KOOV, GMC). Then we placed a footer banner at the bottom of the posts that could take users from the SonyGE page to the external websites for those individual projects. In this way, the website serves as a platform for presenting news and as a bridge leading users to the projects. On the top page, we organized posts so users had a visual sense of which content belongs to which project. We color-coded the boxes and attached icons based on the project tags but also the types of post. Images were given space to make an impact, though titles and subtitles were also emphasized so users could see immediately what the post was about.

Users toggle primarily between two sections of posts: News and Features. Again, we wanted to provide visual differentiation between this content that was unobtrusive, yet immediate. Therefore the content formatting was styled differently, such as quotes, bullet lists or images with branded ornaments.

1. News posts have a more conventional narrow layout, ideal for short updates.
2. Features posts are more striking with larger images, galleries and videos.

We also integrated appealing widgets on the grid-like top page layout highlighting SonyGE social media accounts, such as Instagram and Twitter. In addition, we dedicated a lot of time harmonizing and adjusting the typography between the English, Japanese and Chinese content so global users would always feel at ease with the website. Lastly, with so much content and users jumping between posts, we wanted to keep the transitions as fluid as possible. We applied smooth loading and scrolling animations to the content blocks and on the shapes on article pages.

The result is a web platform that feels fun, contemporary and engaging to a wide range of global users, yet always reflects the innovative educational values of SonyGE.

When we started planning for this site, we knew we needed something fun, beautiful and easy to use. As our services are all available in English, Chinese and Japanese, doing this in a consistent manner would definitely be a challenge.

Bento Graphics delivered a site that met all these requirements, as well as providing some original takes on our branding guidelines that really helped to bring the site to life. Responsive design was also a key point for use – we wanted the site to look great and load quickly no matter what device it was being viewed on and Bento Graphics provided exactly that.

Tim McGregor
Senior Marketing Manager, Sony Global Education