Questions tagged [grid]
Use it for grid (visualization), grid (layout) or grid (physical dimension)
305 questions
1
vote
1
answer
66
views
Disable a column when the specific column has value
I am making a table that has three columns. The user can only choose either the second column or the third column to enter value. How would you design the table?
This is my current design, but I am ...
- 27
0
votes
1
answer
106
views
How to present rooms in a grid style for booking
I am creating a booking style website where students can reserve classes/labs/gyms etc
I feel like my current grid style feels overwhelming. Does there exists a more user friendly way to display this ...
- 3
1
vote
1
answer
102
views
Add a separate filter for items that are already listed in a sidebar, but not explicitly as a filter?
I have a question regarding a filter.
I have a grid with cards that represent pages in a document. There are rules for these cards about when they should be displayed and when not in a generated ...
- 13
1
vote
0
answers
30
views
How to design software for blind people to create grids with one sound per square on Android
I have gone through the help center issues and it does not seem to me like my question is too subjective.
I want to develop apps that are tailored specifically for blind people to reason about their ...
1
vote
1
answer
93
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 ...
- 21
1
vote
2
answers
217
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,631
1
vote
0
answers
74
views
How to put 3 inputs and 1 selector in 3 columns grid [closed]
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?
- 131
1
vote
1
answer
283
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, ...
- 13
0
votes
2
answers
111
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
237
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
106
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
387
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 ...
- 139
0
votes
2
answers
691
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 ...
- 37
0
votes
1
answer
551
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
108
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
139
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
75
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, ...
- 342
0
votes
0
answers
51
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 ...
- 342
1
vote
2
answers
182
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
732
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.9k
0
votes
1
answer
79
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
695
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
104
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 ...
1
vote
0
answers
271
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
53
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 ...
- 195
1
vote
1
answer
658
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
413
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 ...
- 125
2
votes
2
answers
219
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
316
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
2
votes
2
answers
1k
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 ...
- 141
2
votes
1
answer
160
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
254
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
162
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
102
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
114
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
64
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
111
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 ...
- 89
2
votes
1
answer
354
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
89
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
860
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
978
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
109
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,...
- 342
5
votes
2
answers
3k
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 ...
- 173
3
votes
2
answers
223
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
75
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
2
votes
1
answer
2k
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 ...
- 89
2
votes
1
answer
1k
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 ...
- 571
3
votes
3
answers
862
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 ...
- 89
18
votes
9
answers
8k
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
4k
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 ...
- 89