What's the problem?
Everybody who freelances knows that the whole process can be complicated, and if you aren't the most organized person, you might lose track of things. As a part-time freelancer myself, I realized there is no one tool that will help me with all my needs. If I want to send a quote, I have to make my own template. Contracts are complicated, and I forget exactly what to include. Also, I often don't properly keep track of the hours worked. And, let's not forget how tiresome creating invoices can be.
Proto-Persona
I assumed that the proto-persona is somebody in his mid-20s who needs extra money to supplement his income. He's disorganized and does not properly keep track of all his projects, hours, invoices, etc.
Finding the person
I set out to find people who are close to my proto-persona. After many interviews, I found the right person.
Interview questions
• Are you a freelancer?
• Tell me the last time you worked on a freelance project. What was your process like?
• What’s your biggest challenge with keeping track of time worked on a project?
• How are you currently dealing with this challenge?
• How are you going about solving this challenge?
• How long does your current solution take you?
• Is there some other solution you’ve tried in the past that was better or worse?
• Tell me the last time you worked on a freelance project. What was your process like?
• What’s your biggest challenge with keeping track of time worked on a project?
• How are you currently dealing with this challenge?
• How are you going about solving this challenge?
• How long does your current solution take you?
• Is there some other solution you’ve tried in the past that was better or worse?
Interview highlights
“I just kinda write how much they owe me in an email. I don’t ever really officially invoice.”
-male, 28
“I have a document in Google Sheets where I write all the hours I’ve worked.”
-woman, 24
“I wish there was a better way to keep track [of hours worked]. I wish I could keep track of my time in some sort of software, and that the software would automatically bill the client.”
-male, 28
Persona
The persona who emerged is somebody who is disorganized, newly graduated from college, and doesn't have much real-life work experience. This persona also does not know his self-worth and how to correctly estimate hours.
Re-evaluation
After re-evaluating my persona, I realized that the persona was good, but the interview questions were too narrow. I re-interviewed my persona and noticed that the pain points are not only with tracking time, but the whole process overall. The persona has no real process at all. Every step is a struggle.
When researching products (competitive canvas) that would solve this issue, I realized that there is no streamlined process for a freelancer, and they have to use multiple products to get by.
Freelance Process – identifying pain points and features
Freelancing follows a very predictable path, and based on the user flow, we can identify main pain points and features.
• Project/Job Quote - Quote Builder
• Contract - Contract Templates/Upload your contract
• Time tracking
• Versioning
• Deliverables
• Invoicing - Invoice builder
• Payments - Collecting payments
• Contract - Contract Templates/Upload your contract
• Time tracking
• Versioning
• Deliverables
• Invoicing - Invoice builder
• Payments - Collecting payments
But not everything will be going in to the MVP.
Due to time constraints, some features will have to be simplified. Features that will get a more 'basic' treatment are: Contract templates, Versioning, and Collecting payments.
Sketches
I presented the sketches to 'users' without explaining what each element is, except for what their task is. Through the process, the users spoke out their thoughts, what they saw, and what they would do next.
Lessons learned:
The users didn't know whether they had to click through the navigation or follow the linear model. They also didn’t understand the ‘mark step complete’ button. They assumed that they had to confirm everything on their own, and that things would not be automated. Someone suggested renaming the button to ‘next step.' When uploading files, they wished they had the option to give it a version. They did not fully understand that they could download things that they uploaded. This will need to be indicated more clearly.
Wireframing, Prototyping & Tasks
Wireframing was done in Sketch. As such, I was able to sync Sketch and InVision with Dropbox, and prototype at the same time as I was developing different screens.
Tasks
Users were presented with either a specific task for a specific function, or a general task.
You are a freelancer. You just got a new project from a client named Metrix. They want you to design a logo and a website. It is due on April 17, 2016. You are told about a new web application that helps you streamline the freelance process (from issuing a quote to invoicing and receiving payment). Show me the process of how you would create a new project for the specific client, and how you would finish each step until you receive payment.
Lessons learned:
Users were able to navigate the application without guidance, however, they did have a few comments or complaints. Some of the bigger ones were:
• When faced with a quote, some would prefer to have the ability to add text to the email message and not have it embedded within the invoice. They later said they would prefer to be able to
write a message with each email that is sent.
• Some users struggled with card interactions. Because clicking on a dashboard card earlier in the process would take them to a project, they expected it to do the same later on. The solution was to make the first interaction consistent with the rest of them.
• Some wanted to include text at the end of an invoice instructing by when the invoice needed to be paid.
• All users were confused when marking project as ‘paid’ because it would kick them directly to the dashboard.
• Some users wanted the ability to filter projects on the dashboard.
Colors & Preference Test
You will notice that most of the website prior to this section is in alizarin color. There was no particular reason as to why that color was chosen, other than I thought it stood out. I started designing the dashboard, and when I showed it to users, most of them said that it was too aggressive. I tried using the color less, but as soon as I did that, the usability suffered. This was the design:
Preference Test:
Based on polling, I got feedback that users might want a blue version. I ordered a preference test from UsabilityHub with the following questions: "Which design do you prefer?" They were given two choices; red or blue. The positioning of the designs was random. 136 people answered the question.
Results:
Style Sheet
Animations
Animations were only used when they served a specific purpose.
Indicating change and where the change is:
Indicating new options:
Shortening perception of time:
User Testing
User testing was done in person and via UserTesting.com. The tasks were the same as with wireframes, but the users were different. Right away, there was an issue with the prototype on UserTesting.com as the resolution of the prototype was too large (1440x1024) and some users weren't able to complete the tasks. For this reason, two versions (sizes) of the prototype were created.
Lessons learned:
Users were able to grasp the flow of the application very quickly. Some users also had great advice and suggestions: Add better organization of projects and clients (folders), add more filters (sorting), add hours worked manually, additional payment options (multiple PayPal accounts).
