Double vertical scrolling - client requirement - Searching for a good reason to say no

Question

The thing is my clients asks for a contact list where you have something like this

The first ones are the contacts that already are your friends in the app, the second ones are not your friends yet and you are waiting for them to accept you or not.

So my cliente wants the 3 points (see more) thing, so when you tap them all the names that you are seeing go up and more appear, plus you can scroll that list. The same for the second list. So suddenly you got 2 vertical scrolls in basically one list. I really doubt of the effectiveness of that, but i am a rookie and i ask you for help. I don't want to be right no matter what, maybe the requirement is good. But in case it is wrong i want to have a solid reason to say no and propose another approach. Thank you!

Answer 1

Use of tabs can also solve this problem. Just like the tabs what facebook had in the message earlier(don't know category exactly, I think categories were Friends, Others).

Answer 2

Multiple scrollbars within the same design element is certainly a non-standard design pattern.

Accessibility:

Inline scroll areas can be perplexing - and provide particular problems for accessiblity. Where am I in the list? How do I move from one list to another?

Try prototyping out the client-requested solution - is it keyboard accessible?

Mobile platforms and invisible content

Some platforms (looking at you, Macs) helpfully hide those yucky scrollbars until you interact with them. Is it always obvious that your content is scrollable? If you end up with invisible scrollbars, will your users know more content is available?

Here is some reading on the topic that may help you:

• http://webaim.org/techniques/frames/
• https://baymard.com/blog/inline-scroll-areas
• https://www.nngroup.com/articles/scrolling-and-scrollbars/

Answer 3

Beyond the good user interface-related answers you've already received, I'd also approach this from a UX goal perspective. What is the primary purpose of the UX workflow this UI component is a part of?

In this workflow is it more important to see a full list of friends, or to only see "pending" friends? One way to answer this question is to ask which list is the end-user more likely to need on a regular basis to accomplish the task defined in your application. Many times, as designers, we're asked to make things with a duality of purpose or to skip early goal definition steps. In my work that raises small red flags, causes me to stop, and ask leading questions to get closer to the true purpose of what's being designed.

Defining the goals of the page/task can help act as guard rails to keep everyone on the team (including the client/stakeholder) focused on only designing a simple, straightforward solution. Best of luck!