New answers tagged tables
0
Quite straight forward, and not an uncommon solution. There are two possible downsides here however, which I've heard users reaction in training sessions.
Users can't find the control. They see it, but it's not entirely obvious that you should use this one for delete or move to another location.
The drop down menu hides the selected items. When deleting ...
0
Could you consider a different architecture in which the data is manipulated client-side rather than through server calls? I've built some pretty big data tables (> 100,000 rows) with Backbone.js that supported real-time filters/sorts/etc. With that approach, you could update automatically with each user click without incurring the cost of additional network ...
1
Apple's own Reminders app has a good example of the functionality you are asking about.
Reminders has a left column of checkboxes next to the items and a disclosure chevron on the right side of the reminder column. Touching a checkbox selects the checkbox and touching the reminder slides the user to the details page.
Link to image: ...
0
There is no reason why you couldn't do multiple visual indicators per field. For example, make the field a different background color and add some kind of indicator (*, icon, etc.). This way, its pretty obvious that something has changed, the user can quick scan and find the changed items, and you would satisfy any colorblind users.
3
There is a third approach:
.shorten {
white-space: nowrap;
overflow: hidden;
-o-text-overflow: ellipsis;
-ms-text-overflow: ellipsis;
text-overflow: ellipsis; /* or "clip" */
}
See dev.w3.org for more information.
5
Wrap the data with an elipsis at the end. What this does is, it uses known vocabulary to show there is more than what is visible.
AAAAAAAAAAAAAAAAAAAAAA
becomes
AAAAAA...
then you can use a tooltip to show the entire content, use hyperlink or the column can be expanded, depending on your design.
0
Who is the target viewer? Are they other engineers who will likely be searching for specific terms? Will it be non-engineers casually viewing? I would ask myself what kind of person will be accessing the information and try to use that mindset as a broad template to being organizing the content.
However, without knowing that or the entire list of terms, my ...
2
The first interaction pattern that you show is very close to the way that apple handle it in their built-in apps. The difference being that they don't have an "add new row" item. They use a clear + button in the navbar to achieve that - which is the right way to go.
If you use an item at the end of the list to add new items, you are not only breaking user ...
1
Is there any point of treating a book id and book type of the same book, separately?
I would assume when I click the ID of any particular book, I will get the ID, type and other related information in whatever form you wish (a new window, overlay, tooltip).
A pop up with options doesn't make much sense since, first, you click the row, and then select which ...
1
How much information you have to display ?
If there is not too much you can use a tooltip like this one :
1
The pro of making them links is that they are readily identifiable as links.
The con of a pop-up is that pop-ups can be annoying and it's adding one more step to the process of the user trying to get to the information they are looking for.
As such, I suggest keeping them as links.
1
If the user moves to page 2 or beyond, they are interested in older items; so I would recommend not taking up space with the new-items list. It will only distract from the user's task, and take up valuable screen space.
In fact, does the reminder about urgent items need to exist on the subsequent pages at all? If you can only get to page 2 by going through ...
2
Simplicity is key when it comes to designing interfaces for mobile devices.
Google feels the speed of all web pages is so important (for their own reasons as well) that they've made a page optimization app for developers that tells them what needs to be fixed on the pages in terms of delay. Here are Google's best practices in terms of making a happy ...
2
I don't think your problem is limited to choosing a layout pattern for so much data. How are your visitors going to find the item they're looking for? If it's just an alphabetical list or table, how do I know what subject is where? If you could do categories, this also gives you an opportunity to collapse parts of the list. Even if it's just alphabetical, ...
4
If the popups show more detailed information about the row, make sure they don't obscure part of the row. So, perhaps it better to let them appear below the row.
download bmml source – Wireframes created with Balsamiq Mockups
However, it's best not to obscure anything. As you say, that data is on screen to be monitored and you don't want to put ...
1
This is another good example of a complex master-child data view, as such, it's tempting to try to show too much info on one screen. You might be attempting to design for the "power user" instead of the common user, but I don't know how much research has gone into this requirement. I like to push back on these overly complex data screens.
So, a possible ...
4
A possible solution might be multiple right aligned tabbed popups.
Yes they overlap, but each one is easily selected via a tab that is aligned to the 'owner' row. For added value - each tab could be highlighted according to the age at which the popup content was last changed, so that the user can see that hidden popups have changed content.
Or, ...
0
Can you answer these questions:
Does the user always need to see the new items? (Or are they just a notify every time you enter and then forget kind of thing?)
Are the new items directly related to the content below? Do they affect each other?
If the answer to both the questions is 'NO!' then, you can forward with the gmail approach. The reason being, ...
2
Alternative proposition :
Add a search input, make your list infinite scrolling, use some tabs to classify the items if you can and it make sense and avoid pagination.
Here a nice example :
The more you scroll the more members are displayed
5
Readability is everything
Smashing Magazine conducted a Typographic Study for best User Experience. What they found is plain clean backgrounds with standard type treatments tend to work best. People will typically have an easier time reading what they're familiar with. There is no one set rule for the number of characters per line. It depends on the amount ...
2
A few suggestions:
Use different fonts/colours for breadcrumbs and body content. This look the same and it's not easy to differentiate where sections starts
Separate sections, title and content so it's easier to notice scan through in case the user doesn't want to read all
Don't add any background (zebra) to the images, it's just noise for the eyes
You ...
5
The purpose of zebra striping is (with arguable success) to connect items in a row that are a distance apart...often as you'd see in a table and where scanning (rather than reading line-by-line) is often a goal.
Item Item Item
But a paragraph of text has no such problem--the lines of text, themselves, make ...
2
Using zebra stripes in a paragraph is not a good idea. Zebra striping is a solution for improving readability of tabular data and even that is a debated area - http://alistapart.com/article/zebrastripingdoesithelp
There is no repeating structure in the words of a paragraph, which is a good thing since it makes lines easier to distinguish. When you use zebra ...
17
I think you're trying to solve a readability problem the wrong way.
Line length (measure) is your real problem. The number generally advised for a readable measure is about 60-70 characters. Cut the measure to about 60% of it's current length and you'll find you have far less trouble. The other way to solve it is a bigger font size ... that would be really ...
1
For the selection of records to merge I recommend a simple click to select with javascript or the use of checkboxes and a button labeled "Merge Selected Records" at the top or bottom of the list.
Here's one idea of allowing a user to select values from different record.
download bmml source – Wireframes created with Balsamiq Mockups
Do I ...
3
If the buttons take up the entire cell, you will reduce noise. Granted, they will look less like buttons, but if you apply a gradient and different text alignment, it should be clear enough. You could experiment with different fonts and font sizes too, but I'm not fond of the design results.
Here is a rough mockup of what I'm referring to:
I would ...
5
Tables are already very heavy visually so you can add some sort of icon next to the text to indicate that it is a link. i.e.
The advantages of doing this are:
- The user can quickly identify which cells have buttons
- The essence of the table remains
- The visual weight will look balanced
0
Your design is not exactly user centered : you want them to do your job so a least be more gentle with them.
What is the information you want them to merge ? If it is a figure, then there is no point merging, they are already the same. If the information is something picked-up from a list then your application should do the merge by itslef.
There is really ...
Top 50 recent answers are included
