Some ideas to improve the UX and consistency of the app

[cassiogomes00]

Introduction

First of all, this issue doesn't necessarily contain requests, but ideas and suggestions that I personally believe will improve the UX of the app.

I have no knowledge in programming GTK interfaces, so, at least for now, I can't provide mockups to demonstrate the things I'm going to mention here (sorry).

Sidebar

• Option to clear all filters (including search maybe?).

Calendar

• Collapsed by default at the top, allowing you to easily expand and change the month (layout similar to ◀ March 2023 ▶ ▼);
• By default it filters transactions by the selected month (the current month by default), with options to:
  • filter by day, selecting it in the expanded calendar;
  • select all months, disabling the filter in practice, located below the expanded calendar; or
  • create custom range, as it already exists, located below the expanded calendar as well.

Overview

• It presents the overview of the selected period (day, month, customized or total);
• By default, having no option (income or expense) selected disables the filter (same result as having all options selected).

Groups

• It presents the values of the selected period (day, month, custom or total);
• By default, having no groups selected disables the filter (same result as having all groups selected);
• Groups can have a daily, monthly or annual goal, which would be converted to daily to allow it to be calculated even with a customized range of dates. Its completion would be shown in the background of the group, turning the list of groups into a horizontal column chart;
• Each group would have a related color, which would manifest itself in its radio button, in its completion and in its transactions.

Transactions list

• It would have an option to force the display in a list, with fixed width if the window size is larger and adaptable if it is smaller, maintaining a maximum value regardless of the size of its content (in a similar way to Gnome Settings);
• The list is presented as groups of items (similar to the lists in the sidebar), having a title and an overview (income, expenses and total) inline:
  • With the options "Sort By Id" or "Sort By Amount" selected, there would be only one group with the title "Transactions".
  • With the "Sort By Date" option selected, each day with transactions would generate a group of items, with the day as the title.

[fsobolev]

• Option to clear all filters (including search maybe?).

Clearing filters is requiring at most 3 clicks, and there's no good place in current UI to put "clear all filters" button.

Calendar

Any changes to calendar will require to write our own widget for GTK and probably for WinUI too. This is terrific amount of work, and thus should be avoided as much as possible.

By default it filters transactions by the selected month (the current month by default)

It means that on 1st day of a month a user will see no transactions. While some can find it logical, for a lot of users it will be unproductive. Showing all transactions is the most sane default that doesn't force any specific workflow on users.
Since Gtk.Calendar doesn't allow selecting multiple days, I don't see a better way to filter transactions by month other than we have with a "Select range" option.

It presents the overview of the selected period (day, month, customized or total);

What would be nice is if overview (and maybe groups too) would show numbers for filtered transactions. I think this can be considered, it doesn't add any complexity for users to work with, but we need to decide how the app should treat future transactions in this case. @nlogozzo

Groups can have a daily, monthly or annual goal, which would be converted to daily to allow it to be calculated even with a customized range of dates. Its completion would be shown in the background of the group, turning the list of groups into a horizontal column chart;

While implementation details should be considered, overall I think this is actually a very good feature. Feel free to open a separate issue for it, or I will do it myself when I will find time to work on mockups for it.

Each group would have a related color, which would manifest itself in its radio button, in its completion and in its transactions.

#339

It would have an option to force the display in a list, with fixed width if the window size is larger and adaptable if it is smaller, maintaining a maximum value regardless of the size of its content (in a similar way to Gnome Settings);

And what's the point of this?

With the "Sort By Date" option selected, each day with transactions would generate a group of items, with the day as the title.

That's the only reason while we would need to display transactions in a list because we can't use separate Gtk.FlowBox for each group and we can't tell a flowbox to keep homogeneous width only for selected children. But I don't think we need this feature at all because it will require to rework transactions rows moving and anyway each transaction already have its date in subtitle. Too much work for nothing.

[nlogozzo]

What would be nice is if overview (and maybe groups too) would show numbers for filtered transactions. I think this can be considered, it doesn't add any complexity for users to work with, but we need to decide how the app should treat future transactions in this case. @nlogozzo

#366

[rhilliges]

Hello,

I just started using Denaro and I really like it. Great job on the design and usability! Thank you for all the hard work, you guys are putting into it!

I have a few points, that I'd like to add to this discussion.

"Use group color" by default

When I assign a group to a transaction, I would like the color of the transaction to change to the "Use group color" setting by default.
Maybe its just me, but it would actually save me a lot of clicks, whenever I import new transactions and start assigning groups.

Toggle selection of all groups

Turn the "Reset Groups Filter" into a toggle button that enables/disables all groups. This way I need at most 3 clicks, if I want to see the transactions of one specific group. Right now, I have to disable all other groups one by one.

Edit more than one transaction

I would like to edit the group setting of several transactions. That would enable me to have a workflow like this:

1. Import new transactions
2. Search for e.g. "Costco" or "Aldi"
3. Assign group e.g. "Groceries" to all shown transactions

Alternatively, being able to select and then edit more than one transaction would solve the problem too. That would probably end up in a selection mode for the transactions list.

Remove a transaction from the list if the filter does not apply anymore

Right now, when I try to assign a group to a transaction, that group gets added to my filter. I would prefer it the way around, so the transaction disappears from the list and the filter remains unchanged.

Again, great job on the app! I really like it and I will definitely continue using it.

[fsobolev]

Right now, when I try to assign a group to a transaction, that group gets added to my filter.

I just tested this and there's actually a bug: a group gets activated in the filter list, but transactions of that group don't show up.
But I disagree that a group shouldn't get activated in this case. It may be unexpected to add a transaction and don't see it immediately, it means the user needs to remember that the group they added a transaction to was unfiltered. I think activating a group to show required transaction is less confusing.

[rhilliges]

Maybe let me explain how this would improve my workflow:
When I start the app I usually import new transactions into my account. Then I only select the "Ungrouped" group and assign groups to my new transactions. My "Ungrouped" transactions are kind of a todo list for me, that I would like to be empty, once I've assigned a group to every transaction.

[fsobolev]

Okay, I see the point, it makes sense.
Then I guess the best solution will be to show a toast notification when a transaction was added to a hidden group. This will not break your workflow but also will not led to confusion.

[rhilliges]

I just stumbled over another usability thing.

Clicking on a group row element should activate/deactivate the group

I keep on opening the group dialog by accident when I click on the row. Would it make sense to change that, so the group gets activated/deactivated instead, and the edit dialog only opens by clicking the edit icon?