[96][charyury][3][gibbsfromncis] Update Sign Up UX

[gibbsfromncis]

After this issue #1808 I suggested that misunderstanding of wallet types is on Sign Up page. When user sees Sign Up for the first time he can't make conscious choice between wallet types because he has no idea that we support 2 different wallet types. When user opens Sign Up the sees only that he can create account using advanced form.

Also my friend had some another problems on sign up like no clear validation errors etc.

The result of this issue must be a new, clear UX of Sign Up.

[froooze]

I like the layout from Openledger, where we have two columns with a list to compare each other.

Ask Openledger for a back port to the Bitshares client?

[startailcoon]

The two types are very similar for users when they sign up, as well as sign in, nowdays indeed. Nothing really speaks about the difference.

OoenLedger has made it much more clear and could be a good place for inspiration on this.

[gibbsfromncis]

@froooze,@startailcoon, yep, that's what I mean exactly.

@startailcoon I'll prepare the list of requirements & try to estimate it.

[sschiessl-bcp]

Ask Openledger for a back port to the Bitshares client?

I asked what there standpoint on that is

[gibbsfromncis]

@startailcoon @sschiessl-bcp

I suppose we can keep Sign Up components we already have but provide additional step when user should decide about account type.

I don't think we should wait for somebody's response or ask for a back port.

Estimate for UX is 3h and 3h for development.

In result it will be additional page which user will see when press "Create account" (step before registration forms). On this page user should get clear info about wallet types and decide which one he wants.

[happyconcepts]

This is pointless when there are more serious ui deficiencies that should be the focus of this worker.

This worker was to improve the UI and not be a Slush fund for a small group to enrich themselves at the expense of the other participants in the chain.

[sschiessl-bcp]

This is pointless when there are more serious ui deficiencies that should be the focus of this worker.

Please open issues for those if not already existent.

This worker was to improve the UI and not be a Slush fund for a small group to enrich themselves at the expense of the other participants in the chain.

Can you give more detail in your accusation here?

[happyconcepts]

No. It would just get me banned here as in telegram, for telling the truth to those who want to hide it.

iIRC It's simple math to add up who has been enriched on the UI worker.

[froooze]

The registration process is critical and not very helpful atm.

@gibbsfromncis: We don't need another page, we just need to redesign the actual one like open ledger did it.

@happyconcepts: You should open some tickets and post on other platforms things you don't like.

[sschiessl-bcp]

OpenLedger signaled that they would be willing to backport there approach. Do we like the UX?

[abitmore]

@happyconcepts please stay in topic. I know you're a talent and have a desire to improve things and have done some, but some other things you've done have led to the opposite. BTW I guess admins can ban you here as well if you're identified as "not-welcome".

[abitmore]

@sschiessl-bcp I'd expect that OpenLedger will estimate much more hours. See discussion here bitshares/bitshares-core#1210 (comment).

[gibbsfromncis]

@sschiessl-bcp Yep.

@sschiessl-bcp if @abitmore right and backport from OpenLedger will take more time than requested hours from me I see no sense to ask them about their help but I definitely like their solution

[froooze]

With backport I thought of copying the code from Openledger to the bitshares-ui? Where is the extra work?

[gibbsfromncis]

@froooze it may be not so easy to just copy-paste code. Also their bureaucracy and management take time too. Lets wait for OpenLedger team estimate first

[froooze]

Why do we need OpenLedger, when we are allowed to backport it?

[sschiessl-bcp]

Why do we need OpenLedger, when we are allowed to backport it?

OpenLedger is closed-source afaik

[gibbsfromncis]

@froooze they can do it more cheap than I requested.

@sschiessl-bcp btw how long should we wait for their response? Can we make some deadline if they don't response I can start to work by myself?

[startailcoon]

As I find some things on OpenLedger pretty nice, I still think we shouldn't backport their style directly.

What I think we need

• More clear distinction between bin-file and account/cloud
• Prettier UX for selecting, inputting and verifying.
• Include Restore from brain-key with a prettier UX

Today our UX is confusing at best when you sign up, with options to type in a form, or restore, or use an advanced from. The advanced form links to another set of form, or you can store from backup or local brain key. This is to many steps without any easy explanations.

What OpenLedger has solved is to put a simple side-by-side comparison, and this is what we should work towards. But I don't agree that we should use their UX!

I think we should allow a set of UX/UI hours to making a good implementation of our own.

I support @gibbsfromncis proposal of estimated hours for this task.

[froooze]

@startailcoon: The OpenLedger is a good base, but needs further tweak and we should discuss some improvements.

[charyury]

Hello friends! I will provide detailed information about the effort we spent for sign up, login and logout screens, waiting for details from the developers. Anyhow, this will be definitely far from 6 hrs mentioned above, so if we somehow block the progress, please go ahead.
Still we would love to be 100% transparent and make sure we compare apples to apples when talking about estimation.

[froooze]

Before working on the signup window and integrate it, a draft is needed for discussion.

[charyury]

