Yvonne Weng UX CASE STUDY

Size: px
Start display at page:

Download "Yvonne Weng UX CASE STUDY"

Transcription

1 Yvonne Weng UX CASE STUDY yvonneweng.com (443)

2 DailyPay Fintech startup providing the ability for employees to control when they get paid.

3 PROJECT GOAL Redesign the sign up funnel for the employee and the business user to simplify a complex process into a smooth and easy experience. CHALLENGES Understand the DailyPay business model and how it is different than a payday advance system. Consider the different user types and scenarios to create a sign up process that meets all their needs. Alleviate user hesitations with sharing financial information during the signup process. Properly set user expectations for an onboarding process that involves manual review. MY ROLE Led client workshops and presentations Created UX deliverables such as user flows and wireframes Guided the visual designer on the UI and style guide Documented functional specs for developer handoff

4 HOW IT WORKS Employees can join to get paid daily for the wages they ve earned. No more waiting for biweekly paychecks - employees can meet their financial goals and pay bills on time. Employers (businesses) can join to offer daily payments to employees as a company benefit. Works with existing payroll systems and increases employee retention.

5 Goals for Redesign Educate users and manage expectations Reduce hesitation about giving sensitive information (bank accounts) Accommodate multiple sessions Make it easy and friendly for non-tech User Recap savvy users KICK OFF & INTAKE WORKSHOP 1. Clients Reduce customer service inquiries Drivers Restaurant Owners Contractor, W-2 Salary & Hourly Employees The DailyPay business model was something that our team struggled to understand at first. Questions 2. Business (Enterprise) What actions trigger businesses to sign up via this flow? (on-site and off-site) DAILYPAY PHASE 2 What manual/offline processes are 7 involved during the sign up? I led a workshop with stakeholders from every department on the client team to properly define the project requirements and objectives. What kind of hesitations would business users have during sign up process? DAILYPAY PHASE 2 What are the next steps after this flow? (for DailyPay and for user) DAILYPAY PHASE 2 3 The workshop involved a thorough discussion (guided by a slide deck) and an interactive sketch session. 11 This is me!

