Background
Romero Mentoring is an EdTech platform that helps students and professionals succeed in the finance industry. Founded by Luis Romero in 2016 with only four students, it has become one of the best EdTech platforms in the finance industry.
In 2019, Romero Mentoring approached us to help them improve their corporate website’s UI/UX design. After working with us for a while, they liked the quality of our work and shared their vision for a career platform that would allow them to connect their students with companies to help them with job placements.
Back then, they had three websites
A Corporate Website to engage with new prospects.
A Learning Management System (LMS) for their premier program.
A clone of their LMS for their free program.
But, a few things needed to be improved before building a career platform.
1
UI/UX
While the existing platform was good enough for a small number of students for one program at a time, we needed to redesign it to align with the client’s future vision. The goal was to attract a broader audience and manage multiple programs with social connectivity features.
2
Code maintenance and security
Their platform used a mixture of WordPress core, third party plugins, and custom PHP code with no clear architecture. Most of the codebase was outdated, posing severe security vulnerabilities like XSS, access controls, SQL injection, and lack of proper data encryption.
3
Centralized database
Since they were using a clone of an LMS to manage each program with a different database, there needed to be a centralized database to consolidate the users. It was also counterproductive to clone the existing codebase on a new server every time they had to launch any future programs.
Rethinking the UI/UX
After the initial discussions, we discovered that the client needed a single platform with a learning management system, a social network, and a career platform. With this in mind, we initiated the design phase, which included the following:
User surveys and questionnaire
To gather information on how their users behaved, their needs, and pain points.
Competitor research
To understand what their competitors were good at and find out any gaps in the market.
Value proposition canvas
To position the product around their user’s values and needs.
Mockups and prototypes
After gathering all the needed information, we designed mockups and prototypes to showcase how the end product would look.
Incorporating feedback
After presenting the prototype to the client and its users, we incorporated their feedback in the mockups.
Final design
In the final stage, we designed a standardized UI kit that included typography, color palettes, and general UI components.
A robust and scalable tech stack
To ensure the client would avoid running into scalability issues in the future, we developed a custom application using the following tech stack.
Front-End
HTML
CSS3
Sass
JavaScript
NodeJS CLI
Back-End
PHP
Yii 2.0
Elixir
XMPP
ejabberd
Devops
MySQL
Git
Vultr
Our proudest achievements
A unique learning management system
Students can enroll in multiple programs and easily switch to the dashboard for each program. The program dashboard allows students to connect with their cohort, view webinars easily, and track their progress.
A modular structure allows students to easily navigate each module and its lessons, while the custom video player enhances the learning experience with its closed captions, bookmarking, and speed control options.
A practical career portal that connects students with companies
Companies can create profiles, post jobs, and search for potential candidates based on their skills, experience, and other relevant criteria. On the other hand, students can create their own profiles, upload their resumes, and search for job opportunities that match their interests and qualifications.
The platform also allows recruiters to help companies find the right talent, saving time and effort in their hiring process.
An engaging social network
We designed a custom social network to improve engagement and connectivity among users.
The platform features customizable user profiles, connection and mentor requests, network lists, and real-time personalized feeds to foster a close-knit community environment for students.
These features promote engagement and encourage users to participate in the platform actively.
Our development team was able to achieve
A powerful chat server
A custom chat client and server using XMPP, the same technology that powers WhatsApp for billions of users, ensuring reliable, high-quality communication for all of our users.
A highly efficient RDMS database
By utilizing a Relational Database Management System (RDMS) in our database design, we could ensure high levels of optimization and efficiency while keeping server overhead to a minimum.
A custom CSS framework
Our custom CSS framework, built on Bootstrap 5 and extended with SCSS, helped us quickly code over 160 screens with minimal CSS. It’s easy to maintain and continues to support our front-end development.
Fresh look for the corporate website
We also redesigned their corporate website to increase the engagement and result in higher conversion rates.
“As I reflect on my experience with the entire Pixelative team, I am grateful for their tremendous effort and professionalism in supporting Romero Mentoring. Romero Mentoring was a successful small business delivering career mentoring programs to students using an outdated platform.
With Arslan’s leadership, we designed an entirely new platform to deliver the best experiences to our students. We developed a product that has positioned Romero Mentoring as an emerging leader in the career mentoring space.
The entire Pixelative team’s contribution to building our EdTech platform is remarkable. Their client-first approach is a quality that separates them from others. Romero Mentoring has gained an incredible partner who truly cares about our mission and success. We highly recommend Pixelative to business owners who are looking to take their business to the next level.”
Luis Romero
Founder, CEO
Romero Capital
Case studies
