Questions tagged [grid]
Use it for grid (visualization), grid (layout) or grid (physical dimension)
302
questions
0
votes
1
answer
16
views
Sorting option between grid and list view
I have a view in our saas product which has a grid of items as cards. In the toolbar there is a dropdown for sorting which one of the options being 'most recent' - this is the most common sorting ...
- 1
0
votes
2
answers
68
views
How to visually and interactively represent deeply nested physical objects?
I'm in the process of trying to represent storage of physical items in potentially complex, deeply nested locations, let's say up to 5 levels deep.
We want to do this in a visual way that approximates ...
- 3,396
0
votes
0
answers
55
views
How to put 3 inputs and 1 selector in 3 columns grid
I need an outside perspective) The hanging “Mode Tunnel” selector is very annoying. Are there any options for configuring this differently so that it doesn’t hang like that?
0
votes
1
answer
101
views
I don't understand how an 8pt grid system works with a baseline grid system, any tips?
I've been playing around with design grids, and have liked the consistency of baseline grid systems where all the baselines and elements land on the baseline grid. This is easy to implement for me, ...
0
votes
2
answers
71
views
Displaying date and time based on other conditions
I have 5 columns (Order #, Product, Status, Priority, and Date).
The values in the Date Column are displayed based on the Status column. For example, if the status is Request, then show the requested ...
- 103
2
votes
3
answers
141
views
Reset filters or warn the user when a new element is added to a list?
I have a list of elements (displayed as a grid) which can be filtered using various ways : search input, filter by content, sorting... When the user wants to create a new element, it is immediatly ...
- 123
0
votes
1
answer
59
views
On mobile, how far apart should related checkboxes be from each other?
I have a grid layout that looks like this:
__ Item1 __ Item2
__ Item3 __ Item4
The __ are checkboxes. How far from the other checkboxes should they be?
- 213
0
votes
1
answer
245
views
Ag-Grid filter across pages or current page
When using the Ag-Grid with multiple pages, is it a good practice to filter records across pages or should it be just the current page ?
Also for sorting, is it a good practice to retain the current ...
- 129
0
votes
0
answers
332
views
How wide should my artboard be (Container width)?
I came to a point when I needed to decide what would be the container width for my pages.
My project involves designing a web platform with a dashboard and a side menu for navigation.
I made a little ...
- 27
0
votes
1
answer
349
views
How do you use the 4px grid in a mobile screen for iPhone 11 Pro that is 375px?
How do you use the 4px grid in a mobile screen for iPhone 11 Pro that is 375px?
Margin 16px / gutter 16px? Then it requires to be four columns with a width of 74px however, one of them should be 73px.
...
0
votes
1
answer
96
views
What should I do when I have 2 diferent edits for the same "object"
So in my use case I have a list of objects in a sidebar and the rest of the screen is a grid with different elements in there. I can modify them with the edit mode. There is one icon for every object ...
1
vote
1
answer
113
views
Is the 8pt grid a meaningful tool?
In figuring out how well-known companies apply spacing in designing interfaces, I looked at a couple of mobile websites. Virtually none of them seem to apply a consistent grid system.
Google, Booking ...
- 11
0
votes
0
answers
66
views
How to show "Read-only" (un-editable) content in a grid? Has to be a non-color reliant way so can't use gray color
How to show "Read-only" (un-editable) content in a grid? Has to be a non-color reliant way so can't use gray color. FYI, some content in this grid will be editable and the way it works is, ...
- 302
0
votes
0
answers
50
views
Grid where user makes individual choices in every cell. Is there a better way?
I'm in a new job. The company has a pattern for grids, where choices are not made in a column header. But in each cell individually. I have never seen this before.
So I have a grid now, where one ...
- 302
1
vote
2
answers
121
views
Sort a grid with some empty cells
I have an editable Grid/Table where the cells can be edited. In a column, there can be some filled and unfilled cells. The column can be sorted. What is the best way to sort the cells?
I am thinking ...
- 11
1
vote
6
answers
628
views
Too many expanding panels, not enough room
The scenario: An enterprise software platform uses a collapsible left panel for its navigation and a collapsible right panel to show customer info. The customer info panel would be used side-by-side ...
- 12.1k
0
votes
1
answer
77
views
APPLE phone devices unequal grid layouts [closed]
What is wrong with APPLE's phone devices when it comes to grids? It's impossible to get equal margins no matter what you'd do.
Here is an example:
Original image link
May anyone have a solution for ...
0
votes
1
answer
442
views
Question about Grids and Layouts in UI Design
grids and layouts are something that i've struggled with since starting my design career two years back. I've read books like grid systems and watched several videos and courses but as a UI designer, ...
- 1
-1
votes
1
answer
89
views
Grid layout for a Web application
I am wondering what the appropriate grid layout for a web application is. I am using a 16-grid layout which leaves at least 130px of left and right margin. However, I see application which seem to not ...
0
votes
0
answers
179
views
Good ways to show detailed info selecting from a table?
Lists (tables or grids) may hold much information behind the list. I have seen popup windows and split screens etc. Most of them works in a desktop environment, but on a small smartphone the detailed ...
- 121
1
vote
0
answers
203
views
Overlapping div in left side when turning off the collapse on the left sidebar [closed]
I built a dashboard that contains sidebar with collapse. When I try to put chartjs and make it display:grid, it turns out it is overlapping the right side when turning of the collapse.
Here is my html ...
- 11
2
votes
1
answer
50
views
Choosing a "Post Type" from a Grid and move to next step
When a user wants to create a new post, my app has a Grid with "Post Types" as the first step, and below the Grid, it has the rest of the form where users can type a Title and a Body.
When ...
- 185
1
vote
1
answer
419
views
Screen resolution stats and responsive design
I'm working on a new website and there's some debate regarding what width should be picked as maximum for the main, fixed-sized, grid (it won't be a 100% width layout). (Should it be 1100px? Should it ...
- 111
0
votes
1
answer
302
views
Image grid with clear order and different aspect ratio
I am making an image grid which shows about 200 images and they are user submitted, so I do not know the dimensions of the images. Some are portrait. Others are landscape. Most are landscape.
I have ...
- 115
2
votes
2
answers
158
views
Form alignment with numbers in B2B (integer)
i have a business application (desktop, no web). Different values are entered in forms. These are then displayed in tables (grids). Numbers are displayed right-aligned in the table (as in Excel). ...
- 55
0
votes
1
answer
196
views
When to use paging on a grid
We write business applications that may include grids. The grids can be use to show a lot of items such as all customer orders in the system or a shorter list say a list of tasks that a team has to ...
- 3
1
vote
0
answers
769
views
Shortcut Key for OK Button on Dialog Box with Grid
In a desktop app, I have dialog boxes that contain one or more small grids, various other simple controls, as well as the usual OK/Cancel buttons. Grids pose a problem to the usual use of Enter as a ...
- 131
2
votes
1
answer
158
views
Does bigger/wider grid better provide better user experience nowadays?
Does bigger/wider grid provide better user experience nowadays as 16:9 are more common?
I don't see many 960px/1000px wide layouts these times.
There is some data favouring e.g. bigger buttons, but ...
- 21
1
vote
2
answers
198
views
When row(s) is deleted in a list view, which row should be selected next?
Say I have a list of rows in a grid/list/table, where the user can select multiple rows and delete them together. In which case, selecting/focusing which row after deletion gives the most intuitive ...
- 61
0
votes
3
answers
129
views
Should every line in a grid have edit icons?
We have an application with many grids. The current design is that only the currently active row shows the edit and delete icon. Is this a good practice, or should every line have the edit/delete ...
- 111
0
votes
1
answer
83
views
If it's possible to combine plain and hierarchical view together?
I'm facing the issue of data representation. On the same page, it's possible to view both plain and tree structure. It's ok (tbh no, but we can live with it for a while), but when it comes to new ...
2
votes
2
answers
76
views
Image gallery multiselection tips
I'm making a gallery of images in a grid and I have a few concerns. The user is able to see metadata when hover over a picture and also select multiple images.
Hovering over an image
Selecting an ...
- 121
1
vote
0
answers
61
views
Present a hierarchal view (tree) containing sequential and parallel tasks [closed]
How would you present a hierarchal view (tree) containing sequential and parallel tasks?
The tree can contain two levels of groups when each group can
contain one or more tasks
A specific group can ...
0
votes
1
answer
85
views
Persistant UI region for filtering section in layout
I have to include a filtering column next to the results. The filtering column needs to be a persistent UI on the bigger screens (resizes the results content while it's open). I'm having quite a few ...
- 79
2
votes
1
answer
267
views
Best practices for filtering with multi-select checkboxes
I am designing an application where the filters work like this: When a user selects a checkbox and then types, the selection is erased.
I would like to keep the selections as they are and present them ...
- 69
3
votes
0
answers
64
views
Tiles or Grid as default view ? (for files) [closed]
Are there any statistics on whether users use more often list/tiles view in their file drives? e.g file explorer, mac finder, G-drive, Drop-box, OneDrive...
I know the value of each display but want ...
- 31
1
vote
2
answers
503
views
Should a list of employees be sorted alphabetically by first name? [closed]
Imagine a list or grid of employees, assuming the non-technical user hasn't clicked any column headers yet, do you think they would expect the employees to be sorted by first name or last name or the ...
- 13
2
votes
1
answer
755
views
Expand/Collapse button directions in tree table ie data grid versus non-table applications
I'm creating a tree table for use on our platform. We currently use chevrons for our expand/collapse buttons, and in doing a lot of research across UX forumns, I decided on the rule that the chevron ...
- 31
2
votes
2
answers
107
views
Grid line item status column - how to display broader explanation?
Grid contains transactions of a sort. Each transaction can be: Open, Closed, or Cancelled. There's a "Status" column, and each cell has one of the 3 words in it: Open, Closed, or Cancelled.
Now, Open,...
- 302
4
votes
2
answers
1k
views
How to deal with extra spacing with line-height when spacing between elements should be consistent
We want to design our website so that all elements are spaced 24px apart (paragraphs, form groups, header & content, etc.) and "related" elements (label & form field) are spaced 8px apart. We ...
- 163
3
votes
2
answers
190
views
Implementing an insert-update-delete grid in a web application
I'm in the process of rewriting an old desktop application that's used for warehouse management and retail. The warehouse window is meant for importing, returning and modifying imported items. So it's ...
0
votes
1
answer
64
views
Application List View
I wanted help in designing the Applications List view. We have different applications that are grouped under categories. Eg: Social media - Skype, Slack etc.
Box Grid
In this view we have white ...
- 69
1
vote
1
answer
1k
views
Should all grid contents be divisible by 8 or an even number?
When designing a grid system it is advisable to use an 8pt grid. This is stated by Material Design and many others. Does this mean that columns and gutters all must be divisible by 8 or a smaller even ...
- 79
2
votes
1
answer
974
views
How to provide validation feedback for multiple rows in a grid?
I'm designing a page that needs to let a user upload a spreadsheet with content to be imported into my database. I anticipate that some of these rows will contain data that's fine in Excel, but ...
- 561
3
votes
3
answers
468
views
How to handle grid system and layout at different breakpoints when designing wireframes / mockups?
So I've researched this question and I've alluded to an answer, however I'd like some more input. As a developer whenever designing a website I could just code as I go and set breakpoints whenever ...
- 79
18
votes
9
answers
7k
views
Is right click on tables bad UX
We've a grid where users can select multiple rows and perform actions on them. When rows are selected, we show action buttons at the top of the grid. We've been thinking about making these actions ...
- 301
0
votes
1
answer
3k
views
How do you layout a grid with a side menu? [closed]
I know questions like these can come down to preference, but I'm looking for some input. When laying out a grid with a side menu do you take the leftover space and form a grid with that space, or do ...
- 79
0
votes
1
answer
183
views
Mass / batch - update / edit cells with in a grid
I am looking for some ideas on the UX of allowing a user to edit multiple cells in a grid at one time. These users may have thousands of records and they need to provide data on each record, this data ...
- 1
0
votes
1
answer
100
views
when using material design guidelines do you use exact heights for sections? [closed]
My question is if everything is suppose to be in 4px or 8px increments does that mean even the height of sections or containers? For instance if you wanted to have a section that filled the viewport ...
- 79
0
votes
2
answers
146
views
Best way to insert a clear button in a datagrid cell
I have a datagrid (or, more general, a data structure) in which the user, with a proper button, can clear data by only one column.
Since that requirements force me to implement different moments to ...
- 23