Back to top

Overview

Edifyd is a learning management system software, used for corporate training in industries like hospitality, construction and security industries. Admins can upload their own training material on the software, and distribute them to employees across the company.

Role

-UX and product designer

Deliverables

- Landing page designs and development
- High fidelity software user interfaces
- Brand guideline and marketing materials

Tools

- Figma
- Webflow

Sections:

UI / UX designs Login pages

Process and stakeholders

In this project, I have closely worked with few developers, a business analyst and a marketing manager and learning consultant.
I was in charge of all the design work of this startup. I have consulted closely with internal stakeholders to gather insights, turning them into user interfaces and gathered feedback for improvement.

Challenge - Designing a new interface for HR to track course completion.

The problem

Distributing and managing inductions and training is difficult in high rotation industries. There are a lot of manual processes required. It is even more stressful dealing with employees who don't finish their inductions on time, having to chase them up through email and phone.
20-30%

The average rate of course completion across the industry in 2020 (Solis, 2021).

Some employees also don't take training seriously, going through training without thoroughly looking through content. This can cause problems especially in blue collar industries, as they have strict standards to adhere to.

Research and insights

A phone interview was conducted by our business analyst with one of our most active client - A leading security firm in Australia.
This interview was an aim to understanding how they are using our product, what their pain points are and what they liked about out platform.
I have then created a persona to better analyze her needs and pain points:
After the interviews, I have generated 2 How-Might-Wes to tackle based on our persona:
  • Ease process tracking of individual employees, and chasing up to complete incomplete inductions?
  • Help Jessie and her company self manage their own content, upload training materials herself easily (eg. SCORM, powerpoints) without having to depend on external suppliers

Ideate

We have then ideated solutions as a team to generate opportunities that could tackle pain points.
Throughout this process, I have also conducted competitor analysis. I have paid attention to their features, their users, product objectives, and identified their strengths and weaknesses, as well as points we could be inspired from.
At the same time, I have examined courses from our existing client, and how our user interface could be improved to suite client needs.
I have presented my insights to the team, and combining insights from interviews, we have brainstormed features to implement, with engineering effort and marketing needs in mind.

Interface design

The product team then wrote up requirements and user stories. I have then translated these requirements into user interfaces, with consideration to best practices and accessibility.
Throughout the design process, I have closely consulted with the team to gather feedback, ensuring what I'm designing are feasible and fits marketing needs.

Dashboard

Alerting admins important tasks to take action on.
  • Using colour and data visualization to highlight important information
  • It was found that what they most care about was the completion rate of courses, thus this was placed on top of the dashboard, with large text so they could know what to take action on.

Exception reports and tasks

Emails are the main channel of communication between employees and HRs.
When reminder emails are bounced back, or when important inductions by employees are incomplete, HRs should be notified and follow up should be taken immediately.

Course Creator

A course creator was designed so companies can create their own course with their own content. Analysing existing courses from clients and underdtanding how they use our platform, some features we have included are: 
  • Sharing permissions and co-editing so other admins of the organisation can comment and edit on course programs
  • Adding visual, audio, HTML and video elements to modules
  • Admins can set conditions between modules and programs: such as "if employees pass/fail", and delays between modules

Other designs - Login pages

A lot of effort was placed into the look and feel of the login pages as it is the first touch point from clients

Employee login pages

Employee login pages should look colourful and lighthearted. Training can be stressful and boring for some, but our branding shouldn't, thus, we wanted the positive imagery of completion, conveying the positive feelings of passing a training course.
I have experimented with both illustrations and images, to see which one created most impact.
Both were taken from a royalty free website, but illustration colours were altered to our brand colours
The second version was chosen as it looked more fun and lively, and we wanted to stray away from the 'school' and 'university' images as audiences were more in the blue collar and hospitality sector.

What else?

Due to NDA, I cannot disclose any further, but here are other designs I've done during this position:

User app

Designing for the user (employee) end of the application

Components

Designing UI components to ensure visual design is consistent across the software.

Course editor

Editor where admins can edit, create a course, and change its content

Results

This project is still in development with the dev team, and is awaiting to be tested with the client. I was also responsible for development handover, annotating designs so they are dev ready.

Reflection

This was the second SaaS project I've taken part in (The first was Smartplace), and I feel like I've improved so much, both in product design and UI design.
  • I previously didn't experiment much with colours since it was a corporate software, but this time I've experimented with using more colours on the screens to brighten up the software.
  • I've improved in keeping master components more organised, and have learnt to use variants in Figma for my designs, in order for components to be consistent.
Relevant projects