Freelancing for everyone
Hectic helps contractors manage all aspects of their freelance business so their lives can be less "hectic." The management software gives freelancers control over their business through project management tools, time-tracking, invoicing, and other financial tools.
The Scope
WHO: Hectic design team: Dano & Felice + Vika S. & Kylene K.
WHAT: Explore how the Hectic mobile app Homebase should function based on user research.
WHEN: 3 week sprint, February 2021
ROLE: C&C Research, UX/UI Design
TOOLS: Figma, Zoom & Google Meet, Google Sheets
The Challenge
We needed to go beyond simply converting the existing Hectic web app into a mobile interface. To consider how people actually use their phones for work and what features and capabilities would be beneficial on the go.
The research revealed that users needed:
A high-level view of notifications, to-dos, and their schedule
To add notes and to-dos before they forgot
To track time easily anywhere
Reassessing the Structure
In the web app, the user must set up a client, project, and deliverable before creating a task. We wanted to give users an option to quickly add new notes and tasks right away and link them to a client or project at any stage.
Current Structure
Current structure only allows tasks to be added from the top-down. Users can assign a due date, status, and person to a deliverable only after creating a client and project. Notes and to-dos exist outside of clients, projects, deliverables, and tasks and can’t be linked to them.
Ideal Structure
The new structure allows a due date, time frame, status, and person to be added to any task or project whenever. Notes can now be tied to projects and clients at any time or turned into tasks. We also removed Deliverables and To-dos from the organizational structure. These terms weren’t universally understood and are often used interchangeably with tasks.
The Process
We approached this challenge with a fairly cyclical process by conducting C&C, collaborative sketching (primarily high-fidelity), and presenting to each other and the Hectic design team throughout.
I worked closely with Vika in Google Meet and Figma to sketch screens and talk through designs. We presented our progress to the team for feedback and some on-the-spot ideation in Figma.
We pulled inspiration from a wide range of sources, but some of the most useful were To-doist and Evernote. I found a lot of value in how Todoist’s Today and Upcoming screens used due dates to organize tasks and direct user focus. Evernote’s universal add served as a starting point for our exploration.
The Evolution
Research showed freelancers want to check what’s on their plate for today quickly, add notes & tasks on-the-go and view the latest updates on mobile, so we started by combining tasks & to-do’s and putting them all on the same card on the Homebase.
Our next step was to try and translate the current web Homebase to the mobile experience. That looked pretty good but didn’t give users the experience they’ve been looking for in the mobile app.
Then we revisited the Hectic web app and repurposed the productivity widget that combined notifications, to-dos, and notes for the mobile app. The widget centralized those functions but still separated them from a freelancer’s other tasks.
Next, we landed a screen focusing on a high-level view of how many things they have due today, the latest notifications, and the productivity widget with Notes & To-dos. This screen gave better visibility, but everything reminded in silos.
We explored what Homebase would look like if we simplified the structure to remove deliverables and combine to-dos and tasks. We knew we were on the right track, but this concept limited the usability by only showing today’s tasks.
We wanted to restore the web apps due today, this week, and next week kanban to Homebase. With these new tabs, the user can see when tasks are due and create a daily schedule by assigning timeframes.
Personal Takeaway
It’s easy to assume people working on the same project or client understand all of the rationale and research you’re referencing. Still, you have to set-up every concept with research and the assumptions you’re working off of and not just overwhelm them with a parade of UI adjustments without context.
Universal Add & Next Steps
Universal Add
After exploring a few different solutions, a rotary dial idea drove me to drink. We landed on three contextual buttons for the universal add. Add Task and Note would show on every screen since the research indicated those functions were the most useful. The third button would change based on the screen; for example, it would change to add a client on the client list page. See the universal add button in action here.
Next Steps
Test the usability and learnability of adding and assigning tasks and notes throughout the app.
Explore adding Work-Life Balance features such as, pausing notifications and setting healthy reminders.
Add easy access to Hectics existing educational podcast and blog on mobile app.
