Overview
About MCI Academy
Hamrah-e-Avval (MCI) is the leading operator of Iran which provides telecommunication solutions to Persian customers. MCI Academy is an educational wing of MCI that empowers fresh graduate students with online courses and internship programs.
Product List:
- Online courses
- Online internship management system
- Resume builder
- Test builder
- Design System
- Gamified education program
1 – Online courses
Problem Statement
Deliver relative online educational courses to the users.
Solution
A basic LMS to help users find the fittest courses for them and take them easily.
Design process:
- Creating usability issue list by heuristic evaluation and one to one usability test
- Prioritize issues and solutions
- Design and develop
- Daily check website heatmap and user recorded sessions
Usability issue list
After evaluation we bring issues into a list in online google sheets then we prioritize every issue.
Ui and Prototype
2 – Online internship management system
Problem Statement
Our mission was to guide good candidates to be prepared for working in MCI through an internship program.
Solution
The solution was to guide candidates with good content in right place and a panel that helps evaluators to find the best resume between various resumes.
Design process:
- Research and benchmark
- Design the first version and test the user flow
- Improve user flow and page content based on the first version
- Improve admin panel with multiple features
User flow
In the first version, we try to achieve user goals with a simple user flow:
After the first version, we find the user flow appealing and we tried to improve our submission stage by this user flow:
Wireframe
After brainstorming with the team, we decided to simplify resume submission flow in these five steps:
Admin panel wireframe:
In version two of resume submission we use our built-in resume builder:
Ui and Prototype
Test and Results
Till this day (January 2022) we got +9000 submitted resumes for +140 internship positions.
3 – Resume builder
Problem Statement
After developing the first version of the internship process management system we find that the quality of submitted resumes was not good enough so we decided to maintain our resume builder and force applicants to fill in the important details about their education, experience, skills, and etc.
Solution
First, we benchmark online resume builders such as resume.io, wozber.com, jobinja.ir and etc. Then we design and develop the first version and test them in the second internship program. In the third internship program, we redesign every section based on the previous cycle.
Design process:
- Benchmarking
- Design and develop the first version
- Test the resume builder on the second internship program
- Redesign resume builder for third internship cycle
User flow
In this flow we try to find when a user finds the resume builder and how reacted to it:
Wireframe
Ui and Prototype
First version:
Final version:
Results
After two quarters we arrive at this sciatica:
+9000 unique users builder their resumes and +3000 (+30%) of them fill +80% of resume sections.
4 – Test builder
Problem Statement
To find the best candidate to guide them through the internship process we decided to maintain an early evaluation exam to test applicants’ skills.
Solution
An early evaluation exam that tests applicants multiple skills.
Design process:
- Design and develop the first version that contains three categories of the test (math, English, and general questions)
- Trying to stabilize the exam process
- Design and develop a comprehensive exam builder platform
User flow
First version
Final UI and Prototype
After the usability test we arrive at these pages:
Test and Results
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
5 – Design System
Problem Statement
We were an agile team with 4 developers. We were trying to design products in our team as quickly as possible and consistently so we decide to design a single source of truth for our style guide, main component, and design process to empower our design and development team.
Solution
The solution was simple first we decided to put the style guide together to have a consistent style guide after that we design a simple UI Kit in Figma then we document every step of the design process and deliverables for teams.
Design process:
- Create a list of usability issues by checking inconsistent pages, site heatmap, and user session recordings
- Choose a design tool (Figma) and set the style guide
- Design a simple UI Kit
- Document Design process and deliverables
UI Kit Checklist:
Final Result
Test and Results
The result was consistent UI components, increasing the design process by 50%(measured by hours spent on UI design) and increasing the development process by 30% (measured by hours spent on front-end tasks).