6 CLIENT Wireflows V2 General note: When a user tries to leave the page at any step, trigger an Are you sure? message in a popup. Focusing on functionality and technical requirements Progress bar starts showing after you determine what type of user this is, since number of steps may vary. For steps with multiple pages, the progress will show in the circle. Once the step is completed, the circle will fill in. Information such as name, phone, should be auto populated based on the information that we can scrape from their provider account. Pending Application Pending Application - if errors to resolve Activation Confirmed Click Sign Up CTA on website Links to Contact form Let s Get Started Already started? Login to complete your application. I am an individual who works for: GrubHub Instacart Other I am a restaurant who delivers on: GrubHub Seamless I am an employee of: Select Can t find your company? Other " Fasten ShipBob UCode Dropdown of other platforms Select " ABC Hardware Acme Supply Co. Barrel Dropdown of all Homebase and Enterprise companies Completes form, clicks Type of employer selected? INDIVIDUAL, single platform (Example: ) Employer Awesome! You work for. will tell us how much you work. DailyPay will pay you that money in 1-2 business days. To get started, we ll need to connect to your account. OK, let s connect! You Connect To how much you make every day from this employer. Username Password Submit Shows fields based on selected platform If valid Thanks! We ve successfully connected to your. Copy here recaps what platforms you ve inputted so far Set Up Your DailyPay Account We re going to pay you your earnings. First Name Last Name Mobile Phone Enable DailyPay to send me text message updates about my account. You will use this to log in to DailyPay. Create Password Do you have a referral code? Go back Employer Cool. Here s how you re gonna get paid. The money you get is from DailyPay, NOT your employer. DailyPay does NOT take a cut from your pay! You get paid from DailyPay every day the banks are open (typically in 1-2 business days) Click here to learn more or Watch Video Ok, got it! You How You Get Paid Select your payment setting. Automatic Recommended! DailyPay will automatically transfer money into your bank account each day. I d like to manage my payments manually. After a 2-week free trial period, each transfer less than $150 will incur a fee of $0.99. Any transfer $150 or greater will incur a fee of $1.49. You can always adjust these settings later. Save and How You Get Paid Now we ll need to connect to your bank account so that we can pay you. Input bank account or Input debit card How You Get Paid Input your bank account: Routing Number Account Number? What are these numbers? Please note that misentering your bank account information will result in a delay in payments so make sure you entered it correctly. If debit card is selected: Debit Card Number Expiration Date MM/YY Address Line 1 Address Line 2 City State Zip/Postal Please note that misentering your debit card information will result in a delay in payments so make sure you entered it correctly. Great! You re set up to get paid by DailyPay now. Employer Your employer pays DailyPay back on your normal payday. This means we will need your employer to pay DailyPay directly. We wait for payday so you don t have to! OK, that makes sense! User can t proceed until acknowledgements are checked. Link Your Employer to DailyPay Log into each of your employers and replace the routing and account numbers with the your new DailyPay account numbers. Routing: Account: Step-by-step instructions for This way your employer pays DailyPay directly on your normal payday. You won t be activated until you ve updated the payment info on your account! I acknolwedge that I updated my account with the routing and account numbers above. All set! Links to an employerspecific KB post (open in new tab) with in-depth instructions, how-to screenshots, etc. If multiple platforms, display multiple links. If multiple platforms, display multiple acknowledgements: I acknolwedge that I updated my account with the routing and account numbers above. I acknolwedge that I updated my GrubHub account with the routing and account numbers above. I acknolwedge that I updated my Instacart account with the routing and account numbers above. Some Final Things I understand that any amount I receive from DailyPay is not a loan, but an acceleration of my wages. My daily payment is an estimate of my earnings, net of taxes, withholdings, and deductions. I receive a final payment on the business day following my payday. I agree to the Terms & Conditions Confirm Thanks! Your Account is Almost Ready Application Submitted Reviewing Application We re reviewing your application, and if everything checks out you should be activated by tomorrow (or next business day). You ll get an once it s ready. You can also log back in to check on your status. Activated and Ready to Get Paid! Got another employer to add? Add Another Platform Want to review your payment settings, account information, and more? Messaging here will vary based on platform selected Secondary CTAs for other actions the user can take while they wait Thanks! Your Account is Almost Ready You bank account information is incorrect. Please update it so we can get you your daily paycheck! Fix it Application Submitted Reviewing Application We re reviewing your application, and if everything checks out you should be activated by tomorrow (or next business day). You ll get an once it s ready. You can also log back in to check on your status. Activated and Ready to Get Paid! Woo Hoo! You re and Running! Look out for your first paymen Go to My Home Refer a Driver for $20 Share DailyPay with other individuals, give them two weeks free and you get $20 for each person who signs up. Please review our Referral Policy All set! Go to Account Settings Got another employer to add? Already started, logs in Awesome! You work for, Instacart, and ShipBob Connect Your Accounts Connect To Connect Your Accounts Connect Your Accounts If you click on Click here to learn more, a modal will appear with text explanation If you click on Watch Video, a modal will appear with YouTube video Add Another Platform Want to review your payment settings, account information, and more? Go to Account Settings Log in Address Password INDIVIDUAL, multiple platforms Employers Your employers will tell us how much you work. DailyPay will pay you that money in 1-2 business days. To get started, we ll need to connect to each of your accounts. OK, let s connect! You how much you make every day from each employer. Instacart ShipBob Connect Connect Connect how much you make every day from this employer. Username Password Submit Shows fields based on selected platform If valid how much you make every day from each employer. Instacart ShipBob Skip and Do This Later Connected Connect Connect Repeat for each platform how much you make every day from each employer. Instacart ShipBob Connected Connected Connected Cool. Here s how you re When gonna do get I get paid. paid? Your daily payment is an estimate of your earnings, net of tax deductions, insurance witholdings and other deductions. Because of this, DailyPay will pay you most (~90%) of your earned money every The day money the you banks get are is from open. DailyPay, The rest will be sent NOT to you your after employer. we know for sure what your final paycheck should have DailyPay been. does This NOT remainder take a will cut from be sent your on the business day pay! following your normal scheduled payday. You get paid from DailyPay every day the banks are Watch open Video (typically in one business day) Learn more. Cool. Here s how you re When gonna do get I get paid. paid? The money you get is from DailyPay, NOT your employer. DailyPay does NOT take a cut from your pay! Read Explanation You get paid from DailyPay every day the banks are open (typically in one business day) Learn more. Log In Forgot Password? Will users be able to skip and complete the rest later? (as long as one of them is connected) Ok, got it! Ok, got it! EMPLOYEE OF ENTERPRISE/ HOMEBASE Awesome! You work for ABC Hardware. ABC Hardware Employee Info Welcome back, [First name]! (Example company name: ABC Hardware) Employer You ABC Hardware will tell us how much you work. Employee ID You can find this ID via [description goes here about what this ID is and where to locate it.] How You Get Paid Now we ll need to connect to your bank account so that we can pay you. Latest step where user left off DailyPay will pay you that money in 1-2 business days. Input bank account Let s get started Information could potentially be auto populated based on the information that we can scrape from their Grubhub/ Seamless account. Pending Application RESTAURANT Awesome! You re a restaurant who delivers for GrubHub. Connect to GrubHub how much your restaurant makes every day from GrubHub deliveries. Set Up Your DailyPay Account Please provide your information so we can get your DailyPay account set up. First Name Restaurant Info Tell us a bit about the restaurant. Restaurant Name Thanks! We ll be reaching out. GrubHub Restaurant GrubHub will tell us how much money you ve made. GrubHub Username Last Name Restaurant Website Application Submitted DailyPay will pay you that money in 1-2 business days. To get started, we ll need to connect to your GrubHub account. GrubHub Password Mailing Address Line 1 Mailing Address Line 2 Shows fields for whatever platform was selected Mobile Phone Enable DailyPay to send me text message updates about this account. Your relation to restaurant Select We ll Call You We need a bit more information about the restaurant so we ll call you (or you if we are unable to reach you on phone). [more details about next steps and expectations] Let s get started City You will use this to log in to DailyPay. Create Password Activated and Ready to Get Paid! State Zip/Postal Do you have a referral code? Want to review or adjust your account information? Go to Account Settings Go back USER FLOWS / WIREFRAMES Armed with ideas from the workshop, we worked through multiple iterations of high fidelity user flows (or wireflows ) to explore different approaches to the sign up funnel. The platform is a responsive web app, and since the core employee user primarily uses mobile devices, we designed mobile-first.

