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

3
votes
2answers
2k views

Replacement for Grid or Table Data Visualization for Mobile Apps

What could be the best replacement for Grid data visualization in terms of displaying multiple data elements with same structure in mobile apps. To Elaborate..Well, lets say we have 10 rows and 5 ...
3
votes
3answers
507 views

Are there any better ways to present/edit a very large matrix?

We have a page where user selects what training courses are required for each role in organisation (HR-type web-based system). That looks like that: Now have ability to hide columns, fix headers ...
3
votes
4answers
9k views

Whats the average screen size of a handheld android tablet device? any wireframing mockup available?

I am designing a UI for an android app that is developed for tablet devices, I would like to know is there any mockup grid available? Like 960.gs for web... what is the good size to start designing. ...
3
votes
6answers
523 views

Add button for grid list

My team is developing a widget that uses a grid layout to display a list of webpage links, and we would like to have an inline add button so that our users will be able to add more pages to the list. ...
3
votes
3answers
204 views

Indicating A Document Has Been Drawn On

Imagine layed out in front of you is a large board with little white pieces of paper representing the cover pages of system files on them. You are shown a title, and a modification date. How might ...
3
votes
1answer
528 views

Are there any guidelines for vertical layout and spacing?

The proliferation of grid systems have made it easy to determine the horizontal layout of a site - column widths and margins are just made to fit into the correct grid spacing. But what about ...
3
votes
1answer
675 views

When to use grids vs lists?

In which cases are grids more useful? With grids I mean something like the homepage of youtube, where you have many rows of videos, and in which cases are lists better, such as the youtube search ...
3
votes
1answer
62 views

Where should an item on a 2d grid be pasted to be not overlapping

I have a grid on which boxes can be placed like in the image below. The main constraint is that two boxes must not overlap. Box X is not allowed to be on top of box E. Now given each box should be ...
3
votes
3answers
213 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 ...
3
votes
1answer
116 views

Printing Job Queue Grid display

I'm building a Printing Job Queue Grid Layout which contains 9 columns( Name, Status, Owner, Duration, Material 1, Material 2, Material 3, Material 4, print mode... (relevant for the current printing ...
3
votes
3answers
289 views

Presenting partially overlapping tables

Let's say we have a grid displaying a bunch of devices, where each row is a device. The devices have performance data and configuration data. Some users are going to be interested in the performance ...
3
votes
3answers
382 views

Data Grid double click for detailed record view or single click to populate constantly visible single record form?

It was hard to phrase the question clearly. I'm looking at two options: 1) Full page data grid. On double click on a record, a window pops up showing the record in a form view. 2) Top half: form ...
3
votes
2answers
83 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 ...
3
votes
2answers
445 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, ...
3
votes
1answer
163 views

Snapping to grid

What is a good threshold for a UI which allows users to place objects, snapping them to a grid? 25% of the grid size? Less or more? Should the user be able to change this?
3
votes
1answer
623 views

Grid text alignment rules

I was wondering if someone has come across rules used by web designers for text alignment in a grid. I was observing that majority of text is aligned towards left, but financial figures with ...
3
votes
2answers
1k views

How do I display large amount of table data on iPad?

On our windows product we display large searchable grids, with a large number of columns that can be reordered, sorted, and filtered. This is a fairly common method on Windows (explorer for instance) -...
3
votes
2answers
180 views

Providing multi-language descriptons

In a similar question (Multi Language Name Input), I already read about the translation-topic. In our desktop applications, we have some situations where the user needs to enter translated values for ...
3
votes
2answers
775 views

What is the best practice for displaying mixed data in a single data grid?

