At a Glance
We assisted ClassDo with UI/UX design, illustration and responsive HTML5 front-end development to relaunch their online knowledge marketplace.
In Detail
ClassDo – a young startup company based in Tokyo – approached us to help with the relaunch of their knowledge marketplace and learning platform. The aim was to bring the design and usability up to current standards.
ClassDo is the online Marketplace of Knowledge for teachers and students from +140 countries for live one-to-one lessons.
The project entailed user experience review, streamlining the interactions of the user journey, information architecture, wireframing, illustration, design of a new visual identity and responsive HTML5 front-end coding.
Visual Identity & Logo
The logo design plays with the idea of knowledge transfer from one person to another. The knowledge “particles” can flow in both directions from teacher to student, but students can also be teachers with a different subject at ClassDo, thus reversing the relationship.
Another design challenges in the ClassDo project was the split target-audience of students and teachers, the platform needed to appeal to both. Attracting teachers to offer lessons was a key objective, along with appealing to students with a friendly and approachable image and quality lesson plans.
Our new design concept gradually took shape:
- ClassDo is a place where teachers can have their own private Studio – or Room if you will – to offer lessons.
- It resembles a City of Studios, all which offer different lesson, from Japanese language to business consulting, math study, cooking practise and anything in-between is possible.
A result of this is the City of Studios illustration below:
Digital Styleguide & Web Development
We also created a digital styleguide which served as a design reference and HTML5/CSS3 framework to style the various pages elements e.g. colours, buttons states, menu interactions, notifications and others. We further developed the responsive front-end code with HTML5, SASS/SCSS, Jquery/Javascript and collaborated with Classdo on the integration and bugfixes.
The Teacher Studio
Following our City of Studios idea, each teacher has a unique public profile page which acts as the storefront of his studio through which he can offer his lesson plan:
Not only was the idea to create a studio feel on these profile pages with the choice of imagery of casual work settings, but teachers should be given the ability to make themselves at home. They are able to pick from a selection of presets of colour schemes or upload custom photos to further customise their studio:
Having complete freedom to set up their lesson schedule and availability was another core feature:
The Student Features
While the student and teacher features are separate interfaces within the ClassDo app, it is possible to be teacher and student at the same time. An interface switcher allows to access both sections. Also the public landing page of Classdo has two versions, one for teacher and one for students onboarding (see below).
At the core of Classdo is an interactive video chat with a digital notepad to communicate drawn information. Also a document viewer is available and marked up changes or text corrections can be saved and accessed even after the learning session.