7 A unique challenge was the different employee scenarios where requirements varied based on what platform the employee earned wages on. We architected each path to ensure that we can create a workflow and design system that serves every scenario.

8 1: Client First Screen 4: Individual 1.1 7: Individual : Individual : Screen : Screen : Screen : Screen : Screen : Screen : Screen 5.1 (Flow A) 25: Screen 6.1 (Flow A) 26: Client Pending Application Screen (Flow A & B) 27: Client Pending Application Screen Er 2: Log In Please note, the graphic would be dynamically pulling the logo from the company that the user has selected previously 28: Activation Confirmed Screen 22: Screen 4.3a (Routing & Account Info) 17: Screen 3.3 (Text Modal) Need a refresher? 19: Screen 3.4 Video Modal How DailyPay Works Get paid weeks before your regular payday! + Your company tells us how much you work. We give you our money within 1-2 days after your shift. 3: Alert Banner 5: Enterprise 1.1 8: Enterprise : Enterprise 2.2 And then we wait for payday so you don t have to! (Your company pays DailyPay on your normal payday). Input Field once file is uploaded on mobile: Input field accounting for drag and drop on desktop: Choose a file to upload. photo fdsaf42.jpg Drag and Drop your file here or Choose a file to upload. No file chosen Once file is uploaded on desktop Drag and Drop your file here or Choose a file to upload. photo fdsaf42.jpg 6: Restaurant 1.1 9: Restaurant : Restaurant : Restaurant : Restaurant Pending Application UI & STYLES Due to the detailed wireframes and accelerated project timeline, there was no need to create a full visual prototype. I worked with a visual designer to create a thorough style guide and key page mockups to demonstrate the styles. The style guide and design files were then handed off to the client s development team for implementation.

9

10 Desktop styles were also established, especially for the employer (business) user signup funnel, since those users tend to use desktop devices.

11 Thank You Yvonne Weng yvonneweng.com (443)