Questions tagged [layout]

The way in which the elements of an interface are laid out.

Filter by
Sorted by
Tagged with
0 votes
2 answers
128 views

Dealing with non-fluid data tables

I have pages consisting of mainly data tables. So far I'm using a fluid design with Bootstrap's rows/cols. Here is an example: As you can see at the bottom of the page, table 1 has very wide columns ...
user avatar
0 votes
2 answers
99 views

A good design of adding lots of numbers?

I am breaking down a large number such as 1022056271142522954 into adding the individual digits, and want to show the process of adding the digits. What I have now is this, which overflows onto ...
user avatar
  • 321
0 votes
4 answers
144 views

How do you find inspiration without copying someone's work [closed]

Say you want to design a mobile app and the like a few stuff about some design choices and decisions on similar apps designed... You'd like that in your app design wouldn't that be copying
user avatar
  • 9
0 votes
1 answer
29 views

Study showing it's better to have images in their own row on a text/news article page, rather than in a column with text wrapping around it

I'm remembering a usability study I once saw that demonstrated it's better for scanning or readability on a website's news article or text-heavy page to have any photos as their own row by themselves, ...
user avatar
0 votes
2 answers
75 views

Mixing true/false and open-ended settings

I've been handed a settings page to review. The settings mix true/false and open-ended items. Some of the open-ended items can be long and wordy. This is an example of the current design: Mixing the ...
user avatar
  • 8,759
1 vote
0 answers
46 views

What is a good way to display a list and editable list item on a detail page? [closed]

I have detail pages that are kind of like the attached image. An "entity" might have 1-15 children. Each child can be edited. You can also create a new child. I can think of two ways of ...
user avatar
1 vote
2 answers
123 views

Form UX UI add item with multiple input fields

I have a form in which a user can add items with 3 inputs to each item. I need a label for each input and a label for the whole item group. I have a problem with aligning things up. As a general rule ...
user avatar
1 vote
1 answer
47 views

How to deal with centered content on a layout with a sidebar?

I have the following view in my application, where a list of cards containing some information and a button is present. In order to prevent uneeded space within the cards and make the button closer to ...
user avatar
1 vote
1 answer
58 views

What is a better way to present sign up / login form?

It has become quite common and dare I say annoying these days to see websites and mobile apps prominently highlighting the 'sign up' for new user fields but at the same time why do they make 'Login' ...
user avatar
1 vote
6 answers
456 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 ...
user avatar
  • 8,759
0 votes
0 answers
40 views

UX article/study on CLS (cumulative layout shift)

I’m struggling to find any article/study on CLS from UX perspective, almost all resources I found are written from SEO standpoint. Please could anyone point to any article/study? Many thanks 🙏
user avatar
  • 1
0 votes
0 answers
54 views

Creating a better UX for Generating a Document, subsequently downloading and then uploading a Completed Document

I was brought into a project to improve the general UX/UI of an web application. The section of the application where I have hit a roadblock works like this: User enters Information and selects ...
user avatar
  • 1
1 vote
1 answer
53 views

Designing interface to accommodate physical devices with different number & layout of ports

The following device is a network switch. This particular model contains 24 ports, arranged into 2 rows with 12 ports on each. There exists hundreds of models of switches, each with different number &...
user avatar
  • 251
1 vote
1 answer
54 views

How to visually emphasize one card among many

I'm working on a portfolio and I want to present myself as "T-shaped designer", so I sorted my works into 3 different categories. These categories will be shown as clickable cards/gallery ...
user avatar
  • 247
0 votes
2 answers
127 views

Table with one column that has a lot of text

I am trying to improve the UI of a design of a table that has three columns. The first two columns have one or two words and the third column has a fairly long list of items. My first solution was to ...
user avatar
3 votes
2 answers
106 views

Why do web paragraphs break, while print paragraphs indent?

Both indentations and line breaks create a strong disruption that signals "this is a new paragraph" to the user. Question: Several decades into web browsers becoming a major form of ...
user avatar
  • 8,759
1 vote
1 answer
71 views

Show conditional elements?

