All projects

Step Schools

Year
2025
My Role
Product Designer
Tools
Figma, Design Systems, User Research
Step Schools interface preview

Overview

Step Schools is an integrated educational platform designed to streamline student assessments, exam management, and academic tracking. I designed a mobile-first experience that guides students through practice sessions and formal exams with clear instructions and immediate feedback.

Problem

Traditional assessment methods lacked immediate student engagement and clear visibility into exam rules, while existing digital tools felt clinical and uninviting for students.

Goal

Create a user-friendly, engaging mobile environment that simplifies the exam process, provides clear instructions, and offers detailed performance insights through structured reviews.

Research

  • Students required a flow that reduces exam anxiety through clear 'Exam Instructions' and simple navigation.
  • Instant feedback via 'Solution & Explanation' blocks was identified as a key feature for learning during practice sessions.
  • Visual differentiation between 'Attempted', 'Correct', and 'Wrong' states was critical for the review phase.

User Flow

  1. Login
  2. Home / Dashboard
  3. Select Question Type
  4. Exam Instructions
  5. MCQ Practice
  6. Solution Review
  7. Exam Submission

Wireframes

Wireframes explored the transition from a broad dashboard to specific exam environments, ensuring consistent header actions.

UI Design

Mobile Applications

Native Android and iOS screens carrying the same experience to users on the move.

Step Schools mobile — Splash White
Splash White
Step Schools mobile — Splash Blue
Splash Blue
Step Schools mobile — Login
Login
Step Schools mobile — Sign Up
Sign Up
Step Schools mobile — Home
Home
Step Schools mobile — Select Question Type
Select Question Type
Step Schools mobile — Exam Instructions
Exam Instructions
Step Schools mobile — MCQ Practice
MCQ Practice
Step Schools mobile — Solution Review
Solution Review
Step Schools mobile — Incorrect Solution
Incorrect Solution
Step Schools mobile — Review All Questions
Review All Questions
Step Schools mobile — Questions Overview
Questions Overview
Step Schools mobile — Exam Result Summary
Exam Result Summary
Step Schools mobile — Results
Results
Step Schools mobile — All Results Summary
All Results Summary
Step Schools mobile — English Result
English Result
Step Schools mobile — Review Answers
Review Answers
Step Schools mobile — Find Jobs
Find Jobs
Step Schools mobile — Job Filters
Job Filters
Step Schools mobile — Job Detail
Job Detail
Step Schools mobile — Apply Now
Apply Now
Step Schools mobile — Application Submitted
Application Submitted
Step Schools mobile — Notifications
Notifications
Step Schools mobile — No Notifications
No Notifications
Step Schools mobile — Profile — Light Mode
Profile — Light Mode
Step Schools mobile — Terms
Terms
Step Schools mobile — Logout Modal
Logout Modal
Step Schools mobile — Dark Mode — Splash
Dark Mode — Splash
Step Schools mobile — Dark Mode — Login
Dark Mode — Login
Step Schools mobile — Dark Mode — Home
Dark Mode — Home
Step Schools mobile — Dark Mode — Question Type
Dark Mode — Question Type
Step Schools mobile — Dark Mode — Exam Instructions
Dark Mode — Exam Instructions
Step Schools mobile — Dark Mode — MCQ Practice
Dark Mode — MCQ Practice
Step Schools mobile — Dark Mode — Solution Review
Dark Mode — Solution Review
Step Schools mobile — Dark Mode — Jobs
Dark Mode — Jobs
Step Schools mobile — Dark Mode — Notifications
Dark Mode — Notifications
Step Schools mobile — Dark Mode — Profile
Dark Mode — Profile

Prototype

A high-fidelity prototype was used to validate the exam timer, navigation between questions, and the display of solution explanations.

Interactive prototype preview available on request.

Outcome

The platform led to a 40% increase in student practice frequency and significant improvement in assessment scores due to clearer feedback loops.