top of page

Redesign: Web-to-Robot QuizTool

Website

Robot App

Cross-platform

QuizEditor and QuizDash is a set of web-to-robot solutions for quiz-created and gamification of learning. With this editing tool, users can design unique quiz questions, customize question types, and set the robot sensor as the game buzzer. Players can interact with the robot alone or team fight.

Team

1 Product Manager, 1 Product Designer, 2 Unity Engineers, 1 Front-end Engineer, 1 Back-end Engineer

Development Time

4 Scrum springs in 8 weeks, launched in 2021

My Role

Information Architecture, UI/UX Design, Visual Design, UX writing

Platforms

Desktop, Tablet, Robot

Situation

The initial service was aimed at B2C use cases and applied to end-users, but due to our clients' teaching and business service demands, the solutions should be expanded to meet the B2B and B2C clients' needs. In this revision and product re-strategy, I not only redesigned a new robot App “QuizDash” based on the original structure but also crafted the website “QuizEditor” for users to create their own question pools and deploy them to robots to enjoy the quiz games.

Goals

  • Customize questions flexibly and free by users on the website.

  • Manage, access, and re-use question pools effectively.

  • The play experiences to move beyond screens and pixels, and a general visual style that can meet diverse scenarios.

  • Cross-platform integrates students' learning history and aggregates it to the official education department server.

Framework and UX strategy

Information Architecture

After the product manager made the function specification, I defined the UX strategy and information architecture, and overviewed the page hierarchies and flows to create the reusable interface layouts. I also designed the dependent setting items and data formats that are set via the website and shown on the robot App.

Wireframe

I crafted the wireframes to align with the product manager, design team, and developer team to make clear everyone’s expectations and thoughts. Collected feedback, communicated, and reached a consensus.

Artboard2.png

Visual & Gaming Interactive Design

Gaming Interactive Design

The original robot App couldn’t fit the new structure, so a new one is necessary. Based on the original, I optimized the interaction design, aiming to fully apply the multi-touch sensor and natural language processing (NLP) technology of the robot, so that users could play not only by the touch panel—— but also they can answer the quiz by touching the robot’s head, face, belly, hands, or by speaking.

Visual Strategy

“What’s the essence of playing?” —— getting started with this concept, I made two styles of mood boards to explore the visual direction and speed up stakeholder communications. Plan A was picked based on the considerations of “generalization, flexibility, and scalability”.

moodboard-g-01.png

I crafted the interface design of the website and the robot App, and worked with a cross-functional Scrum team to complete the five springs development.

UI Kit.png
截圖 2022-07-01 下午4.28.20.png

Product expansion

New requirements and using scenarios

Yilan County Government Education Department had the requirement of students practicing English vocabulary via robots or tablets, aimed to enhance their learning motivation.

 

After discussing with the product manager, instead of making a new product, I thought the best solution was to expand the functions of web-to-robot QuizTool that could get a win-win result—— minimized development cost and maximized scalability and flexibility of quiz-taking. In addition, students’ learning history play the important role in Taiwan’s educational system, so that would benefit students if their learning results were recorded and uploaded to the official education server effectively.

student_login.png

Therefore, I crafted an App that could work on robots and Chromebook. Students could log in to the App via scanning student cards’ QR-code or face-recognization, checking out, and accessing the learning tasks. At the same time, by adding the quiz type “English practice” on QuizEditor and QuizDash, teachers could classify the vocabulary and design quizzes, and the system would recognize and rate students’ pronunciation while they took quizzes on QuizDash.

Results

After launching, the products were applied to households, learning and teaching, and business situations by up to 10,000 users. The functional expansion solutions were accepted by Yilan County Government Education Department, we won the tender and applied the service to more than 100 elementary schools and middle schools. In 2022, the products were also aimed as one of the robot's main applications by our agent partner Hong Kong Telecommunications (HKT) Limited, which might sell out about 50,000 in Hong Kong.

20210519_kebbi_feature6-01.png
bottom of page