Case Study: Learning Platform


CHALLENGE

With a demand for a more modern product, ELL Technologies was looking to rebuild their lesson framework and learning tools. They also wanted to add a Student and Teacher dashboard to their learning platform.

Project type: Online Learing platform

MY ROLE

  • Creative Director
  • UX / UI Designer
  • Product Manager

WHAT I DID

  • Requirements Gathering
  • Research
  • Task Models
  • Sitemap
  • Wireframes
  • User Interface Design
  • Development
  • Usabilty testing (QA)

Requirements Gathering

To start the project, Stakeholder meetings were set up to determine business needs and requirements.

The main takeaways were:

  • Build a scalable and Modular Framework (for adding and managing courses online)
  • Create a Student Dashboard for students to manage courses, view progress and access learning tools
  • Create a Teacher Dashboard for teachers to manage classes and
    students, access courses, set schedules and have a direct line of
    communication with students
  • Rebuild lesson framework and learning tools
  • Cross browser and tablet compatibility
  • Turnkey localization functionality

Task Models

Once the requirements were established I created task models and screen mockups outlining all the tasks that the user needed to do to accomplish any of their goals. This included accessing courses, completing lessons, viewing progress, creating a schedule, accessing a messaging centre, managing classes and using learning tools. This step was crucial in indicating all the details for the user experience, key design components and functionality.

Task Models

Once the requirements were established I created task models and screen mockups outlining all the tasks that the user needed to do to accomplish any of their goals. This included accessing courses, completing lessons, viewing progress, creating a schedule, accessing a messaging centre, managing classes and using learning tools. This step was crucial in indicating all the details for the user experience, key design components and functionality.

Wireframing

Using the task models and requirement docs, I moved into wireframing, which showcased all functionality and design elements. I worked through several different options, before getting feedback from my team, making updates and coming up with the final set.

User interface design

Once the wireframes were complete, I was able to start the UI design. Two main factors were a responsive design fro use on tablets and a white labelling feature, giving clients the option of customizing the template to suit their branding needs. With this in mind I wanted to keep the design minimal and clean. Once the design was complete, style guides were set up to help with development.

User interface design

Once the wireframes were complete, I was able to start the UI design. Two main factors were a responsive design fro use on tablets and a white labelling feature, giving clients the option of customizing the template to suit their branding needs. With this in mind I wanted to keep the design minimal and clean. Once the design was complete, style guides were set up to help with development.