Context: I am designing an application with different login options. In the settings of the application, you can turn on/off each of the logins options. 50% of the logins options require additional ...
user avatar
0 votes
0 answers
51 views

Grid/Column layout: Fixed-width sidebar or sidebar is within the column grid?

This question is regarding grid layout, the context is that I am designing for a platform which has a pinned sidebar on the left. I'm trying to figure out the layout settings. According to this ...
user avatar
0 votes
1 answer
248 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, ...
user avatar
1 vote
1 answer
38 views

Google pay and Credit card in the mobile app

I just need one or two advice, regarding on this new booking system as the developer team create it without my knowledge and didn't ask me for advice or design UX before they went developed it and it ...
user avatar
0 votes
1 answer
117 views

Design pattern for collapse but not entirely

I have a bunch of cards in a 2 column layout in my grid. If there are more than 2 items to display I want to show only 2 of them and hide the remaining behind a "Show all" button. What is ...
user avatar
  • 131
0 votes
0 answers
91 views

iOS download behaviour for pdf files in a shop

I developed a small shop for a client and have stumbled upon a bigger problem. After completing a purchase for an e-book, customers can download it in the order overview. However, iOS does not load it ...
user avatar
1 vote
2 answers
119 views

UX Pattern to make it easier for the user to fill many different select boxes

We have a web form and the user is required to fill in atleast 5 (maybe more) select boxes. Our current UI layout (see below image) looks like alot of work to the user. Are there different UX Patterns ...
user avatar
  • 111
1 vote
1 answer
55 views

Displaying a simple list on different viewports

I am building a simple app with two screens that show a list of quotes (inside cards), an image and an about screen. On mobile it looks fine (using a tab approach), but for bigger viewports like ...
user avatar
0 votes
2 answers
41 views

How do I best make a tally of items on a mobile phone

I'm designing a wireframe for a mobile app for logging materials. One of the features needs to be able to log the makeup of a material. fx in the case of a technical fabric the composition can look ...
user avatar
2 votes
1 answer
52 views

Is the Floating Side Panel / Icons affect the UX?

I have been asked to include a floating side Menu Icons. Here is an example: I am not convinced about this idea and I think it is intrusive & distracting, so I want to have your opinion about ...
user avatar
  • 21
2 votes
3 answers
143 views

page overloaded with tables

I am looking for a better ui-design idea for this page. So each company has different types of vehicles (trucks, personal vehicle , tractor etc) Each vehicle has its own dates for the different ...
user avatar
0 votes
1 answer
30 views

Examples of two/multiple facet scoring?

Working on an interesting scenario - we need to communicate a "score" that has two facets: A percentage based score that has a threshold that must be met to pass (90%) Specific items that ...
user avatar
  • 655
2 votes
1 answer
63 views

Is filling the center-area of a GUI with several forms a good practice?

Center-area concept: For a desktop application, we commonly find a similar structure for the GUI: Top menu / Ribbon Dockables left and right to explore the content and show properties. Center-area ...
user avatar
1 vote
1 answer
75 views

Best layout/design for profile CRUD actions suggestions

I am currently working on a university project on an android app, that communicates with a device via Bluetooth and uploads profiles to it. So in the app I have a UI that provides different CRUD ...
user avatar
0 votes
1 answer
132 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 ...
user avatar
3 votes
2 answers
104 views

How best to display a network of friends?

Related How to properly show one's friends in a graph if the number of friends is large, but 1) I have max two levels of "depth of friendship" and 2) I want to group friends. I want to show ...
user avatar
1 vote
2 answers
77 views

How is this UI called (multiple pages with settings, dots on bottom marks progress, usually after install of app)

On mobile phone when I install some app it shows few pages with basic settings, at the bottom are dots indicating progress, sometimes back/next button. How is this thing called? I want to find and try ...
user avatar
  • 11
3 votes
2 answers
249 views

How to group multiple buttons on mobile

I'm working on a game website for desktop and mobile and one of the pages has 5 action buttons: Edit (no text, just pencil icon) Share (no text, just standard share icon) Play (just text) Compare ...
user avatar
0 votes
0 answers
65 views

Holy grail layout solution that makes complex apps being usable on mobile?

What's the best solution for responsive holy grail layout in the context of complex responsive design? Some common layouts done in this way Hubspot CRM Problem: it doesn't work on mobile as most of ...
user avatar
2 votes
3 answers
116 views

How do I lay out the special offers page when most offers only apply to one product?

I am building an ecommerce web site, and am trying to find a way to present the special offers. Products on special offer are grouped, so the offer applies to all products in that group. For example, ...
user avatar
0 votes
1 answer
88 views

Can I improve this layout for a better experience?

Here I have tried two different layouts for fitting this information inside of my mobile app. The picture inside of the app is actually a video demonstrating what to do. The first (left) layout ...
user avatar
8 votes
3 answers
393 views

Excel spreadsheet colour coding/design/layout principles?

With programming you have "software design patterns", with websites you have design standardised (and then some templates, e.g. "bootstrap"), and people know where the input etc. ...
user avatar
1 vote
1 answer
104 views

Should a web-app page title appear on every page, even with the current page highlighted in navigation?

I'm facing a dilemma with other designers within our team about whether the main page frame of our web app should iterate the title of the page itself at the top left corner or if it should not exist.....
user avatar
1 vote
1 answer
75 views

Redesign of a resultpage card [closed]

I am wondering about a redesign I have been doing. It is about a resultpage in which we have home insurance cards.. the current setup was not flexible enough to show a longer text for the usps. My ...
user avatar
1 vote
3 answers
116 views

Time picker with blacklisted times

What would be a good design on an app for a time picker, incremented by 30 min with some blacklisted times? So for ex. 9:00am, 9:30am, 10:30am 12pm, 12:30pm etc. checked all over for inspiration, but ...
user avatar
  • 881
0 votes
1 answer
64 views

Can a 2-column grid of info be acceptable if it mitigates an awkwardly large amount of white space?

I'm in the middle of a psuedo-overhaul of my company's platform, with an emphasis on "object-level" pages (ie the page for an individual task, or individual appointment). A problem I'm ...
user avatar
  • 533
0 votes
1 answer
82 views

Show all 6 features on home screen, or only the main 2 with the rest hidden inside?

Let's say there are 6 different features for an application. Should we show all 6 features on the homescreen for better accessibility? or should we show only the top 2 features which helps the user ...
user avatar
0 votes
1 answer
67 views

Which button placement is more usable for touch

I'm designing an order listing UI for a delivery person to fulfill their orders. I need to add a cancel button for ad-hoc cancellation in certain situations. between the 2 options below I'd like your ...
user avatar
  • 10.5k
3 votes
3 answers
238 views

What is the correct placement of actions buttons

I am working on an application where user's data will be frequently added and updated. In sample 1, I have added 'add address' links in each row per category for quick addition but it is breaking the ...
user avatar
  • 1,790
1 vote
1 answer
199 views

How to organize nested groups of forms where a user can just keep adding to them?

Here's how it works: The user uses the dropdown in the gray "new service" area to select a service. Once one is selected, let's say Web Design (cuz why not?), then they can click "Add ...
user avatar
  • 127
2 votes
2 answers
742 views

Is Cumulative Layout Shift a consideration while the page is still visibly loading?

Cumulative Layout Shift (CLS) refers to unexpected change in the position of content on a page, and usually happens because resources are loaded asynchronously or DOM elements get added to the page ...
user avatar
  • 175
2 votes
2 answers
145 views

Best input validation approach for complex and busy screen

I have an extremely busy screen for a single page application that allows people to pick their own components and build a custom printed circuit board (following a template that we provide). Our ...
user avatar
  • 907
1 vote
1 answer
106 views

Should I align multiple search boxes horizontally or vertically?

Which UI/Ux is better? horizontally placed search boxes or vertically placed? I am trying to understand which pattern is good in terms of UX/UI and reducing the user's effort I am thinking in a way ...
user avatar
  • 11
0 votes
2 answers
100 views

Good way to fit lots of numeric/config information on one screen

The goal is for the user to be able to configure what they want, and then "Do something" to their selected "thing," usually more than once, and see the results. This screen is ...
user avatar
  • 105

1
2 3 4 5
18