fragginwagon
c728016dec
Includes MFA-capable authentication, session and CSRF security, password recovery, listing lifecycle and ownership rules, inventory image metadata, local ImageStorage, migrations, tests, and implementation status documentation. Verification: npm test (62 passing) and integration suite (14 passing).
79 lines
1.8 KiB
Markdown
79 lines
1.8 KiB
Markdown
# UX Requirements
|
|
|
|
## Design direction
|
|
|
|
Clean, minimal, catalog-focused, and responsive.
|
|
|
|
The homepage is intentionally search-first and visually similar in simplicity to a search engine landing page.
|
|
|
|
## Public information hierarchy
|
|
|
|
For cards:
|
|
1. Primary image
|
|
2. Product/item name
|
|
3. Market value
|
|
4. Asking price
|
|
|
|
The asking price is the primary seller decision value; market value provides context.
|
|
|
|
## Product grouping
|
|
|
|
Multiple physical copies of one Product are grouped together.
|
|
|
|
Example:
|
|
|
|
```text
|
|
Charizard ex #199/165
|
|
Near Mint $115 asking $120 market
|
|
Lightly Played $95 asking $90 market
|
|
+ 1 More Available
|
|
```
|
|
|
|
Copies are sorted by condition quality, best first.
|
|
|
|
Selecting the group can reveal all copies.
|
|
|
|
Do not create separate Product groups solely because condition differs.
|
|
|
|
## Inventory management
|
|
|
|
Admin uses search plus filters and saved views.
|
|
|
|
Recommended saved views:
|
|
- Needs Attention
|
|
- Recently Added
|
|
- High Value
|
|
- Sold This Month
|
|
|
|
Bulk selection should be available where safe.
|
|
|
|
## Guided creation
|
|
|
|
`Find/Create Product → Link Market Sources → Inventory Details → Images → Pricing → Review → List`
|
|
|
|
The workflow should make it clear whether the user is editing the Product or the physical Inventory Item.
|
|
|
|
## Locked states
|
|
|
|
Pending and Sold items are visibly locked against ordinary edits. Controlled actions such as correcting a sale remain available through explicit workflows.
|
|
|
|
## Public sold items
|
|
|
|
Sold items show Sold status and no asking price.
|
|
|
|
## Responsive behavior
|
|
|
|
Support desktop, tablet, and mobile. Layouts should adapt rather than simply shrink desktop controls.
|
|
|
|
## Feedback
|
|
|
|
Dynamic actions must provide accessible status feedback, including:
|
|
- loading
|
|
- success
|
|
- validation error
|
|
- provider failure
|
|
- image processing
|
|
- background job progress
|
|
|
|
Avoid relying on color alone.
|