top of page
Create Your First Project
Start adding your projects to your portfolio. Click on "Manage Projects" to get started
Learning Center Management
EduTrack is an Employee Management and Data Analytics Dashboard I designed, implemented within a school environment. Its main purpose was to streamline administrative workflows and empower tutors and school staff with real-time data and task management tools.
Designing the Foundation: EduTrack’s Early Dashboard Experience
1. Strategy Grounded in Real Operational Challenges
EduTrack was designed to help tutoring center directors make faster, more informed decisions during their daily operations. The core insight from early discovery research was that users needed immediate visibility into tutor status, active sessions, and visitor traffic—without toggling between different tools or interrupting workflows. This led to a real-time dashboard interface that balances at-a-glance clarity with actionable depth. The UI shown here directly reflects that strategic intent. Key metrics such as Total Visitors and Active Sessions are not only surfaced immediately at the top, but are paired with subtle growth indicators (e.g., “↑ 12% this week”), offering just enough trend context without overwhelming the user. This mirrors the high-priority Tier 1 information you prioritized in your system hierarchy: quick, actionable, and essential to daily oversight.
2. Execution Rooted in Scannability and Cognitive Simplicity
Every design element in the UI supports the user’s need to scan fast and act decisively. For instance, in the Visitor Trends section, return rate, average session duration, and visitor satisfaction are displayed side by side with high visual contrast—using bold typographic weight and distinctive colors for each metric. These reinforce your Tier 2 design principle: bring analytical insight to the foreground without asking the user to dig. The Active Tutors section uses profile images and clear specialty labels (e.g., Physics, Mathematics) to humanize the dashboard while maintaining clarity. Crucially, tutor availability is communicated through color-coded status chips: “Available” in a calm green and “In Session” in a soft red—consistent with your stated goal of minimizing cognitive load. This reflects real test-based feedback, where color clarity was shown to reduce confusion and navigation time during peak usage.
In the Upcoming Sessions block, the use of subtle icons, left-aligned time ranges, and clearly marked room locations (e.g., “Room 201”, “Lab 3”) addresses the pain point users voiced during usability tests—namely, the need to identify what’s happening next without extra clicks. You implemented these refinements after direct observation of back-and-forth scanning between session names and separate calendars. By embedding the room and time context directly into the session card, the need for secondary reference tools was eliminated.
3. Design Decisions That Translate into Tangible Impact
This UI demonstrates how your solo design process turned research and systems thinking into a visual hierarchy that anticipates user behavior under pressure. You avoided clutter, opting instead for a modular structure with clear separation between insights and actions. Navigation at the bottom keeps essential paths like “Schedule” and “Visitors” just one tap away, reinforcing your focus on reducing navigation depth and supporting efficiency.
Post-launch metrics back up these design choices. Tutors and administrators were able to locate session information and availability 60% faster, and engagement analytics showed a significant uptick in daily usage. The interface didn’t just look good—it functioned as a command center that turned disorganized manual workflows into smooth, predictable routines. Feedback such as “I feel more in control now” points directly to the success of your clarity-first design philosophy. The screen you've provided acts as a proof point of your ability to take ambiguous, real-world challenges and turn them into interfaces that support real-time decision-making and human-centered efficiency.
EduTrack was designed to help tutoring center directors make faster, more informed decisions during their daily operations. The core insight from early discovery research was that users needed immediate visibility into tutor status, active sessions, and visitor traffic—without toggling between different tools or interrupting workflows. This led to a real-time dashboard interface that balances at-a-glance clarity with actionable depth. The UI shown here directly reflects that strategic intent. Key metrics such as Total Visitors and Active Sessions are not only surfaced immediately at the top, but are paired with subtle growth indicators (e.g., “↑ 12% this week”), offering just enough trend context without overwhelming the user. This mirrors the high-priority Tier 1 information you prioritized in your system hierarchy: quick, actionable, and essential to daily oversight.
2. Execution Rooted in Scannability and Cognitive Simplicity
Every design element in the UI supports the user’s need to scan fast and act decisively. For instance, in the Visitor Trends section, return rate, average session duration, and visitor satisfaction are displayed side by side with high visual contrast—using bold typographic weight and distinctive colors for each metric. These reinforce your Tier 2 design principle: bring analytical insight to the foreground without asking the user to dig. The Active Tutors section uses profile images and clear specialty labels (e.g., Physics, Mathematics) to humanize the dashboard while maintaining clarity. Crucially, tutor availability is communicated through color-coded status chips: “Available” in a calm green and “In Session” in a soft red—consistent with your stated goal of minimizing cognitive load. This reflects real test-based feedback, where color clarity was shown to reduce confusion and navigation time during peak usage.
In the Upcoming Sessions block, the use of subtle icons, left-aligned time ranges, and clearly marked room locations (e.g., “Room 201”, “Lab 3”) addresses the pain point users voiced during usability tests—namely, the need to identify what’s happening next without extra clicks. You implemented these refinements after direct observation of back-and-forth scanning between session names and separate calendars. By embedding the room and time context directly into the session card, the need for secondary reference tools was eliminated.
3. Design Decisions That Translate into Tangible Impact
This UI demonstrates how your solo design process turned research and systems thinking into a visual hierarchy that anticipates user behavior under pressure. You avoided clutter, opting instead for a modular structure with clear separation between insights and actions. Navigation at the bottom keeps essential paths like “Schedule” and “Visitors” just one tap away, reinforcing your focus on reducing navigation depth and supporting efficiency.
Post-launch metrics back up these design choices. Tutors and administrators were able to locate session information and availability 60% faster, and engagement analytics showed a significant uptick in daily usage. The interface didn’t just look good—it functioned as a command center that turned disorganized manual workflows into smooth, predictable routines. Feedback such as “I feel more in control now” points directly to the success of your clarity-first design philosophy. The screen you've provided acts as a proof point of your ability to take ambiguous, real-world challenges and turn them into interfaces that support real-time decision-making and human-centered efficiency.
User Management System
This screen was designed to support the objective of building a clear and scalable system for managing user roles, permissions, and account activity across an educational platform. The interface provides a straightforward overview of three key user roles—Administrators, Tutors, and Staff—each grouped visually with their respective access levels clearly listed. This approach promotes immediate role clarity, reducing friction during onboarding and simplifying ongoing permission management. To improve usability for non-technical administrators, the layout emphasizes transparency and control without requiring back-end knowledge or IT support.
A searchable and paginated user directory anchors the lower half of the screen, enabling staff to quickly locate individuals in large organizations. The addition of real-time activity tracking (“Last Active”) and color-coded status indicators (like “Active” in green) gives administrators quick feedback about account usage. Thoughtful UX choices such as these support faster decisions, whether someone needs to be onboarded, edited, or deactivated. The design also anticipates future scalability, with room for features like bulk actions, CSV import/export, and role-based permission templates—all critical for growing institutions managing dozens or hundreds of users.
Ultimately, this view reduces the time needed to onboard or remove users, improves understanding of who has access to what, and ensures that administrative staff can confidently manage user permissions without the need for technical assistance.
A searchable and paginated user directory anchors the lower half of the screen, enabling staff to quickly locate individuals in large organizations. The addition of real-time activity tracking (“Last Active”) and color-coded status indicators (like “Active” in green) gives administrators quick feedback about account usage. Thoughtful UX choices such as these support faster decisions, whether someone needs to be onboarded, edited, or deactivated. The design also anticipates future scalability, with room for features like bulk actions, CSV import/export, and role-based permission templates—all critical for growing institutions managing dozens or hundreds of users.
Ultimately, this view reduces the time needed to onboard or remove users, improves understanding of who has access to what, and ensures that administrative staff can confidently manage user permissions without the need for technical assistance.
bottom of page