Hello friends!
Sorry for the delay, below are efforts we spent for our implementation.
As expected, those are much bigger than estimated by your team, still I am willing to share, this might help to understand if there is something wrong with our process, or maybe your team is underestimating, or maybe we are comparing completely different solutions.

Here we go:

Registration

Selection screen Page 1:
Components creation, components structure - 4h
Registration selection wallet panel markup - 4h
Registration selection account panel markup - 4h
New layout styles - 4h
Code review - 2h
Bug fixes, code review comments fixes - 2h

Registration wallet page 2.1 screen:
Registration form - 4h
Validations - 2h
New layout stylings - 8h
Code review, fixes - 2h

Registration wallet page 2.2 screen:
Confirmation form - 4h
New layout stylings - 4h

Registration account page 3.1 screen:
Registration form - 4h
Validations - 2h
New layout stylings - 8h
Code review, fixes - 2h

Registration account page 3.2 screen
Confirmation form - 4h
New layout stylings - 4h

Login:

Plate with headers: 12h
Account login: 12h
Wallet login: 24h
New tooltips: 6h
Mobile version: 8h
Refactoring, small fixes: 10h

Total (registration+login):

FE - 140h
QA - 20h
UX - 20h
PM- 12h

Logout

FE - 20h
QA - 4h
PM - 2h
UX - 2h

As we did this for our solution, we are ready to share the code at 0.5 of the costs of the initial implementation.
Any feedback is much welcomed and appreciated!

[wmbutler]

@charyury Thanks for this. I received your email and we are excited to begin collaborating with Openledger and all of the gateway providers who have created added value for their own gateways and are interested in contributing back to core.

I reviewed your signup procedure and only have a few comments:

• 7 character password minimums on "Account Model", (Cloud Wallet) should be brought up to 16 to ensure brute force attacks on username/password are unlikely.
• We should keep the Local Wallet / Cloud Wallet terminology for the reference wallet so we don't have to re-educate.
• Since we are going to ANT, let's use ANT components. I don't think this materially affects your implementation.
• Ensure fonts are consistent with reference wallet

Which Sprint should I place this issue into in order to manage the expected timeline for delivery?

[froooze]

I thought @startailcoon just wanted to replace the Selection screen Page 1 and add a row of extra information?

[gibbsfromncis]

I've unassigned myself from this issue because now OpenLedger will be responsible for this one and will work on it by themself

[froooze]

@charyury

• The font-size for the description of input boxes is too small and should be bigger.

@wmbutler

• 7 characters are too low for a cloud wallet, but maybe a brute force protection could be implemented to feel save with an 10 characters long password?

[charyury]

@wmbutler

I reviewed your signup procedure and only have a few comments:

• 7 character password minimums on "Account Model", (Cloud Wallet) should be brought up to 16 to ensure brute force attacks on username/password are unlikely.
• We should keep the Local Wallet / Cloud Wallet terminology for the reference wallet so we don't have to re-educate.
• Since we are going to ANT, let's use ANT components. I don't think this materially affects your implementation.
• Ensure fonts are consistent with reference wallet

We will implement all these requirements. This will not add any additional cost.

Which Sprint should I place this issue into in order to manage the expected timeline for delivery?

We are ready to start early next week and deliver by the end of the week.

@froooze, thanks a lot for your comment, we will update accordingly.

[gibbsfromncis]

I updated hours because of additional time I spent for testing & reviewing styles and UX

[sschiessl-bcp]

Is this issue considered to be done from your side with the login PR from yesterday? Then I will review the general flow one more time.

[MikhailKavalenka]

Is this issue considered to be done from your side with the login PR from yesterday? Then I will review the general flow one more time.

Stefan, yes, the merged PR covers the issue. We are waiting for your feedback.

[MikhailKavalenka]

@sschiessl-bcp , did you have a chance to look into the the general flow?

[sschiessl-bcp]

Sorry for the delay, here is my review of the flow:

• Login with local wallet:
  • Cache cleared, then login. First the Create Account / Login screen appears, then the user is forwarded to Dashboard. This is confusing behavior, the Dashboard should be shown directly.
  • Cache cleared, login with one, then login with next creates white screen of death (not in scope of this issue)
  • Known local wallet from previous logins are not presented (probably not in scope of this issue)
• Account creation:
  • Displaying passwords must never hide any letters. Currently it is a textfield that cuts of, users might get confused if they write the password down by hand. Password in the Screenshots is much longer than displayed, both when choosing the name and when displaying afterwards
    
    
    Please use the existing way of displaying password
  • Password strength indicator is missing for local wallet

[MikhailKavalenka]

@sschiessl-bcp here is the PR with the fixes: #2133
Please take a look.
Thanks for the comments!

[Jackcameback]

@charyury Which address does openledger want to be paid at?

[charyury]

@Jackcameback , please pay to rob-ola. Thank you!

[froooze]

When is this available?

[sschiessl-bcp]

When is this available?

The new login layout is done, but the integration into the login route and login popup is missing. It is available here btw https://wallet.bitshares.org/#/login

[gibbsfromncis]

@sschiessl-bcp #2662 I'll work on it