New answers tagged

0

It would depend on the 12 characteristics of your objects. Do they have a chorological sequence? You could use a timeline view. Do you have dependent data? May be the tree structure would suit. Or it could be cards or expandable lists etc. More importantly, what is the primary use-case for your users? What's their intent?


1

A table is just fine, but there's an awful lot you can do with a table! Just because information is in a table doesn't stop you making it easy to scan, see connected information, identify groups, emphasize important items, and generally ensure that the data itself is in the foreground and the 'table decoration' itself fade into the background. The ...


1

First option is much more explanatory for the user. I would use some blank slate that describes the cause (why the table is empty, who & when erased it) and possible actions that can be undertaken (Undo, Import of new data). If your product allows to manually fill in the table, you need some empty rows at the beginning, with option to add more of them. ...


1

One thing that is missing and you should have is - information on total number of pages available. In your screen shot user does not know how many pages there are when the grid loads. Knowing that information is good but you still need validation. I suggest an alternate solution. I think this is simpler UI , no explicit go to buttons , it keeps controls ...


0

I think both approaches are correct as long as the users knows the number of pages S/he can navigate to. Something like this...


1

Did you consider using other ways to select a page number? One of the challenges of allowing a person to type into a field is they may not even type a number, so you will need to consider all sorts of other types of data entry field validation. If you use an alternate way for selecting the page, which doesn't involve typing, then the person cannot enter ...


0

A couple years ago I also had to deal with a single-page web app that contained long, wide tables and I had to think of solutions that let me present its contents adequately. Eventually I made a small js library for that (http://codepen.io/lopis/pen/OPVVPP) that allowed a user to: Toggle column visibility, with per-user persistence (I used cookies); Move ...


0

You can either leave the Go button enabled or disabled. But, disabling it without providing the reason might confuse the user which may ask himself "why is this disabled?". Your suggestion to highlight the box and providing the tool-tip is a common and good solution to validation of the page number.


0

Column resizing and selection are good solutions but they are more of a general post design solution, dealing the symptom rather than the root cause. Also, they kind of distracting the user from his main purpose which is not to arrange the table. You should first ask your self, does the user really need all the details in the table? for what reason? Tables ...


0

Spotted this creative solution to too-many-columns on the local rail schedule site. In this scenario, it's problematic to predict programmatically which columns the traveler will need. Everyone always needs the stations column. The train times slide underneath the stations column as the traveler scrolls. (Oddly enough, the mobile site no longer uses this ...


0

How to switch from Mode 1 to Mode 2? Links I think clicking a link to open and populate the detail pane could be okay. Users can click a link to open the detail, then click any other link (for the same or different row) to change the content of the detail pane. Certainly is fast and easy. Personally, I’d expect the detail content to appear to the right of ...


0

It depends on what you are displaying in the table and what you want the users to do with the data in the table. Are you expecting them to: Edit the data? Compare the data? Once you know the purpose of the table from the user's perspective, i.e. their goals, then you can decided what UI features you need to think about. For example, if the user is ...


0

You should probably provide some more details on your issue but there are multiple solutions. Those your propose could work but it's key to know what MUST be there. Do you have columns which are not important? Then remove those. Do you have to see them all in one view? Go for horizontal scroll. Another option is to make the table headers selectable to ...


0

My suggestion would be to go for a generic title for your expenses\planned column since it establishes a base reference for what the column is about. I would recommend showing the actual value i.e. Actuals or Planned in the row itself since it would establish a reference as the user scans from left to right . Another reason you need to ensure your table ...


2

I’m writing most of my documents in Markdown ... one of the biggest caveats being lack of native support for tables MultiMarkdown supports tables like this (as per GitHub flavored Markdown) | Heading1 | Heading2 | |----------|----------| | Apples | 27 | | Oranges | 31 | Some MultiMarkdown processors allow elaborations on this theme. ...


1

The goal of the Creole project is a standard syntax for wikis. In the finished Creole 1.0 spec, this is the markup for tables: |=Heading Col 1 |=Heading Col 2 | |Cell 1.1 |Two lines\\in Cell 1.2 | |Cell 2.1 |Cell 2.2 | All cells are separated by single pipes. Leading spaces are permitted before the first cell of a ...


2

There is no "agreed best practice" in this, so I can't give you a definitive answer. However, I've had to deal with exactly this and had to do some user testing on a number of styles. The style that won out was GitHub flavoured markdown, which is both easy to learn, easy to read, and easy to use. My only wish would be that saving automatically aligned the ...


0

It's not bad as it is. Here are some ways you can improve it: Coloring Failed bolded red and Successful green can help differentiate rows Making the headers sortable would likely help (btw, the first header has a typo). Print the time zone of the time if that's something that can cause confusion Change the status text from "Failed" to "Fail" and "...


4

It is just that easy :-) However, you might want to group all the Failed ones together at the top of the grid because these are the ones that will really be of interest to the user (I am assuming they will need to do something to fix them?). I doubt they will be all that interested in the successful ones.


0

Why not put the filters in the top right of the navbar and then add the current state of the filters where you have the button now?


1

You could display an icon indicating the value was edited. One example would be the pencil icon when comments have been edited on this and other Stack Exchange sites. Clicking on this icon would show and allow reversion to the previous value.


0

In general, avoid actions that are invoked simply by clicking on a cell value, as these are hidden actions that won't be clear. To me the only thing that would be intuitive is clicking on a cell to get more details about that cell, as this is a standard web drill-down paradigm. As long as the cell value is clearly a link, this will work. But it isn't ...


1

See my mockup below: I would suggest to show the table in an iframe, which will definitely give you a horizontal scrollbar, but will prevent you from losing your point of reference on the page (if you scroll the entire page, you might 'lose' your navigation and layout). If possible, give (power) users extra functionality, such as the ability to reorder ...


0

This sounds like a classic spreadsheet use. Horizontal scroll is not a bad thing. If something needs to be part of the initial display it should be on the left side of the sheet. If it is less important you can scroll for it. Microsoft Excel and Google Spreadsheets allows some content to always be visible per row by allowing you to pin a certain number of ...


2

Have you considered to just show two columns? One with the values (contact, car no., salesperson, price and a host of other details), the second done with the customer name and values, but place a drop down to select each customer. This approach would preserve the vertical list of features so that you only need to select customers. Adding arrows would allow ...


1

I have a similar situation right now and I did some usability research and found tabular cards is a good and organize way to go. Also when you have too much information is always better to group data in small pieces. users react better to data in Chunks. That's why google material design and most of the modern UI's today are segregated by cards. it also ...


2

Choosing a traditional tabular table, where each cell contains one piece of data, has advantages (easy to compare different rows) and disadvantages (lots of columns take up all your horizontal space). Perhaps consider an alternative layout, e.g. UI cards: Using UI cards comes with other advantages, e.g. they can expand and shrink (i.e. Show more... Show ...



Top 50 recent answers are included