Case Studies

Designing for The New Age of Learning

Pathway.app is a education product that helps users define and represent their lifelong learning progress. With the world increasingly changing at a unprecedented pace, we recognize that an opportunity for improving the education system.

MTI Team
UXUI Design, Branding, Marketing, Web and Mobile Design
www.pathway.app

Project Overview

Web experience for Pathway.app

2018-2019

  1. Product ideation
  2. Prototyping and animation
  3. Visual design
  4. Illustration & icons

The Background

Pathway.app is a education product that helps users define and represent their lifelong learning progress. With the world increasingly changing at a unprecedented pace, we recognize that an opportunity for improving the education system.

Goals

  1. Develop and identity for learning representation that resonates with users - particularly the majority of the workforce in 2018 and beyond (millennials)
  2. Create an easy onboarding allowing users to create and represent their learning pathways in minutes
  3. Launch an MVP web app to beta users

The Problem Statement

Pathway.app is a venture and collaboration with the team at Mogul Tech International. Our intention was to solve an ongoing problem which we see with education. The demands of the workforce changes at an unprecedented pace. Workers of this new economy are finding themselves constantly needing new sets of skills and having a wide array of digital and critical thinking skills which traditional education has done little to prepare for. The gap between what is needed in the workforce and how digital skills, lifelong learning progresses and self-directed learning outcomes are represented and accepted represents a need for Pathway.app as a solution.

The Approach

We start by tackling the branding and identity, user journey mapping, prototyping and user interface design for the entire web app experience.

A breakdown of our approach:

  1. Research, product strategy and planning
  2. Iterations through sketching and low-fidelity wireframing
  3. Wireframing concepts
  4. Creation of a style guide
  5. Developing a user journey for the prototype
  6. Visual design and prototype creation

Developing a Brand

Pathway.app's core brand attributes focused on soothing users and encouraging them to take ownership of their learning. These attributes include: Guiding, Encouraging, Educational, Confident, Easy, Optimistic, Fun, Soothing, Manageable, Approachable. Keeping these attributes in mind, sketches with over 100 iterations of the logo, transitions, shapes, letter-forms and abstract graph shapes were explored.

Initial Logo Sketches - www.pathway.app
Colored logos - www.pathway.app

The User Journey

Perspectives of the user journey are of a new user and a returning user, to show the onboarding process from login to dashboard screen. The user journey accounts for future ideations of the design to include Resources and Account sections, even though those areas won't be present in the MVP release.

Pathway.app Desktop View Wireframe


Pathway.app

Prototyping the Dashboard Layout

The focus of the prototype is the simulation Dashboard. Users can get a quick overview of the main areas of their current learning progress, and the learning pathways which they are currently working on so they can quickly return to working on completing them.

The goal of the Dashboard is to give users confidence in their learning progress, by displaying a comprehensive overview of their current learning pathways, their personal learning goals and topics they are interested in learning, in a visually appealing and easy way, with as little complications as possible.

Focus Areas of the Dashboard

  1. Current learning pathways user is working on
  2. Clear state which prompts users to search for a new learning path to work on
  3. All published pathways created by user
  4. User's current learning goal
  5. User's learning interests
  6. User's current followers
  7. Sidebar that contains an overview
Dashboard - www.pathway.app

Responsive Design

The system is (of course) responsive allowing for a flexible layout across device sizes and screen resolutions. The responsive design separates the sidebar from the main experience to minimize the information shown to the user.

www.pathway.app

Conclusion

Pathway.app is a venture and collaboration with the team at Mogul Tech International. Our intention was to solve an ongoing problem which we see with education. As a in-house team developed concept, we intend to iterate and refine as we gain more insights from users.

Pathway.app is an on-going project.

Sign Up For Our Newsletter

Want the latest industry news to reach your inbox? Sign up now:

You've successfully subscribed to our newsletter!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Let's begin a
journey together.

Stay tuned to the latest UXUI news in the industry:
You've successfully subscribed to our newsletter!
Oops! Something went wrong while submitting the form.

Let's begin a
journey together.

Let us plan, rebrand, and launch your online business. From branding to marketing strategies and web design, we’ve got a solution for you.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
You've successfully subscribed to our newsletter!
Oops! Something went wrong while submitting the form.