Payroll & Benefit
Desktop web | Back-office platform (B2B)
Product Designer Lead
UXD, UXR & Facilitation
I worked in leading the design team. I also learned and applied the company’s business needs. Led the end-to-end Product Design process: co-creation with stakeholders, workshop facilitation, UX research, problem mapping, insights and ideation, wireframes, prototyping, user testings, and metrics monitoring.
Context
SmartMEi
A startup founded in 2016, which helps contractors MEI (individual micro-entrepreneur) manage their company: accounting and finance.
Some relevant topics
• Has experience and technological structure to make bulk payments (in the thousands)
• More than 365,000 contractor MEIs were paid by SmartMEi
• Made more than 3.3 million payments in more than 4,700 municipalities across Brazil
• The main customer is Rappi, working for all their contractors, motorcycle couriers, and bikers from all over the country
Scenario
Before my arrival, SmartMEi mapped the needs of SMBs (small and medium-sized businesses) and realized that it could offer its services to them, because:
• SMBs usually hire contractors
• The financial and administrative departments have challenges when issuing payments to contractors for services rendered
• Investment and energy are focused on the company's main activities and not on the administrative or financial department’s needs
• An emergence of new businesses (SMBs) with up to 50 employees
• There is a growing movement of hiring contractors in Brazil
SMBs (small and medium-sized businesses)
• Companies with up to 50 employees
• They are producers, design studios, advertising agencies, software houses, consultants, startups, etc.
Contractors (MEI, ME, and EIRELI)
• Contractors have no partners or employees, provide services for one or more companies
• There may be a formal link between the company and the employee, or even a one-off service provision (freelancer)
Conclusion
Given SmartMEi's eagerness to expand, which serves MEI, the partners realized that there was value and the potential for business growth serving contractors with companies classified as ME (Micro company) and EIRELI (Individual Limited Liability Company).
My Challenge as a Product Designer
Designing WORK’s digital products (the new company that was founded by SmartMEi).
Goal
Un-bureaucratize the working relationship between contractors and companies that hire them.
Solution
We designed some digital products for WORK, and I would like to tell this story chapter by chapter.
1. Back-office web platform for SMBs
The company makes payroll, adds contractors, sets up benefits, and controls bills for service provisions.
2. APP for contractors
Where the contractor receives salary payments, sends invoices, controls their personal company's taxes, and signs benefits.
3. Accounting web platform
Where the accountant manages the contractors’ accounting.
Payroll and benefits platform
For this use case, I will show you how we designed the back-office platform for SMBs.
Proto-Persona
The financial sector is composed of senior financial leadership and at least one analyst.
• The analyst does payroll setup.
• The senior financial lead approves this setting before making the payment.
Problems | Insights
Prioritization is decided by the designer and the Head of Products | CEO in the weekly product meeting.
The SMBs problems highlighted below in bold are the ones prioritized, as it impacts the business and the user the most:
SMB
Companies
Financial
• Lack of operational structure in the financial sector
• Mistakes made in the payment amount
• Random errors in the contractor's bank information
• The high amount of bank transfer fees
• Lack of experience with bulk payments
• Help with problem-solving assistance
• Less investment in the financial sector
• View the total amount of money between different bank accounts
Bureaucracy
• Lack of organization of the contractor's documents
• Lack of contractor information integration
• Need for invoice to justify salary payment
• Waste of time resolving bureaucracy
• Difficulty in communicating with the worker
• Different rules for contractor types: RPA, MEI, ME, EIRELI and CLT
• Risk of labor lawsuit due to non-employment
Benefits
• Lack of a bond with the contractor
• Not offering the same CLT benefit condition to the contractor
• Contractors’ non-retention due to not offering better conditions
Goal | Keep in mind
Un-bureaucratize the working relationship between contractors and companies that hire them.
Mapping
By mapping the relationship between the SMB company and the contractor, we understand where WORK stands.
• SMBs' back-office platform: register the contractor, manage the invoice, configure salary payment, and offer benefits
• Contractor's APP: approve the SMB as a paying company, send the invoice, receive payment, sign benefits
Method | Co-creation
Use of co-creation methodology to:
• Understand how to get quick feedback
• Stay on the same page as the stakeholders
• Implement other ways to approach problem-solving
• Work collaboratively and encourage others to have a sense of ownership
• Develop the most complete product possible
Service Map Flow
Mapping of the payment service between SMB platform, APP Work, and contractor.
Wireframes
The draft (paperless and wireframe) is key for a better understanding of the scenario, flow, and screen content structure.
I interviewed the Head of Products a few times. From our conversations, I got a better understanding of the company’s business needs.
They were subjective and complex talks, and the feedback I got was essential for making improvements.
SMBs' back-office platform
• Low fidelity wireframe: sketches on paper and using Balsamiq APP
• Medium-fidelity wireframe in Figma:
Designers & Engineers
When the user scenarios were completed, the Head of Products held a meeting with the engineers to show the design and to align rules for the development. After that, I had a clear understanding of what the MVP would be.
Prototype
The prototype helped the designers to better understand whether or not the navigation and interaction worked well.
SMBs' medium-fidelity back-office platform designed in Figma's Prototype:
Goal | Keep in mind
Un-bureaucratize the working relationship between contractors and companies that hire them.
UI Design
High fidelity screens
Problem
Lack of contractor information integration
Assumption / Possible solution
Centralize contractor information
A tool that registers the contractors, receives the inputted data from an external CSV file, and integrates contractor information
Problem
Lack of experience with bulk payments
Assumption / Possible solution
Make it easy to set up bulk payments
Configure the bulk payments in steps with instructions, labels, and status
Problem
Need for invoice to justify payment
Assumption / Possible solution
Ask, receive and approve the contractor’s invoice
In the invoice section, it's possible to set the contractor's invoice information, before payment
Problem
Lack of a bond with the contractor
Assumption / Possible solution
Offering some working benefits to contractors, setting the amount and other conditions
User Map Flow
• Documentation for stakeholders with the UI screens
• Navigable flows separated by sections
• User maps scenarios: normal, success, cancellation, and error
• Notes to developers with business and product rules
Back-office web platform for SMBs in Overflow with all flows:
