commit 3201707d48d2a1f08563c477be9877b3721e634b
parent 13bd1f7e850b83815d6bd5bdafc2c5a798e3c3d0
Author: Christian Grothoff <grothoff@gnunet.org>
Date: Wed, 16 Apr 2025 15:43:33 +0200
updating DD53
Diffstat:
1 file changed, 72 insertions(+), 113 deletions(-)
diff --git a/design-documents/053-wallet-ui.rst b/design-documents/053-wallet-ui.rst
@@ -130,21 +130,10 @@ Issues
* WebEx (image): Screenshot does not show any
pending transactions.
-* iOS (major): Way too much detail shown, way too
- much explanation text, too many operations
- (send money, request payment, spend test money!!!!);
- Remove text "Balance:" within each currency, this
- is all about *Balances* as per the title. Instead,
- show the balance right of the currency name.
-* iOS (major): overly complex menu with balances and
- banking; we are NOT a banking app, banking is IMO
- confusing. Settings icon could be on top left, then
- it would be more uniform, I would get rid of banking
- 'tab' entirely!
-* iOS (text): bad icon for "pending outgoing", the
- "minus" sign does not give me good associations here
-* Android (minor): No "add" and "Send $CURRENCY" buttons
- on this page.
+* WebEx (image): Would be nice to include CHF currency
+* iOS (minor): Remove text "Balance:" within each currency?
+* iOS (image): Multi-currency screenshot might be nicer
+* Android (minor): right-align balances?
@@ -200,6 +189,8 @@ Actions
* **Select item**. Clicking on the pending transaction shows goes to a dialog
with details about the transaction (and allows the user to abort it).
+ * See :ref:`cta-withdraw-pending-ref` for the most relevant withdraw-pending screen
+
Screenshots
^^^^^^^^^^^
@@ -223,6 +214,17 @@ Screenshots
cta-actions
-----------
+Actions
+^^^^^^^
+
+* **Enter URI**:
+* **Deposit**:
+* **Scan QR code**:
+* **Receive**:
+* **Withdraw**:
+* **Send**:
+
+
Screenshots
^^^^^^^^^^^
@@ -337,10 +339,7 @@ Issues
nice as iconography in on Android.
* WebEx (image): Screenshot does not show any
pending transactions.
-* Android (text): Iconography (same icon for push
- payments and debit and POS) and again same icon
- for invoice and withdraw) is sub-optimal. Should
- pick unique icons for each type of operation.
+* WebEx (image): Title is wrong (not Transactions)
* iOS (text): Iconography (+ / -) is also not
expressive and redundant with the colors.
* iOS (text): Sign of the operation (+ / -) should
@@ -369,13 +368,7 @@ Issues
"send" and "receive" buttons are missing.
* iOS (minor): has top/buttom scroll buttons not present
in other UIs (likely too much, better to have search!)
-* iOS (critical): the buttons to send/receive funds
- are not even shown in the screenshot, likely because
- of balances vs. banking distinction, which should
- also be removed.
-* All (critical): we do not seem to have
- screenshots of what happens after picking
- select funds or receive funds!
+
Adoption
@@ -411,55 +404,25 @@ with a withdrawal, they must accept the terms of service of the exchange.
Info
^^^^
-* service provider to be used showing the URL
-* amount to be withdrawn
-* applicable fees (if any)
-
+* Title: "Withdraw $CURRENCY"
* Text:
- * Use "payment service provider" to label the
- URL, not "exchange"
- * Use "Net" and "Fees" and "Gross" to label
- the amount in a section "Details"
-
-Inputs
-^^^^^^
-
-* service provider: allow the selection of different exchange (if applicable)
-
+ * "You must first accept the payment service's terms of service before you can
+ withdraw digital cash to your wallet."
Actions
^^^^^^^
-* **change service provider**: updates fees shown (after returning from exchange selection screen)
* **review and confirm ToS**: advance to the :ref:`cta-accept-tos-ref` screen
* **back**: user will be redirected to previous screen
-.. attention::
- User should be able to play with the amount, not possible in the current design
Issues
^^^^^^
-* All(critical): This is an extremely lazy screen,
- and it probably should be completely revamped.
- We should allow the user to change the exchange
- **and** to enter the amount to withdraw
- **unless** a fixed amount (or exchange) were
- given when we were triggered.
- Editing the exchange should go to another screen
- (for now, with a simple URL entry bar, in the
- future with exchange comparisson and whatever);
- the fees should already be shown on this screen
- for the selected exchange.
-* All(critical): We should probably unify this screen
- with cta-withdraw-confirm and cta-withdraw,
- with the only difference
- being that one variant has "View Terms of Service"
- while the other has a "Withdraw $AMOUNT" button.
-* iOS(image): no screenshot available
-* All(text): Use "Net" and "Fees" and "Gross" to label
- the amounts in a section "Details"
+* All(minor): Should we allow changing the
+ provider on this screen?
+* WebEx(major): not unified with other designs
Screenshots
@@ -486,16 +449,19 @@ cta-withdraw
This screen is used for the confirmation of a manual withdrawal,
bank-integrated witdrawals and exchange withdrawals. the success of this
-operation will be an increase of the balance in the wallet. fee, restrictions
+operation will be an increase of the balance in the wallet. Fee, restrictions
and ETA should be clear for the user.
+There is a related dialog where the currency can still be changed, which
+then MAY require the "confirm withdraw" button to change into one where
+ToS need to be accepted first.
+
+
Info
^^^^
-* exchange to be used showing the URL
* table of details of the operation: use the :ref:`operation-table-details-ref` screen
* starting currency: if the exchange has the currency conversion service enabled user should be able to the details based on the wire transfer currency
-* taler URI: show copy button or QR to complete the operation with another device
* service provider to be used showing the URL
* amount to be withdrawn
* applicable fees (if any)
@@ -509,8 +475,9 @@ Inputs
Actions
^^^^^^^
-* **confirm operation**: on success will be redirected to the ``transaction-details`` screen where the detail of the current transaction will be displayed
-* **cancel**: user will be redirected to ``balance``
+* **CURRENCY NUMBER** (optional): hot-buttons for quick entry of common amounts
+* **confirm withdraw**: on success will be redirected to the ``transaction-details`` screen where the detail of the current transaction will be displayed
+* **back**: user will be redirected to ``balance``
.. attention::
User should be able to play with the amount, not possible in the current design
@@ -518,10 +485,9 @@ Actions
Issues
^^^^^^
-* All(screenshots): the flow here diverges completely betwen the different platforms (very bad).
-* Android(major): there really should not be a "check fees" button here, the fees should just be dynamically calculated and shown immediately. Note that the dialog shown here is thus closer to what we might make the future main
- withdraw review (:ref:`cta-withdraw-review-ref`) dialog.
-
+* WebEx(major): the flow and dialog style here diverges too much from the other platforms (bad).
+* iOS(minor): title is less clear than "Withdraw from bank" on Android
+
Adoption
^^^^^^^^
@@ -532,14 +498,8 @@ Adoption
transaction list (:ref:`cta-transaction-list-ref`),
but without the amount entry. Keep it simple,
mostly binary choice: withdraw, invoice, or back.
-* The iOS dialog is reasonably close to the future
- withdraw review (:ref:`cta-withdraw-review-ref`) dialog,
- allowing amount entry, shows fees, and final "confirm"
- button (I guess: "review ToS" should be an alternative
- button label). Eventually, we'll want an "edit" (pen)
- icon next to the exchange URL, and
- if context has fixed the amount or exchange, the
- respective buttons should be hidden.
+* Eventually, we may want an "edit" (pen) icon next to the exchange URL, and
+ if context has fixed the amount or exchange, the respective buttons should be hidden.
Screenshots
@@ -589,13 +549,12 @@ Actions
Issues
^^^^^^
-* All(text): if there is no fee, no point in showing
+* WebEx(text): if there is no fee, no point in showing
the amount **3** times. Maybe only show the amount
on top with the wire transfer details, and then at
the bottom show the fee ONCE *if* there is one?
-* iOS(text): receiver name is missing, MUST be before IBAN
-* WebEx(screenshot): the screenshot does not show how to select an alternative bank (see: Netzbon). Would be nice to show that.
-* Android(screenshot): the screenshot does not show how to select an alternative bank (see: Netzbon). Would be nice to show that.
+* iOS(minor): fees are shown even if they are 0; hide!
+* All(image): the screenshots do not show how to select an alternative bank (see: Netzbon). Might be nice to show that.
@@ -603,7 +562,8 @@ Adoption
^^^^^^^^
* iOS(minor): the way to switch between different banks is not as clear as it was on WebEx. Proposal: use notebook tabs similar to how it is done on WebEx (IIRC?)
-* Android: transaction status is not shown ("pending" on all other platforms. This is actually *good*, as once we are no longer "pending" the wire transfer details will no longer be shown, so the entire screen will look different. So we can probably get rid of the "This transaction is not complete" and "Status: Pending" on WebEx/iOS as that is *always* the case when we give the user wire transfer instructions here!
+* Android(text): iOS has much clearer instructions (more text)
+* iOS(text): transaction status is shown as "pending", which is kind-of redundant as once we are no longer "pending" the wire transfer details will no longer be shown, so the entire screen will look different. So we can probably get rid of the "Status: Pending" on WebEx/iOS as that is *always* the case when we give the user wire transfer instructions here!
@@ -671,6 +631,8 @@ Actions
^^^^^^^
* **back**: goes back to the main wire transfer screen
+* **copy** (per QR code): copies image to the clipboard (?)
+* **share** (per QR code): opens link on local system (?)
+-----------+------------------------------------------------------------------+
@@ -712,23 +674,15 @@ Actions
Issues
^^^^^^
-* All(text): if there is no fee, no point in showing
- the amount **3** times. Maybe only show the amount
- on top with the wire transfer details, and then at
- the bottom show the fee ONCE *if* there is one?
-* iOS(text): receiver name is missing, MUST be before IBAN
-* WebEx(screenshot): the screenshot does not show how to select an alternative bank (see: Netzbon). Would be nice to show that.
-* Android(screenshot): the screenshot does not show how to select an alternative bank (see: Netzbon). Would be nice to show that.
-
-
-
-Adoption
-^^^^^^^^
-
-* iOS(minor): the way to switch between different banks is not as clear as it was on WebEx. Proposal: use notebook tabs similar to how it is done on WebEx (IIRC?)
-* Android: transaction status is not shown ("pending" on all other platforms. This is actually *good*, as once we are no longer "pending" the wire transfer details will no longer be shown, so the entire screen will look different. So we can probably get rid of the "This transaction is not complete" and "Status: Pending" on WebEx/iOS as that is *always* the case when we give the user wire transfer instructions here!
-
-
+* See :ref:`cta-wire-transfer-details`, same issues apply here.
+* Android(minor): screen might be a bit much, maybe partition like the iOS screen
+ with separate screens for details / QR codes (especially give that there will
+ be a 3rd option eventually as well!)
+* Android(text): Texts differ from iOS, iOS texts are clearer for the transaction
+ details; exchange URL is too prominent
+* iOS(text): remove text URL in section header
+* iOS(minor): remove fees if fees are zero
+
Screenshots
^^^^^^^^^^^
@@ -771,11 +725,10 @@ Actions
Issues
^^^^^^
-* WebEx(text): not point in showing details if there are no fees.
* iOS(text): not point in showing details if there are no fees.
* iOS(text): status: Done is unnecessary, if we show this screen, it will always be 'done' (ok, theoretically in the middle of withdrawing, but the wire transfer will be done; but then maybe show 'incoming' but hide the status once really "done").
-* unclear: "Delete" vs. 'Delete from history" --- two
- styles, two translations, gain?
+* Android/Webext(text): "Delete" vs. 'Delete from history" --- two
+ styles, two translations. Use "Delete from history" consistently!
Adoption
@@ -869,25 +822,26 @@ Info
* order summary
* table of details of the operation: use the :ref:`operation-table-details-ref` screen
* receipt: order id
-* payment deadline: absolute time before the claimed order expires
* taler URI: show copy button or QR to complete the operation with another device
-* cant pay desc: if the user has enough balance but unable to use it
-* payment status: if the
+* cannot pay desc: if the user has enough balance but unable to use it
+* payment status: if the order was already paid / repurchased / auto-paid
Actions
^^^^^^^
-* **confirm operation**: if the payment is possible, on success will be redirected to the ``transaction-details`` screen where the detail of the current transaction will be displayed
+* **Confirm payment**: if the payment is possible, on success will be redirected to the ``transaction-details`` screen where the detail of the current transaction will be displayed
* **get more cash**: if there is not enough balance, it will be redirected to :ref:`cta-withdraw-ref`
-* **cancel**: user will be redirected to ``balance``
+* **show full details**: pops up dialog with full transaction details (everything from contract terms)
+* **back/cancel**: user will be redirected to :ref:`cta-balance-list-ref`
Issues
^^^^^^
* WebEx(Text): "Valid until" is likely confusing, not shown on other platforms. Maybe only show "offer expired" instead of pay button (on all platforms!)?
-* WebEx(Screenshot): would be good to show the dialog with expanded order details as well, maybe even expand by default like on Android (and forgo the button?)
-* WebEx(Screenshot): would be good to show a version of the dialog with fees in the screenshot.
-* iOS(text): the label 'Summary' appears only on iOS, and seems unnecessary. Especially since no long-form is available anywhere.
+* Android/iOS(major): lack action to show full contract details
+* iOS(text): the label 'Summary' appears only on iOS, and seems unnecessary.
+* All(major): detailed layout differs significantly between platforms, needs review
+ and unification!
* All(screenshot): would be good to have sceenshots of the main variations: with/without product preview images, with/without fees, full details/partial details (if we have such a toggle).
@@ -941,12 +895,15 @@ Actions
^^^^^^^
* **delete**: delete information about the transaction
+* **open merchant website**: opens fullfillment URL in browser (alternatively, dialog should show fulfillment message)
* **back**: user will be redirected to ``balance``
Issues
^^^^^^
* iOS(major): delete button is missing, instead only has "Done"
+* android(major): lacks button to open fulfillment URL in browser
+* WebEx(major): lacks button to open fulfillment URL in browser
@@ -969,7 +926,7 @@ Screenshots
.. _cta-deposit-ref:
cta-deposit
--------------------------
+-----------
This screen is used for the confirmation of a deposit. the success of this
operation will be an decrease of the balance in the wallet and save a deposit
@@ -1297,6 +1254,8 @@ Actions
Issues
^^^^^^
+* all(minor): All platforms seem to lack export/save as/print functionality
+
Adoption
^^^^^^^^