UI: Wireframe initial state of "All Expenses List"

[aflashyrhetoric]

Description

We will build the UI component-by-component instead of trying to prototype the whole thing at once. This is the first component.

Please design a wireframe for the initial state of the All Expenses List, which will be shown on the payup.com/dashboard URL. This component will be shown when a brand new user has signed up and loads their dashboard for the first time (ever).

To clarify, this is not the full dashboard page's UI, JUST the "main expenses list" area of the /dashboard/ page.

For now, DO NOT DESIGN (please use empty blank space) the following components:

• Navigation Bar
• Footer
• Any sort of "tabs" for month to month browsing, category browsing, things like that

Parameters for the design

This portion of the UI:

• should be a relatively simple "list" area that shows up to X number of expenses
• should already have 2 "filler" expenses (fake expenses that we preload into their account so they can play around with it, for demo purposes)

Edge cases to think about

• No expenses
• 10 expenses
• 1000 expenses (pagination)

Expense Model

For reference, the Expense model consist of the following fields:

Value Name	Example Value
Date	10/4/18
Amount (in USD)	$14.00
Description	Windshield wipers
A list of beneficiaries	Bill,Rachel,Rebecca
Purchaser Name	Kevin

Assumptions

You can assume (for now) that the user:

• will not need to sort their expenses (by time, amount, etc)
• will not need to filter their expense (by category)
• will not need to batch edit anything

Please let me know if you have further questions :smile_cat: