🥇9000 EGP
1st Place
🥈3000 EGP
2nd Place
🙋♀️ Register before:
Thursday, August 1st
📦 Submit before:
Saturday, August 10th
ClassPill is building a customized, interactive, and engaging learning system based on game-based learning and a rewarding system based on gamification. (Click here for more information.)
In this quest, ClassPill needs to enhance the platform experience and user interface. The dashboard has two main user personas - the teacher and the student. ClassPill should make the dashboard easy to use and provide a self-service experience. And here the flow of the platform
the website is created to help the teachers create interactive exercises for their students. It’s a subscription-based website and the plans is depending on the number of students/ class and the number of games the the teacher can save. Later on, this website will be a market for teachers to sell their games and make some money and this video demonstrates the current dashboard
ClassPill's Design System and Guidelines (Click here for more information.)
Font Family: Poppins
Buttons Color:
Primary Color: #4c6bb6
Primary Color Hover: #4261af
Secondary Color: #e1e8ff
Secondary Color Hover: #ced7f5
Dark Color: #1d242d
Dark Color Hover: #151a20
Disabled Color: #e5e7eb
Objectives:
Create high-fidelity wireframes and mockups for key screens.
Ensure consistency with the existing style guide.
Enhance the overall user experience for both students and teachers.
Student
Role:
user of the platform who engages with the educational games, tracks progress, and participates in classroom activities.
Goals:
Engage in educational games to learn and improve skills.
Track personal progress and compare performance with peers (through the Leader board).
Participate actively in game rooms.
Interactions:
Interacts with the student dashboard, game rooms, and class leaderboard.(multi-room, multi teachers)
Teacher
Role:
Facilitator and manager who creates and assigns games monitors student progress, and manages classroom activities.
Goals:
Enhance student engagement and learning through interactive games.
Efficiently manage classroom and game activities.
Monitor and improve student performance and engagement.
Maintain organized and easily accessible data on student activities and progress.
Interactions:
Interacts with the teacher dashboard, class, and room management, data management (class data, room data, leaderboard data, player/student answers data, statistics page), student management, and game creation and assignment pages.
The primary objective is to design the user experience (UX) and user interface (UI) in a way that successfully addresses the key user stories.
As a student, I want a visually appealing dashboard so that I feel motivated to engage with the platform.
As a student, I want my dashboard to be easy to navigate so that I can quickly find what I need.
As a student, I want to see my position on each class leaderboard so that I can gauge my performance relative to my peers.
As a student, I want the leaderboard to be easy to understand so that I can quickly see my ranking.
As a student, I want a seamless process to enter the game room so that I can start playing quickly.
As a student, I want clear instructions on how to join a game room so that I don't get confused.
As a student, I want to get notified when a new game is assigned to me.
As a student, I can see all the classes I’m in.
As a teacher, I want to easily select a class and add students to game rooms so that I can manage game sessions efficiently.
As a teacher, I want a straightforward process to assign games to rooms so that I can save time.
As a teacher, I want the data for each class to be saved and easily retrievable so that I can review past activities and performance.
As a teacher, I want the data for each room to be saved separately within the class folder so that I can track performance and activities by room.
As a teacher, I want to see my games library on the dashboard so that I can quickly access and manage my games.
As a teacher, I want options to organize my games so that I can find them easily.
As a teacher, I want to be able to edit, delete, or deactivate games, classes, rooms, and students so that I can manage my resources effectively.
As a teacher, I want to assign each student to a class so that I can organize my students effectively.
As a teacher, I want to create student accounts so that my students can access the platform, Students will receive an email to register, and if he has already registered they will automatically enrolled to the room
Student Account
Main Dashboard (overview of activities, achievements
Student Profile (profile picture, name, mobile number,...)
Classes (assigned to student)
Leaderboard (view the leaderboard for each class)
Classes games answers and results (can be inside the class or leaderboard of the class)
Teacher Account
Main Dashboard (overview of classes, games, recent activities, and notifications)
Teacher Profile (profile picture, name, mobile, major, subscription info, age, years of experience, certificates )
Class Management (create, edit, and manage classes, deactivate, add and release students, assign games)
Room Management (add students to rooms Note: Max 4 students )
Class Data (view and retrieve data for each class)
Room Data (view and retrieve data for each room within a class)
Student Management (create and manage student accounts)
Games Library (view and organize games)
Game Assignment (assign games to classes)
Leaderboard Data (view leaderboard data for each class and room)
Player/Student Answers Data (view and analyze student answers)
Statistics (view and analyze statistics for games, classes, and rooms)
User Personas: Develop detailed profiles for each user type (teachers, students, administrators). Example (tips for the persona: teacher, living in GCC or Europe, most probably teaching languages)
User Journey Maps: Create maps to visualize how users interact with the platform at different stages.example1, example2, example3
Site Map: Outline the structure of the platform, including all key pages and navigation paths. Example1, example2
Low-Fidelity Wireframes: Create basic sketches of the main screens and user flows to establish layout and structure. Examples1 , example2
User Flow Diagrams: Visualize the steps a user takes to complete tasks within the platform. example1
High-Fidelity Wireframes: Develop Figma detailed designs that incorporate branding elements and more precise layouts. Example , example ,example
UI Mockups: Design high-fidelity mockups for key screens, ensuring consistency with the style guide. Example, example
Interactive Prototypes: after finishing UI mockups use Figma to create clickable prototypes for user testing. Example, Example
Design Documentation: Maintain detailed documentation of design decisions, user flows, and interaction patterns.
Developer Handoff: Provide clear and comprehensive design specs and assets to the development team.
We've provided some examples to help clarify, but please don't feel limited by these examples
Please read the UX Scorecard to see how the winners will be selected, and how we evaluate the best designs.
Prefer Illustrations over Stock Photos as much as possible,
Use public, free, and open-source icons, images, and assets.
Use 3D render Icons over 2D illustration icons.
If you design your own icons or images, you accept (if you win one of the prizes you give full copyrights to ClassPill ).
The minimum acceptable score is 160 (80% of 200). First, Second, and Third place will be the highest score above 160.
The first submission will get the highest place if two submissions earn the same score.
Login and Signup, home page, contact us, about us pages
Game Builder
The submission must include the following:
User Personas, User Journey Maps, Site Map
Low-Fidelity and High-Fidelity Wireframes
UI Mockups and Interactive Prototypes
Design Documentation and Developer Handoff
Video walkthrough of the journey.
Figma file or link
Screenshots of the designs
The licence.txt file detailed all the images, icons, and stock photos you used in the design.
Note: the structure of the pages can be modified to align with the design
🙋♀️Registrations: 0
📦 Submissions: 0
Updated every night