Rectangular layout of information. As well as tables, grid layout also refers to a 'typographic grid' used to position items on a page.

learn more… | top users | synonyms

2
votes
2answers
55 views

Showing selectable and non-selectable row in a grid

I have a grid where I need to show to differentiate 2 kind of rows, ones that can be selected and others that cannot. All the rows include a link and the user can select multiple rows. My question is ...
3
votes
2answers
437 views

Responsive solution for quick view on grid items

When showing a grid view of items for desktop and tablet screen sizes, are there any examples or suggestions of how to offer a quick view option for both mouse and touch devices? Often on websites, ...
0
votes
1answer
134 views

Expandable grid interaction

I am designing a grid and need to accomplish two actions when clicking on a row: 1) navigate to a detail page for that row information 2) open an accordion "drawer" with more information. I am a ...
12
votes
7answers
2k views

List vs tiles for links

I am designing a drop down panel which houses a collection of quick links / bookmarks to other areas of an intranet. Users access the intranet through a laptop or desktop pc running windows or mac ...
1
vote
1answer
32 views

Checkbox column in grid with paging [duplicate]

I have a grid with a column of checkboxes that allows to select multiple rows. When any row is selected user can do some kind of action on them. Grid has several pages, sorting and filtering are ...
0
votes
3answers
156 views

What are the best practices for sorting tables with sections?

When you have a table with sections, the sections denote a hierarchy for instance: Name Corners Perimeter - Standard Shapes 7 ...
0
votes
2answers
68 views

How to add more columns to data grid keeping it more expressive

If i have a grid view like this and i have to add more columns one as link button and one for notes (text) .the table is full of data how to handle this problem:
1
vote
1answer
33 views

Is there an alternative to a video thumbnail frame?

I am designing an app for a piece of software. In a section of this very complex app, users can add photo/video/audio/excel/word files. Once uploaded, they can view them in a large thumbnail grid. ...
0
votes
1answer
91 views

Is it a good practice to remember checkbox selection across multiple pages in a grid?

Suppose I need to select multiple items across pages and then apply an action (click of a button) on it. Is it a good idea? If user wants to know what he/she has selected then can I help him by ...
1
vote
1answer
96 views

Better way to act on grid data?

I need to assign different levels of permissions to users in a grid. But in-line/direct editing of grid data is not allowed! As shown in the mockup below, in the action column, clicking "Add" will ...
3
votes
2answers
63 views

Grid action button selection

Problem statement: 1. Need to select individual row and Copy. 2. Need to select multiple rows and Copy. 3. Need to select items from different page (Pagination) and Copy. 4. Need to select all items ...
7
votes
1answer
192 views

Adapting Outlook-style master-detail to a non-full-screen view

When a web app's master/detail grid (narrow master on left, wide detail pane on right) is not full-screen like Outlook or the iPad Mail app, but is instead embedded in a page that can be vertically ...
0
votes
1answer
39 views

Should the grid header use the same shade as its elements?

In a fast-paced environment (a desktop used by a store, to sell products), should I use a darker color as background for a Grid header, to differentiate the products and the header, or should I use ...
1
vote
1answer
70 views

How to display adequate info without looking “busy”

So I'm making a section of a web page for an "event management" system. The system works as follows: The Organizer Email field is an autocomplete. You start typing an email and it performs an AJAX ...
1
vote
3answers
193 views

suggestions for dealing with multi-dimensional hierarchical data

We are designing a price calculation tool, for which every property adds a percentage increase/decrease in value of the object. Properties in combination with each other can have shared impact on the ...
0
votes
3answers
83 views

Grid view or List view for musical instruments?

The "Grid VS List" question has been posted before. The answer seems to be: it depends on the contents you are displaying: grid for products in which the image counts a lot (shoes, dresses, etc.), ...
0
votes
1answer
30 views

Grid that shows payments and refunds at the same time