We have a complex database application and would like to display mixed data in a data grid. By mixed data, I mean objects that roll-up to a single category (vehicles) but have unique properties (truck ...
3
votes
2answers
722 views

How should I design an MS Access application for Excel users?

I work for a public health study, and I have been asked to help manage the workflow for an upcoming project. We will be choosing subjects, tracking our contact with them, interviewing them, placing ...
3
votes
4answers
109 views

Show a blank sidebar to preserve layout consistency?

In our product we have a sidebar which contain some widgets. However, certain pages don't need any widgets. On these pages does it create a better UX: a) Keeping the sidebar as a blank column. This ...
3
votes
3answers
392 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 system?...
3
votes
2answers
407 views

User access level grid - idea for gui

In my software application, multiple users can be created and every user belongs to a single Department. Users can add tasks to other departments. For example, the accounting department can add a new ...
3
votes
1answer
247 views

Specifying default sort

I want to add the ability to specify a default sort to this interface. Currently it allows users to specify the order of the columns display and the default size. I am revamping it into a table form ...
3
votes
2answers
47 views

When using a grid for a web app, does a sidebar /side tray fall within the grid or outside of it?

I have had this problem for a while. Designed many applications with a sidebar navigation but have never fully concluded on how to best use it within the grid. A, inside the in grid just included ...
2
votes
2answers
75 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 ...
2
votes
3answers
850 views

Best way to show one-to-many relationship in a grid?

This is probably the most common issue when it comes to grid/table design; How to display one-to-many relationship such not to repeat the item nested. Please take a look at two solutions I came up ...
2
votes
1answer
758 views

What's a typeable symbol to indicate “starts with” in a filter field?

I am building a custom data grid control. The users do a lot of sorting and filtering. I want them to be able to do this with only the keyboard. Currently they can filter columns by typing in the ...
2
votes
3answers
165 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. ...
2
votes
1answer
264 views

What is the best way to lay out a list of date ranges in a table?

I am showing a webpage where I list out where people will be out of the office. I want to get some feedback on which is a better format (obviously forget about the fact that you can't draw good tables ...
2
votes
3answers
1k views

Table/grid design for website when a rows column has multiple values

I am designing a website in which users will input data into textboxes of a table, similar to this excel spreadsheet (but imagine textboxes and drop downs instead of table cells) The highlighted ...
2
votes
3answers
246 views

Panel arrangement and responsive design

In a user interface it is often appropriate to use to panels arranged in a grid to display content, either as a way of showing content instances to a user or as a way of arranging content instances ...
2
votes
2answers
205 views

How can I design a matrix that allows users to rate items in two or more categories?

Does anyone know a good way to show a double matrix question? For example where you need to rate stuff in 2 categorie!s (or more). Ive attached an example of what we came up with so far. The problem ...
2
votes
4answers
81 views

How to improve “between” operator usage in grid?

I have a grid with comparison functionality. The problem is I have to use column 2 only for "between" operator, for other comparison/search operators it's useless. How can I improve this? Open to ...
2
votes
1answer
72 views

Is multi-layer ESCAPE expected?

We design an application, containing a grid with an active filter search and inline-editable columns. Each row represents a record, of which multiple fields are editable. The application should be ...
2
votes
2answers
94 views

Is it a good idea to use letters as column labels?

I ask myself, is it better for users to use a generic grid with letters as column labels instead of numbers ? Excel, OpenOffice and Google Spreadsheet do it by default but I'm often confuse. I have ...
2
votes
3answers
132 views

Should I show first page when user sort the grid?

Consider this grid as an example. In grids, should I show the first page when user sort the grid by a column? I think logically I should. But I am not sure from UX point of view.
2
votes
4answers
150 views

Should quantities with unit labels be left- or right-aligned in a grid?

e.g. 3 months 12 years, 3 months 10 years 8 years, 6 months
2
votes
2answers
367 views

What is the right UI for showing a grid that can be ranked

I have a grid of information (using jqgrid). One of the new fields is Rank. Its quite cumbersome to go in and edit each item and update the rank field and then have to update all of the other fields....
2
votes
2answers
448 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 ...
2
votes
1answer
176 views

Save or clear Sorting and Filtering settings when adding to a grid

The layout of the page is a grid on one side with a list of items, and on the other side displays a snapshot of something selected in the grid, or if you're adding an item, it displays the form. I'm ...
2
votes
1answer
258 views

UX for specifying & showing mutual exclusive pairs in a group

I'm working on a SaaS/B2B web app that includes forms that allow choosing and later showing mutually-exclusive pairs among a small number of options. Here are some examples: if the customer buys ...
2
votes
2answers
237 views

number justification in HTML table cells where some cells are editable and some are not?

A convention in financial software is to right-justify numeric and currency values when they are displayed in a table. This allows easy top-to-bottom scanning and summing of numbers. The same ...
2
votes
2answers
404 views

Are checkboxes necessary to allow selection of a row in a data grid?

I am re-developing the datagrids in a web application. A discussion has started around whether checkboxes to select in a datagrid are still necessary. Have mobile touch interfaces and their general ...
2
votes
1answer
347 views

Grid and in-line editing

I am developing an application where I have a header and a list of lines. The dilemma I am having is how to display an interface where the user can edit multiple lines at the same time in a user-...
2
votes
1answer
112 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 ...
2
votes
2answers
83 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 ...
2
votes
1answer
1k views

Grid system for mobile app mockups?

1) For native mobile apps (iOS7, Android etc.), do you guys do mockups using the grid system too? Like maybe, 4-column grid layout for mobile apps? I heard of the grid system being used for responsive ...
2
votes
2answers
172 views

Change page size drop down when paging grid

If you are paging by 10 items per page and you are on page 3 and you change the page size via a drop down to page by 30, do you start again at page 1 or do you stay at page 3 with a new page size?
2
votes
4answers
424 views

Best UX for interacting with a grid that auto-updates on an interval

I have a grid that auto updates every 30 seconds. Each row has a checkbox in the first column where the user can select multiple rows and apply an action to it. They can also apply an action to an ...