User Interface Mobile - Team-LANS/lepta GitHub Wiki

Here design proposals for several screens of the lepta web application for mobile are provided. Navigation in the mobile variant works mostly over to burger menu on the top right. Various context dependent controls are located on the top right.

Home

The view that is visible immediately after logging in. Here the user sees various important information. This screen mostly covers the use case Overview

New Bills

This view shows bills that have not been assigned yet are shown. One is able to further interact with the list with the ellipsis button on the top right. It is possible to add new bills with the plus button on the top right.


Create new

This view enables the user to add a new bill manually. The name and date for the bill can be entered via the two topmost controls. New items can be added by tapping a add item button that adds a item with text fields for name of the item and price.
Using the two controls on the top right the bill can either be saved or editing can be canceled. Using the arrow button one can navigate to the previous view.


Bill detail

In this view, one can inspect a single bill. One can navigate to the next bill by swiping left or right. Using the menu on the top right, one can interact with the bill (e.g. enter edit mode, delete). Using the dollar button, on can start assigning the bill.


Share bill

In this view, one can, similar to the detail view, inspect a bill. Furthermore, the user can assign bill items to the other user/the shared account by clicking the button on right of each item. The user can cancel the assignment or confirm it by clicking one of the buttons on the top right.


Clear debt

This view is different for each user, depending on who initialized the clear debt action. In each case, the user is presented with the current balance and a button to display details for the settlement. The display details button is similar to the share bill view, except that assignment is not possible but bills from both users are shown.
Depending on the state, users can confirm the settlement, or cancel it using buttons on the top right.

 
 

Options

This view enables the user to review or change his/her account data.