Questions tagged [layout]

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

Filter by
Sorted by
Tagged with
0
votes
1answer
131 views

Laying out radio buttons and text area in a dialog

I have a dialog where I need to lay out radio buttons and their corresponding text and icons, and a text area. This is my current dialog layout, where the colors denote the icons. Note that the last ...
0
votes
2answers
99 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 ...
0
votes
1answer
65 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 ...
1
vote
2answers
58 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 ...
1
vote
3answers
76 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 ...
18
votes
6answers
11k views

Fixed width for buttons or proportional with the text?

What is the best practice for a UI, to make all the similar buttons with a fixed-width, no matter how long is the text (with the condition to fit) or make the width proportional with the text and add ...
1
vote
2answers
379 views

Navigating a double top bar

I've ran into a UX problem in a site I'm designing. I feel like there's an obvious solution but I'm having trouble finding it. I have a site that has a global sticky bar. In the middle of the site, I ...
1
vote
1answer
74 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 ...
3
votes
2answers
104 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 ...
3
votes
1answer
119 views

Guidelines for layout of component that can have variable sub components

I've been asked to design a component that lists objects on a page. The component needs to be able to display between 3 and 6 numbers of objects in the list. Here's what I have for 6 objects in a list:...
1
vote
1answer
35 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, ...
32
votes
11answers
9k views

Is there a usability reason for centering a website's content area on a page?

A lot of websites these days have content area's which are center-aligned: User Experience Stack Exchange is an example. However some sites are left-aligned, e.g. Adobe Support Community, Area 17, ...
0
votes
0answers
31 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 ...
3
votes
3answers
66 views

Careers links in mega menu

I am designing a corporate website career page. Should I use a mega menu for the career page? Here are some of the items related to the career page: Who we are! What we do? Life at Our Company! ...
1
vote
2answers
132 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 ...
1
vote
1answer
65 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 ...
0
votes
1answer
79 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 ...
2
votes
2answers
154 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 ...
2
votes
1answer
98 views

The right Layout grid for iOS UI design

I just downloaded the free iOS 13 GUI for figma and I tried to see whether their app templates follow a standard grid layout format, and by the way it looks they don't - components are not aligned ...
0
votes
1answer
38 views

Where to put a Map on the Contact Us page?

I’m working on a Contact Us page and trying to keep it minimal with only 3 sections (in order): Map Contact Us Form Footer Does it matter if it is: Contact Us Form Map Footer? Edit: I have removed ...
2
votes
1answer
70 views

How to display products from various menu's in a smart way?

for an application in the restaurant business I am thinking of a smart way to display ALL menu items, both foods and drinks, from various menus. Now a restaurant may have several menu cards, so a ...
0
votes
1answer
54 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 ...
7
votes
1answer
98 views

Order of arrangement controls for Back/Front Backward/Forward

Backstory A discussion came up in my organization where we're looking at the conventions for ordering the Forward/Backward and Front/Back buttons for our desktop application, which runs on Mac, ...
1
vote
2answers
68 views

Aligning single column layout

In his article "Designing Learn JavaScript’s course portal", Zell Liew chose a single column layout aligned closer to the left. He defends his choice by explaining that it improves legibility. ...
7
votes
3answers
172 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. ...
20
votes
4answers
8k views

Should the search box be on the left or the right side

In a web app with a search box in the header - where should the search go, on the left or the right side of the header? What considerations should be taken into account when making this decision? In ...
1
vote
2answers
197 views

how to reduce content scrolling without reducing a story?

This is what I came up with: (summarized version) After finishing the page I got user feedback (design leaders from the UX community). The feedback that I got was that it lacked storytelling and ...
0
votes
1answer
63 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 ...
1
vote
1answer
50 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.....
0
votes
1answer
82 views

“Translate” mobile app mockup dimensions from desktop to smartphone size?

I'm pretty sure this is a common issue, but I'm not certain if I'll be able to explain myself correctly. So please bear with me. I'm including a screenshot of a mobile app I'm working on in my ...
4
votes
2answers
1k views

