Case study

Servicima

Servicima project preview

Overview

Servicima is a multi-company management platform designed for staffing and recruitment companies. The platform manages the full lifecycle of candidates and employees, from recruitment and evaluation to client assignment, timesheets, and invoicing.

I joined Servicima in my first professional role as a UI/UX Designer. My first responsibility was to completely redesign the existing application while keeping the company's established brand identity.

Within less than three months, I also moved into frontend development and started contributing to backend tasks. This allowed me to work across both the product design and development sides of the application.

UI/UX Redesign

The project started with a complete redesign of the existing application.

The objective was to modernize the interface and improve the overall user experience without losing the existing brand identity.

I started with the ideation phase and prepared several design directions for the team.

After the team selected one of the proposed directions, I incorporated their feedback and refined the design until the overall visual direction was approved.

I then created the design system that would be used across the application.

The redesign process included:

  • Ideation
  • Multiple design proposals
  • Design direction selection
  • Design system creation
  • Low-fidelity wireframes
  • High-fidelity UI designs
  • Interactive prototypes
  • Design reviews
  • Feedback and iterations

I mainly used Adobe XD for wireframing, UI design, and prototyping, with Adobe Photoshop and Adobe Illustrator for editing images, illustrations, and icons.

Feature Design & Product Collaboration

After completing the initial redesign, I continued working with the team on new features and improvements.

For each new feature, I participated in meetings with the team to understand the requirements, user needs, existing pain points, and expected workflow.

I also contributed suggestions during these discussions and helped translate the requirements into practical user experiences.

My workflow for new features was generally:

  1. Team meeting and requirement analysis
  2. Understanding user needs and pain points
  3. UX suggestions
  4. Low-fidelity wireframes
  5. High-fidelity UI design
  6. Interactive prototype
  7. Team demo
  8. Feedback and iterations
  9. Final design handoff

This gave me direct exposure to the product development process and allowed me to contribute beyond the visual design itself.

Transition Into Development

Within less than three months of joining the project, I started working on the development side of the application.

I initially focused on frontend development using Angular 11, implementing features and interfaces based on the designs and product requirements.

I also contributed to selected backend tasks using Express.js, MongoDB, and REST APIs.

This was an important step in my career because it allowed me to combine the UI/UX work I was already doing with actual software development.

Frontend Development

I worked on the application frontend using:

  • Angular 11
  • TypeScript
  • HTML
  • CSS

My frontend work included implementing new features, translating approved UI designs into functional interfaces, and integrating the frontend with backend REST APIs.

Because I was involved in the design process, I could work directly from the wireframes and prototypes I had created and adjust the implementation based on product feedback.

Backend Development

I also contributed to selected backend development tasks using:

  • Express.js
  • Node.js
  • MongoDB
  • REST APIs

The application followed a microservices architecture, with different services handling separate parts of the business logic.

Multi-Company Platform

Servicima was designed to support multiple companies within the same platform.

Each company could manage its own:

  • Staff
  • Employees
  • Candidates
  • Recruitment processes
  • Clients
  • Employee assignments

The platform therefore supported different companies operating independently within the same application.

Role-Based Access Control

The application implemented Role-Based Access Control (RBAC) to manage access to different parts of the platform.

It supported:

  • Multiple user roles
  • Default seeded roles
  • Custom roles
  • Permission management

This allowed each company to control what different users could access based on their responsibilities.

Candidate Recruitment Workflow

Servicima managed the recruitment process from the initial job opening to the final candidate decision.

The platform supported workflows such as:

  • Job posting
  • LinkedIn recruitment
  • CV management
  • Candidate management
  • Interview scheduling
  • MCQ assessments
  • Test response management
  • Candidate scoring
  • Candidate acceptance or rejection

Once a candidate was accepted, they could move into the employee management workflow.

Employee Management

After recruitment, Servicima continued managing the employee lifecycle.

The platform supported:

  • Employee management
  • Client assignment
  • Client interview scheduling
  • Client approval
  • Employee assignment to clients
  • Weekly timesheets

This connected the recruitment workflow with the operational management of employees.

Timesheets & Invoicing

Employees recorded their working hours through weekly timesheets.

The recorded working time was then used in the client billing workflow, allowing the platform to generate invoices based on the employee's reported work.

This connected employee management, time tracking, and client invoicing within the same platform.

My Role

UI/UX Designer → Frontend & Backend Developer

I started on Servicima as a UI/UX Designer and expanded into software development within less than three months.

UI/UX

  • Ideation
  • Creating multiple design proposals
  • Complete application redesign
  • Preserving the existing brand identity
  • Design system creation
  • Low-fidelity wireframes
  • High-fidelity UI design
  • Interactive prototyping
  • New feature design
  • User flow design
  • Product meetings
  • Requirements analysis
  • UX suggestions
  • Team demos
  • Design iterations based on feedback

Frontend

  • Angular 11
  • TypeScript
  • HTML
  • CSS
  • REST API integration
  • Feature implementation

Backend

  • Express.js
  • Node.js
  • MongoDB
  • REST APIs
  • Selected backend feature development

Architecture & Product

  • Microservices architecture
  • Multi-company application
  • Role-Based Access Control
  • Recruitment workflows
  • Employee management
  • Client assignment
  • Timesheets
  • Invoicing workflows

Technology

UI/UX

  • Adobe XD
  • Adobe Photoshop
  • Adobe Illustrator

Frontend

  • Angular 11
  • TypeScript
  • HTML
  • CSS

Backend

  • Node.js
  • Express.js
  • REST APIs

Database

  • MongoDB

Architecture

  • Microservices
  • Role-Based Access Control (RBAC)
  • Multi-company architecture