As the founding product designer, I built Franklin (web3 payroll suite) from the ground up.The concept of Franklin is simple at first glance - to increase web3 adoption by injecting crypto right into people’s paychecks. This was an exciting challenge to figure out how to explain this to the customer and solving this challenge required lots of user interviews, testing and internal stakeholder alignment in order to understand how everything works.
Outcome: Due to the success of the closed beta testing, Franklin was able to secure more investors and closed with 2.9 million seed round.
Time Frame
2022 (3 months end to end)
Role
Founding Product Designer
Platform
Desktop App
Category
B2B, Web3
Easily onboard and manage employees and contractors through a simple process flow.
Onboarding
Pay your employees outside of your typical payroll schedule by making an off-cycle payment.
Off-cycle payroll
Select existing employees and make anyone an administrator with a few clicks.
Make anyone an admin
Toggle between Admin & Personal payroll tabs by easily re-connecting your wallet.
Connect your wallet
How might we revolutionize the US payroll industry with blockchain technology?
Business Goals
01/ Streamline the Payroll Process
To simplify the complex process of handling native payroll.
“How might we make this platform easy to understand for users to run payroll?”
02/ Demystify Native Payroll
Offer accessible & educational tools to help the users navigate this platform.
“How might we showcase tips and tricks from onboarding to the actual interface?”
03/ Start Slow & Grow
Establish a new design system so that Franklin will have a cohesive product as it expands in the future.
“How might we hone in the designs so that any additional product launches will be unified?”
Payroll IA
Admin Set Up IA
This is the flow for the payroll tab. Prior to starting design, it was essential to map out the entire user journey to catch any inconsistencies and potential pitfalls in the system.
This is the flow for the admin side of the portal and we wanted to establish this user journey as the first step of building out the product because the user starts with the admin portal.
Iterations
The initial approach was to put everything up that we need to on the screen (must haves vs. nice to haves) and while it was overwhelming, I found it easier to remove content than to add it back. We did rounds of testing to see how users interacted with the preliminary information presented to them.
❌ Users would like ways to filter
❌ Collapsable Navigation
❌ Modal is not the best usage here
✔️ Better layout and visuals
✔️ Tree Navigation, more visuals
✔️ Improvement on previous iterations
For the initial rounds of user testing, it was important for us to get feedback as early as possible. We utilized Maze to conduct usability testing for the admin onboarding session.
Ideally, it would be better to speak with users and monitor their testing live through video, but due to timeline constraints, Maze was the logical choice in order to get timely feedback.
Final designs leveraged Tailwind components for quicker implementation.
User Testing
Is it Accessible?
One of the main challenges for UI is working with the existing color palette. The vibrant tones were hard to incorporate while passing accessibility and below are failed examples in terms of accessibility.
What users said:
❌ ”Seems more like a gaming platform or something "funky" to me vs. a payroll application.
❌ “Feels too grey. Makes me want to do payroll even less.”
✔️ ”Dark is great, but since everything is orange, it's hard to pick out the attention pieces.”
Looking Ahead
Franklin 2.0 - Taking the feedback received during beta testing, we are working to continuously improve the onboarding experience to reduce user churn rates and and increase product adoption.