New answers tagged


I'm bigger fan of the card style design component/pattern. But for an table you can place three vertical dots menu icon at the end of the row, and then in small modal display actions. It is more suitable then example with chevron down icon you shown, as chevron down accordion pattern is mostly used to toggle more content.


I would suggest introducing an "unsorted" icon that you could apply to the columns that are sortable. So any column that is sortable will have this grayed out "unsorted" icon, sorted columns will either have the up or down arrow, and unsortable columns will have nothing. DataTables does this out of the box, and I think it's a great way to indicate where the ...


According to your description, I'd recommend to use Master-Detail pattern, see the image: In this way you have freedom to represent on the Detail level all the information, that users need. Otherwise you are limited to the table representation only, which doesn't fit your claim on having unlimited amount of data.


There are ways to indicate the possibility to resize without hovering, but they aren't commonly used and therefore act as an indicator for the affordance only. Don't expect any signifier to be understood directly when it is seen for the first time. A few examples of possible signifiers: While they are clearly indicators (the lack of contrast put aside) they ...


Try using a variant of material design chips to separate the ranges, and you can use badges to show how many numbers make up each range. Since you're dealing with phone numbers, and you have that in the column headers, you can take away the 'Numbers' repeating in each range, substituting a badge. I tried making the numbers smaller by repeating the last 2 ...


You need no invent something new, just look how the widely used apps behave. In this way you can exploit users' previous experience, so they'll find this feature is "intuitive" ;). Google Sheets Airtable Some points to consider: Use clear visual cues for users: change cursor type and show the border between rows (as on the pictures) Increase the ...

Top 50 recent answers are included