I have a grid where I need to show payments made by user and also refunds that could be issued to that user. How can I format the grid in order to make easy to differentiate payments and refunds, ...
-1
votes
1answer
117 views

What is the best way to display multiple columns?

I have been asked to come up with a solution for displaying 50+ columns that were previously viewed in excel and now need to be brought to the desktop application UI. Mobile version is out of scope. ...
1
vote
3answers
137 views

In a data-table, should actions be on the left or right

When working with tables, I prefer to place actions that are specific to the row (i.e. edit, delete, etc.) within the row. Sometimes I use an action menu, sometimes it's an edit or delete icon. ...
1
vote
1answer
96 views

Is there a best practice for alignment of nav bar content - with grid or not?

Looking at various site's nav bars I see some sites spread their content wide across the bar, anchoring their logo to the far left and login to the far right, navigation in the middle (examples: ...
14
votes
5answers
1k views

Why do very few e-commerce websites use full-width and fluid layouts?

Looking at some of the top e-commerces websites (Flipkart, Etsy, Amazon, Bestbuy) , I could find that only amazon utilizes a full width layout, and that too isn't fluid. While I understand the ...
0
votes
1answer
133 views

Pros and Cons of a grid/dot grid based Futuristic UIs

I've been recently curious about FUI's seen in sci-fi games or movies, it seems the conclusion on these UI's is that they are flashy and very unpractical. But one concept that I seen have seen used ...
0
votes
3answers
174 views

Grid with cards

I want to create grid withs cards that looks like on photo, every card have text in it. What would be better to make , all square or rectangular cards ?
6
votes
3answers
715 views

I want to let the user toggle a column heading to sort a grid by a date field. How can I make ASC/DSC intuitive?

I want to let the user toggle a column heading to sort a grid by a date field. How can I make the ascending/descending dichotomy intuitive? EDIT: I was looking for date-column specific solutions.
0
votes
0answers
50 views

encourage renaming while displaying original name too?

I'm working on a very simple custom report builder in a web app where about 90% of our users are office workers with limited technical skills. For these low-end users, we want to present a simple set ...
6
votes
3answers
192 views

Indented row headers

We have a screen layout where we have several columns to display. The problem is - you guessed it - real estate - to be able to fit all columns. This is for desktop, tablet and mobile screens. One of ...
0
votes
2answers
56 views

What should be the column title in a grid which shows checkboxes, where sorting is enabled?

I am looking for a title for the checkboxes where sorting is enabled for that particular column. Since they're checkboxes, I'm not sure what the title could be since there isn't any descriptive factor ...
2
votes
2answers
70 views

Need a prominent way to show the sorted column

Formerly, grids showed which column was sorted, by using a glyph (▼) in the column heading. What I know In Windows 10's File Explorer, this glyph is visually less prominent and has moved to the ...
3
votes
3answers
383 views

Pagination vs Scroll in Datagrid

Normally, we can use pagination and scroll in a datagrid when it has too many records. How to balance when to use pagination or scroll, considering consistency in standard guideline in a whole ...
1
vote
3answers
90 views

Dynamic grid-like input with user defined columns - width issues

I have a system where a user can freely define a set of columns. Later, they can select this column set and enter data for these columns. They can enter multiple rows of data. It looks like this: ...
2
votes
2answers
442 views

Responsive Grid View with Hover layer

I have a grid layout which has an hover state which reveals information that are crucial as below. The Content of each Grid Item Dish Name Dish Photo Rating Chef Name Chef Photo Chef Location ...
1
vote
1answer
110 views

Search Results in a TreeTable

I Have a TreeTable where groups of itens are organized by categories, as you can see on the image bellow. What is the best approach to present the list of results taking into account that is ...
0
votes
1answer
58 views

Best UX for suggesting members to connect with? Carousel on profile page or separate page with GRID

I am toying with how to show my users potential colleagues (friends if you will) on my site. These "friends" are a list of academics that have been drawn up based on 1) common research interests with ...
3
votes
3answers
209 views

