This content originally appeared on Jonnie Hallman (@destroytoday) and was authored by Jonnie Hallman (@destroytoday)
When I’m at a point with Cushion where I need to move onto the next big part of a task, I have a tendency of finding smaller tasks to tackle first while side-eyeing the bigger task, like Pee Wee and the snakes. It’s not that I don’t want to move onto the next big task, but rather that once I start, I know I’ll need to see it through. This means working on a single task across several days, if not weeks. Since I only work on Cushion mornings, nights, and weekends, I only have an hour here and an hour there, which is also highly dependent on my energy level—if I’m fried from work, forget about it. This sporadic schedule makes me over-appreciate the small tasks I can accomplish a single sitting while avoiding the big tasks that span multiple sittings.
Now, as for this next big task I’m referencing, it’s creating clients, contacts, and projects inline within the invoice form. This is an essential UX for folks who go to create an invoice, then realize they need to tie a client and/or project to the invoice. The last roadblock I want is for someone to set out to do something, then need to back out and do something else before they can continue. This feature does already exist in the current invoice form, but because I’m rebuilding everything in the new system, I’ll need to build it from scratch. While I’m at it, I’m also rethinking my approach, since I want everything new to be mobile-friendly from the start.
Focusing on the client field, the current invoice form has a “New…” option in the select dropdown, which opens a modal to create the client. Because this modal can hover over everything, I’m able to use this throughout the rest of the app whenever I want to create a client inline, like when creating a project or scheduling a workload. While this approach has worked for many years, I have a few criticisms:
As a centered window, it’s not mobile-friendly, unless I span full-window on mobile.
It’s not easily scrollable if the window height is shorter than its content, unless I span full-height at short breakpoints.
Because I use a tabbed system to organize its content, the window needs to be roughly the same height across tabs.
Also with the tabbed system, the majority of fields are hidden behind tabs, so it’s not easy to discover them.
If the user wants to create another inline item from this modal, it completely overlays the previous one, removing any sense of depth.
And the list goes on. With the new system, I want to tackle all of these issues, which is why this is a much bigger task than simply implementing inline forms. The approach I’m leaning towards takes some inspiration from my CMS, Contentful.
When clicking into a reference of an entry, a new editor will appear pinned from the right, stacked on top of the previous editor, but still revealing it on the left to show depth. Aside from my reservations about the performance of their transition, I do think this “sidebar” technique might work for Cushion, too—especially since the deepest anyone could go is maybe two layers. Also, Cushion’s sidebar will be much more narrow, so you’d still see the invoice in the background.
While I am excited about this UX, it essentially means I need to now build the client form, contacts form, and project form, all while I’m just trying to build an invoice form. That said, building these now means I don’t need to build them later because I’ll definitely be able to reuse them wherever else I need inline creation. Also, based on how I’m able to reflow the forms down to mobile, now I’m thinking I could actually use these inline forms as the actual forms for creating clients, projects, etc—I simply need to go full-width with them.
Considering all this new work, I find it funny that I picked the invoice form because I thought it was the most standalone of anything I could rebuild. While that still holds true, to a certain extent, rebuilding any page of the app will require a ton of work. I’m still up for it and determined, but phew, I’m just glad I didn’t give myself a hard deadline. I essentially told myself, “I’ll be happy if I finish the invoice form this year.” I’m way ahead of schedule, but still sticking with that expectation. If I finish beforehand, even better, but high expectations and side projects really shouldn’t mix. Side projects should be an escape from the sore spots of the job.
This content originally appeared on Jonnie Hallman (@destroytoday) and was authored by Jonnie Hallman (@destroytoday)
Jonnie Hallman (@destroytoday) | Sciencx (2021-04-03T12:50:00+00:00) Inline forms and the weight of the next big task. Retrieved from https://www.scien.cx/2021/04/03/inline-forms-and-the-weight-of-the-next-big-task-2/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.