What would be a better typing experience in landscape mode of a keyboard?

While designing a keyboard app for android, I went through a lot of testing of various existing keyboards. One thing found in common was that typing in landscape mode of every keyboard wasn't very ...
0
votes
1answer
58 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 ...
1
vote
1answer
80 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 ...
0
votes
0answers
35 views

Dashboard with variable size section

I'm designing a dashboard, with various graphs and data tables, that has a section showing the relevant users. My initial design was to have a card design for each user and it looks fine if there are ...
5
votes
2answers
165 views

Mobile UX - Using tabs and bottom navigation

I am trying to find information regarding using tabs when combined with a bottom nav bar. The benefit of the bottom nav bar is that it allows the user to quickly switch between different sections of ...
0
votes
2answers
94 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 ...
0
votes
2answers
117 views

Which is best alternative design of a table which having only 2 column to display in UI with one edit button. Please advice me

Please help me to get the best UI layout as I don't want to use the table in my page due to less number of the column.
1
vote
2answers
95 views

How to make sure people will see all the items/options on my website?

I'm designing a website for a dog and cat shelter. We will put the photos with the descriptions of the animals and any other useful infos. Since there are about 50 dogs and 100+ cats, how can I make ...
0
votes
1answer
50 views

How to represent nested If-Else blocks in documentation?

I want to document a process that has some nested If-Else decision steps. The documentation must be printable, so I don't have a lot of space for proper left indentation to represent the current level ...
1
vote
2answers
76 views

Should we include a 'collapse' on this page?

We're developing a page, where the user can unsubscribe at the top of the page, and 'email preferences' at the bottom. The question is, once the user has 'expanded' to see the preferences, does he ...
1
vote
2answers
57 views

Referring to the position of an element in modern (responsive) design

This is such a common and basic issue that there must be an answer somewhere already, but I can't see it, so I'm wondering if I'm missing something. Should we avoid referring to the position of an ...
5
votes
2answers
362 views

What should you consider when prioritizing information and features across screens on a product?

Based on solutions and ideas from "Can you make it more prominent?" stakeholder phenomenon I decided to list out and prioritize each of the features on each screen in the product. Turned ...
0
votes
1answer
32 views

How to correctly position data that has additional formatting for context

I'm currently working on standardising how read only form data is displayed. Right now, it can be stacked labels and values OR label left, value right. My preference is to go for the stacked view and ...
1
vote
1answer
31 views

Content presentation pattern name and known usability cons and pros

I am currently designing a long product page; usability testing shows that the monotony and the high homogeneity of the page represents a findability, legibility, and overall experience blunder. We ...
1
vote
1answer
77 views

What is this table format called?

What would you call this type of table row layout? (This is from Mailchimp's email campaign manager section.) It's not a traditional data table, since it combines about 6 pieces of information in ...
-2
votes
1answer
221 views

Portrait vs Landscape Mode [closed]

Portrait & Landscape layouts - What is the UX guidelines for making two distinct layouts i.e. where the layouts will be significantly different from each other.
1
vote
2answers
77 views

Name for flexible view-based layout like in Photoshop, Eclipse, Blender?

Is there an established name for the visualization and interaction based on movable views as in Photoshop, Eclipse, Blender, etc.? I refer to: a screen with some global controls onto which a set ...
1
vote
1answer
234 views

Should expanded search tools collapse automatically after searching?

We have a page with a list of elements and a hidden advanced search panel that slides down after the user clicks a button. With the advanced search panel hidden, the user will see two rows of results (...
1
vote
2answers
127 views

What layout for a nearly empty web app? [closed]

Context I am designing an ad hoc enterprise web app that is very simple: given two parameters (year, month), click a button that generates and let you download a file (an Excel spreadsheet). Users ...
3
votes
2answers
61 views

Requesting break down data for an amount or number

I am developing a page that allows managers to select teams and individuals needed for a project. When selecting a team, each employee within that team is shown with their known skills. Once an ...

1
2 3 4 5
17