separate or in-grid-column-header filtering for reports?

For filtering tabular data as part of a reporting feature in a B2B web application targeted at relatively low-tech users, what are the pros and cons of having filtering UI be part of the column ...
0
votes
0answers
84 views

Displaying a lookup table in a complex grid

In my application I have a fullscreen form which has some edit fields with buttons on the right side. The value of some edits has to be chosen from a huge table, after clicking a button (for example ...
2
votes
1answer
60 views

Best data formatting for sorted and unsorted lists (names, dates, etc) [closed]

Anyone have guidelines (ideally backed up by scientific study) for the best way to format data in lists/tables/grids? I'm arguing with my group about name formats--I think we should always display ...
0
votes
2answers
138 views

Displaying add & edit note actions for each row in a table

I work on a web application and i have a list of users. On each user i can do some actions (Enable/Disable and Add/Remove Tax). Now my users could have need to add some note on a row, for example I ...
0
votes
1answer
177 views

Grid view vs List view

A similar question has already been asked here - Grid View vs List View for products . But i would like to get clarity on some specific facts. The questions is wether to use or this. Here are a ...
1
vote
1answer
150 views

Property Grid vs Dialog

I have a general question about the use of property grids. There are forces within my company who want to implement a blanket rule of "no property grids". Here is an example image of a Property Grid: ...
1
vote
0answers
80 views

Columns or Rows: Showing data in grids or lists [closed]

When presenting a list of quite detailed information (lets say a title, a date, a number, and then several paragraphs of description) which provides the better usability; rows or columns? Why? ...
0
votes
2answers
344 views

Inline Editing v Section below grid to edit

Is inline edit good UX? Which is a better way to edit a grid, providing an inline edit option or providing a view below the grid, (display additional details and provide editable fields)?
1
vote
3answers
660 views

Research on the Usability of Grid Views

I have been trying to persuade my colleagues that viewing, sorting, and searching large lists of data in a grid are less usable than performing those actions on that data in the context where it is ...
1
vote
2answers
133 views

Designing show/hide flow for admin

Running into a UX problem on a webpage I'm designing. The flow is than an administrator of a company can select what items to show/hide to a member. So he will have access to a list of all items and ...
1
vote
1answer
53 views

How should empty details in master detail grid be displayed?

If I hide the captions for empty information and rearrange the elements, it is harder to check for details. If the caption is displayed, it is also confusing to read. (especially if there is another ...
0
votes
1answer
98 views

How to manage a dashboard displaying resources production/consumption?

Let me explain the context. The user has a list of Factories. Each Factory produce 1 to 5 Resources. For producing a resource, the factory consume 1 to 3 resources. I need to give an overview of all ...
1
vote
1answer
130 views

Best way to add filtering for the data in grid ? dynamic filter fields or filter for each column separatly?

How I can add 'Multiple' filters on my page for the data in the grid (grid is having 10 columns and I want to add filter for all the columns) which will be more obvious and easy to use for the user ...
1
vote
1answer
229 views

Summarising grouped data in a data table

I'm working on a financial app and we're getting mixed feedback from users as to how we've displayed the summary for groups in data tables. We've data tables which are, say for example, shopping lists ...
2
votes
2answers
81 views

Manage long grid data

I am creating an app which has functionality to search in some specific database and result it back in grid format. Sometime resulted data words are so long that it is not cover in column and it split ...
8
votes
3answers
851 views

Alignment of input fields in a form with plain text

I have a details page containing a list of information and input fields at the same time. Sections are alternating between information and input fields. I am debating between the alignment of data. ...
127
votes
5answers
8k views

Avoiding the Hermann grid illusion

I'm a UX newbie and I'm trying to design a page of image thumbnails. I came up with this: The trouble is that this layout creates the Hermann Grid illusion. When looking at the grid, most people ...