...
Required Title, Total Amount, and Description of Transaction
Required Title, Total Amount, and Description of TransactionThe add transaction page contains fields for the user to enter the title, total amount, and description of the new transaction the user wants to create. These fields are required and if they are completed, PennyPincher will alert the user.
...
The details of transactions with user page gives the user of the application a detailed breakdown of each transaction he or she has with a particular user (in this case, the particular user is "bina"). The view is organized in with collapsible rows to preserve screen space especially on mobile devices. The top level collapsible is the date of the transaction. Within this collapsible holds the titles of different transactions that occurred on that date. Each transaction collapsible holds a "settle" or "dispute" button. Transactions where the user owes "bina" money are disputable and transactions where the user paid for "bina" can be settled when "bina" pays the user back. When a transaction is disputed, a flag icon appears on the transaction collapsible as well as the date collapsible as well, making it easily noticeable to the user. When all transactions of a particular date are settled, the view automatically refreshes, popping the newly settled date down into the "settled transactions" section, and the color of the top level collapsible changes to green.
The option to "dispute" or "settle" a transaction is shown as a checkbox. An alternate design that we considered was using a toggle switch. However, we decided that a checkbox would be more intuitive for a user to tell if the transaction has been disputed or settled. The flags and "settled transactions" section also helped make the status of the transaction clearer to the user.
Implementation
Important Design Decisions
...