Dynamic card layout on Account List

[ltfschoen]

Currently on the account list page we have a lot of white space on the right-side of each Account because we're now using short addresses and it's just being displayed as a vertical list as shown below.

Could use use Flexbox and display it in tiled format as shown below? Or even add this option to the Settings menu?

Since we don't have a restriction on name length we should shorten the name to fit the component, that way it would show consistently sized tiles and spacing in the screenshot above. My account with a really long name also doesn't fit on the Account page as shown below:

[ltfschoen]

If we only display the first 8 chars of its name on the Account List page, and the first 25 chars of its name on the Account page, then it looks nicer, as shown below:

[Tbaut]

I'm not a fan of those tiles, this makes things small and shrunk. I like having spaces and our users like the lightweight design too, let's try to keep it that way.

The last screenshot is interesting, this is a case I tested before and I did not have the problem mentioned with the title on top of the buttons, so I didn't mention it:

Also, would it be good to have an input field to search for an account name/address and filters the list to just show that account?

I don't think this is a problem at the moment. We can tackle it if it comes up later but i wouldn't spend time on this now.

[ltfschoen]

Ok, I just thought it'd be an opportunity to give users the common layout theme choice (i.e. a button that toggles between a "list" or a "tiled" view), as some users might like a shrunk view or a change of scenery (myself included) particularly when 50% of the card is white (if they have short names), or if they had to scroll down to view their accounts we'd ease the experience by giving them "sort by" or "search" filters or even a "pin to top" option (like we have on Telemetry).

In Fether will we allow users to choose different colour themes (i.e. colour picker palette), or toggle between different common layouts (i.e. list vs tiled view)?

Also, are we going to address the UI issue of users with really long names? If so do you have any preference?

These are some considerations that come to mind:

• List views decreases a users attention as they have to scroll further from top to bottom to find what they're looking for (particularly if there isn't a filter/search option)
• Tiled/grid views are more engaging to the eye because they have more images (rather than text or just whitespace)
• Tiled/grid views can fit less information in each card than list views can (but in our situation we don't have much information)
• Tiled/grid views are more for images, whereas list views are more for when you also want more space to fit detailed/summary information (but all our detailed information is on the "Account" page). Are we planning to add any more summary information in a minimalistic way to each card on the "Account List" page (i.e. small icons/colours indicating certain things, such as how many tokens they've added, etc)

[Tbaut]

It'd be a quite big change in Fether's visual identity that would need to be validated by proper user feedback.

We don't know what's the average amount of accounts right now. Let's not try to find solution to problems that don't exist yet.

Also, are we going to address the UI issue of users with really long names? If so do you have any preference?

I do not have the problem right now, cf my screenshot on master (not awesome looking, but not broken). Your latest screenshot looks good IMO. We should also consider limiting the amount of characters then in the name.

In Fether will we allow users to choose different colour themes (i.e. colour picker palette), or toggle between different common layouts (i.e. list vs tiled view)?

Sure why not, like a dark mode. Not a priority for now but considering the amount of websites and apps that propose such a mode, it's surely popular.

[ltfschoen]

It'd be a quite big change in Fether's visual identity that would need to be validated by proper user feedback.

We don't know what's the average amount of accounts right now. Let's not try to find solution to problems that don't exist yet.

Also, are we going to address the UI issue of users with really long names? If so do you have any preference?

I do not have the problem right now, cf my screenshot on master (not awesome looking, but not broken). Your latest screenshot looks good IMO. We should also consider limiting the amount of characters then in the name.

In Fether will we allow users to choose different colour themes (i.e. colour picker palette), or toggle between different common layouts (i.e. list vs tiled view)?

Sure why not, like a dark mode. Not a priority for now but considering the amount of websites and apps that propose such a mode, it's surely popular.

Regarding changing colour theme. I think this should be quite easy to do after we've merged the styled-components PR #357 by just following the "Ok cool, can you change theme?" section at the end of this blogpost https://medium.com/styled-components/styled-components-getting-started-c9818acbcbbd

[Tbaut]

Closing as the question is answered.