ic_loader
Website
Dr. Panda
An educational games platform for international audiences

The Project

Educational games have a great impact on kids’ development.

Dr. Panda is a Chinese developer creating educational games for kids to help them learn about the world without scores, rules and competition. Instead, their games foster creativity and create a space for imagination.

At Apptension, we’ve developed an interactive platform that curates all Dr. Panda titles. Through the website users can easily browse through game categories and go directly to download them from Amazon, Google Play and Apple App Store.

Under creative direction of Dr. Panda’s designer, we’ve built their new, multilingual website hosting educational games for kids.

Services

Design / Frontend Development / Backend Development

Tech

HTML5 + CSS3 + JSX + React + Redux + GSAP + Scroll Magic + PHP5 + MySQL + Docker + WordPress

The Challenge

Dr. Panda approached us at the beginning of 2016, looking for a team to design and develop their new, international website.

It was important to make sure that the website was optimized for Google and YouTube, but also for Baidu and Youku - their Chinese counterparts. We’ve used server side rendering to correctly position Dr. Panda in both search engines.

Our job was also to make sure that the Chinese content was displayed correctly after it was translated to English.

The Tech

Developing Dr. Panda’s new website we were responsible for both frontend and backend development.

On the frontend side we’ve used HTML5, CSS3 and JSX. Starting the project, we’ve decided to use a tech stack with promising longevity - that’s why we went for React and Redux. React is accountable for managing application’s views, while Redux is responsible for the data flow within the app. To create and control the scroll-based animations, we’ve used two JavaScript libraries: GSAP and Scroll Magic.

To better maintain the JavaScript code, we’ve used Webpack, a module bundler keeping our code clean and reducing the loading time.

On the backend side, we’ve used technologies like PHP5, MySQL and WordPress. We’ve used the last one only as a REST API to manage the multilingual content. The whole website is served separately and based mostly on React.

We worked on a standardized programming environment using Docker architecture. It allowed our developers to work on isolated, lightweight containers and, as a result, shortened the maintenance and deployment process.

The Process

Working within different time zones was challenging, as agile approach required frequent communication with the client. To overcome it, we’ve had to adjust our meetings to the few overlapping hours.

Our team of project managers, frontend and backend developers, QA specialists and designers worked in Scrum, which allowed us to iteratively deliver the project and report to our client after each sprint.

Designing the website, our team worked under the supervision of the client’s designer, Jaro Sigrist. The design of Dr. Panda website is colorful and playful. Browsing, previewing and searching for games is very easy. The whole website is optimized for mobile devices, which makes the experience equally good on smartphones and tablets.

We’ve successfully launched the website on March 2017 for international visitors.

Credits

Project Manager
Wojciech Łęcki
Project Manager
Adrianna Konieczna
Tech Lead
Wojciech Panek
Frontend Developer
Patryk Poleszczuk
Frontend Developer
Daniel Leszczyński
DevOps Engineer
Mateusz Kubaczyk
QA Specialist
Paulina Grabowska
Designer
Jakub Paniączyk
Designer (freelance)
Jaro Sigrist
Unsupported browser
We recommend that you use one of these browsers. You can go to https://whatbrowser.org/ to update your browser.
Chrome 55+
Firefox 46+
Microsoft Explorer 11+
Microsoft Edge 13+
Safari 10+
This website require javascript in order to work properly.
Please enable JavaScript