...

ElZaitoon – University E-Learning Mobile UX/UI Design

Client / Partner Al-Zaytoonah University of Jordan
Delivery Date 2024
Domain & Service Higher Education & E-Learning
Visit Live Website

Project Overview & Challenge

Higher Education Mobile E-Learning UX/UI Design System

OxTech architected a complete UX/UI redesign for Al-Zaytoonah University's mobile e-learning ecosystem, elevating digital interaction standards for thousands of undergraduate and postgraduate students. The design establishes a modern academic interface that prioritizes instructional clarity, intuitive syllabus navigation, and friction-free access to daily course milestones. By structuring information architecture around the student's active schedule, the solution minimizes cognitive overhead and reinforces the university's institutional vision for blended learning.

The Challenge

Higher education mobile platforms face the daunting challenge of condensing vast curricular structures, grade registries, and collaborative tools into constrained smartphone interfaces. The core challenge was distilling this sprawling institutional environment into an intuitive, lightweight mobile experience without stripping away academic depth. The design needed to simplify course discovery, visually declutter dense syllabi, shorten daily task pathways, and deliver a visual language suitable for everyday student engagement.

The Solution

We executed a user-centered design methodology focused on structural clarity and mobile ergonomics. The solution features an optimized Information Architecture, mobile-first layouts, and an actionable Student Dashboard that surfaces current lectures, upcoming deadlines, and course resources at a glance. Courseware was compartmentalized into bite-sized visual units with accessible navigation. A comprehensive, scalable Design System was created to preserve brand coherence across both iOS and Android platforms.

Key Features & Highlights

  • Mobile UX/UI Design: Native-tailored interfaces engineered specifically for iOS and Android environments.
  • Information Architecture (IA): Structural restructuring designed to declutter vast educational catalogs.
  • Dynamic Student Dashboard: Centralized portal providing real-time visibility into lectures, syllabi, and deadlines.
  • Streamlined Authentication: Secure, friction-free login and identity verification pathways.
  • Visual Course & Lesson Workflows: Modular presentation of lectures, syllabi modules, and multimedia resources.
  • Intuitive Navigation Framework: Optimized mobile navigation dramatically reducing click-depth for daily tasks.
  • University Design System: Comprehensive UI library of components, color palettes, and typographic tokens.
  • Accessibility & Usability Focus: High-contrast, ergonomic interfaces meeting international digital accessibility standards.

Technologies Used

UX/UI DesignMobile App Design (iOS & Android)User Experience ResearchUser Interface DesignDesign System ArchitectureInformation Architecture (IA)Student Dashboard ExperienceEducational Platform UXUser-Centered Design (UCD)Mobile-First Prototyping

Explore more selected flagship case studies.

Launch Lab Studio Sound Off