usability – Using right navigation drawer for filter search

You have all the power in the world to give 2 drawers (left and right), but why?
We use drawers mainly for the purpose of navigation because they mostly contain one or two-word links to other pages. You will rarely find lengthy text in drawers.

Filers, on the other hand, can have variety, like checkboxes, radio buttons, range scales, text boxes (From – To) etc.

So why to show it in a right drawer and let that 10-20% space on the left get wasted and for what?
Earlier apps were using popups to show filters which wasted 5% of the screen space on the edges but now understanding the importance of spacing, more and more apps are inclined to open a complete page for actions like filter or search.

So opening a right drawer for a filter will be taking you one step back.

Until you have a strong reason or restriction to do it that way, it’s the option which you likely should avoid.

usability – Allowing users to purchase a “spot” on a group advertising software

You can omit the claimed spots to reduce visual clutter, but use the Scarcity principle to induce action.

Assuming the product (and offer) is ethical, this can help focus users towards a decision.

It seems like the spot #s are not too significant, other than the idea that there were (in your case) 6 spots, now there are 2.

You can use some visuals, and indicate that there’s only ‘x amount’ left.

This can remove visual clutter and show only selectable items, while giving them info about how many are left (and they may go fast):

enter image description here

From Nielsen Norman, on when to use scarcity:

Expediting Desirable Actions: If you find that most people who convert on your site visit your site more times than you think should be necessary before converting, you might try using scarcity to reduce that time lag

You can try both approaches, and test, but if you’re trying to focus user actions, it might be worth reducing excess UI, and see if a scarcity message (you can use messages that emphasize scarce supply, how quickly spots are going in the last x time) combined with showing only clickable elements both gets them through faster, and perhaps increases conversions over time.

usability – Select and remove accordion option


I have a website where you have the ability to select a delivery option but also read more information on each one and potentially have some custom options for each option too. Depending on the options they can become rather lengthy. This is the solution I have come up with.

My solution:

I have some delivery options in an accordion that shows information text text (and potentially other selectable options, lists etc) in them.

To select a delivery option (only 1) I have a ‘select’ button placed next to the accordion arrow. I also need the option to remove it and show its selected which is starting to get cluttered and it doesn’t feel like a good experience. See below:

enter image description here


Does anyone know of any better patterns for this or know how this can be improved?

interaction design – Tradeoffs in buy-in/uptake, retention, usability and engagement when splitting an app in two (or more)

I’m designing an app that, due to its nature, has 3-4 absolutely distinct but interacting role-types. However, importantly, a single person can be tagged with any combination of these roles. One possibility is to have a single app where a user can select the role-type through which they are currently interacting, and another approach is to have separate apps for the roles that coordinate data appropriately.

I’d personally lean towards distinct but communicating apps, but there are scenarios that will force a user to switch roles, hence in the multi-app scenario, switch apps. I am curious if anyone has looked at the effects of switching apps on how usable the “ecosystem of apps” is. Does having to switch apps occasionally affect usability, engagement, retention, confusion, initial uptake, etc? If so, is it known how much the number of switches per day/week modulates the effect?

usability – Order of list boxes in a dual list box

A dual list box is a component-based on two list boxes placed together that allows adding, removing, and ordering items.

According to Kaley from the nngrounp: “The Listbox on the left holds available options and the Listbox on the right represents selected items. The Add button moves an item from the available list to the selected list and the Remove button moves a selected option back to the available list, to deselect it. Users can also move options up and down to reorder elements in the list

My concern is the following, due to the normal order of reading of a user, it seems more natural to place the selected list box on the left instead of the right. Because the page scanning is faster when you only want to review while defining is the opposite.

enter image description here

So, my question is:

Does it matter the order of the list boxes? or it’s just to be consistent using always the same order because users will learn the pattern reading the labels?

usability – Disable field or button if user exceeds number of tries

I’m currently facing this design issue:
When a user exceeds the number of attempts given to fill up a verification code field, he or she will not be able to try again until 20min later. If within this period, he attempts again, it resets the clock.

I’m thinking of disabling the button during the 20min to prevent the user from submitting an input. Have this design pattern been used before? I’m wondering what the drawbacks are for this.

usability – How to label resources belonging to users in a two-sided marketplace?

I read great advice on “Your” vs “My” in user interfaces and ‘My Account’ or ‘Your Account’?

But neither deals with the special case of two-sided marketplaces.

Example – airbnb clone

Suppose a user could be both a guest and a host. And suppose the app has separate pages for ‘bookings as a guest’ and ‘bookings as a host’. What should each of these two pages be called? (please assume they’re both linked to from the navbar at top of page).

The best I came up with was ‘Bookings’ for bookings as guest and ‘Bookings-with-you’ for bookings as a host. But I’m not sure if that’s best practice, not too wordy, and still usable.

Note: a misunderstanding could be costly here. Example: if a user checks ‘Bookings’, sees none, and wrongly concludes they have no upcoming bookings (as a host), i.e. the user could accidentally assume that ‘Bookings’ meant ‘Bookings as a host’. Then they could be unprepared for an upcoming booking! (bad outcome)

So there’s some subtlety in the naming that really matters. Any help or advice on this?

usability – eCommerce -> After a digital course has been purchased, should I still show this course in category page?

I am developing an online course website based on WordPress.

Website has 30 courses in total.

Courses are divided into 5 categories (A, B, C, D, E).

There are 6 courses per category.

Each course also has a fixed price.

So once a user purchase a course,
user can only purchase it once because it`s a digital course.

In addition, course status can be either “not started”, “in progress” or “done”.

Therefore, users can access their “membership area” and
see courses divided into the following 3 sections based on user activity:

  • “Not started” section shows all courses that user did not start yet.
  • “In progress” section shows all courses that are in progress.
  • “Done” section shows all courses that user already completed.

Here is my question:

Once user purchase a course,
should I continue showing this course in categories page OR
should I remove this course from categories page?

For example,
Category A has 6 courses.
User just purchased 5 courses in this category.
Should category A page show all 6 courses with 5 of them tagged as “purchased” OR
should category A page show only 1 course, the course which user did not purchase yet?