A design approach that delivers elegant user interfaces regardless of the size of the user's display or the limitations of the device.
5
votes
2answers
101 views
How to present a wide chart on mobile devices?
I have a big chart which, by its nature, needs quite a lot of horizontal space. This is an example: I'm having troubles finding a way to present it on mobile devices. While I could find a way to ...
0
votes
2answers
56 views
Implementing different levels of drag/drop functionality?
I'm working on a tablet app for a motel. Initially, the app was going to be tested on one floor. Essentially, the app would be used to move guests from one room/bed to another room/bed. As you can ...
1
vote
1answer
16 views
Usable field type for date of birth on devices
I have a question about what kind of form input needs to be used to provide the best experience for date of birth field on mobile devices..I have tried to use the device specific native spinners. The ...
0
votes
1answer
51 views
Pavination Vs. Infinite Scroll in Datagrids
Pavination Vs. Infinite Scroll in Datagrids Are there any research findings or papers or usability testing findings on Pagination Vs. Infinite scroll in a datagrid. I am trying to define UX patterns ...
0
votes
0answers
14 views
Viewport size design methodology versus responsive design approach
Lots of new CSS features are allowing designer to implement viewport unit size typography and images, but I am wondering if these types of features are in common use and if we should be moving from ...
1
vote
5answers
70 views
Handle responsive images
I have a web page where the users can sell their houses. They can also upload multiple images to make a carousel to show the house's images. The problem I'm facing is to decide whether or not to use ...
1
vote
2answers
40 views
mobile view of a wizard
I've got a wizard as given in the following mockup. download bmml source – Wireframes created with Balsamiq Mockups What would be an appropriate way to make this wizard mobile friendly. ...
0
votes
0answers
33 views
Any alternative to responsive autocompleters?
I'm working on a responsive web app form which contains more than one autocomplete fields. I don't quite like how the autocompleters work in mobile when is not in the top of the screen. When you edit ...
0
votes
1answer
67 views
Inline or modal dialog for responsive filters?
I need to filter a large list of items in a responsive web app. I'm working on two different approaches: A) Filters open in a modal dialog. In small screens, it would open taking full screen. B) ...
0
votes
0answers
20 views
How to integrate blogging into an existing one page portfolio site and keep it usable
The one-page portfolio site in question is based on the Bootstrap Freelancer theme: a responsive, one page theme with a home, portfolio, about, and contact section. I currently have a blog section ...
0
votes
3answers
45 views
User Group Assignment Layout
I have a UI that allows admins to manage what groups a user is in. Currently the list of groups are listed as columns in a grid, stacked horizontally, and the list of users are stacked vertically. ...
0
votes
1answer
61 views
How to make pixel perfect wires frames for responsive site?
I apologize if this question seems rudimentary... I've been doing UX work for just a bit of time and I have typically provided wires that gives the designer guidelines, but offers them creative ...
1
vote
1answer
91 views
Showing Bootstrap Buttons on mobile device [on hold]
I am interested in learning about designing for mobile websites. Right now, I have a webpage with a bunch of bootstrap buttons ---------- Header --------- ...
1
vote
2answers
97 views
Name of the interface?
What is this kind of interface called? Moreover , it'd be a great help if someone tells me the application/environment which would help me implement such kind of interface best.Carefully note the plus ...
0
votes
1answer
84 views
Responsive design approach
Mostly I am using bootstrap for my website and I keep it pretty responsive. However some of my pages are hard to adjust with media queries. I have a size limit 769px for mobile. Is it a acceptable ...
0
votes
0answers
43 views
Responsive layout standard for table layouts
Currently I am working on Enterprise layout wherein material design cards that are pretending like tables. I started of UX design for first hand screen flow with 1280 x 1024 to showcase how the ...
0
votes
0answers
34 views
Responsive complex page - compare bundles and detailed bundle
I'm working on a product page. User can choose between 3 bundles and each of those can be customizable. I'm wondering what is the best UX approach to show these data and minimize the UI complexity. ...
1
vote
1answer
90 views
Is there a best practice for alignment of nav bar content - with grid or not?
Looking at various site's nav bars I see some sites spread their content wide across the bar, anchoring their logo to the far left and login to the far right, navigation in the middle (examples: ...
1
vote
1answer
110 views
Responsive design for a suggestion/toolbar
In this software a user can enter a query and the system produces an image or an output. Attached to the output is a toolbar that modifies The output based on user input. however with the current ...
14
votes
5answers
909 views
Why do very few e-commerce websites use full-width and fluid layouts?
Looking at some of the top e-commerces websites (Flipkart, Etsy, Amazon, Bestbuy) , I could find that only amazon utilizes a full width layout, and that too isn't fluid. While I understand the ...
3
votes
3answers
166 views
Responsive sidebar sub-navigation
We're working on a new, responsive version of a large website and need to support the main navigation and sub-navigation that changes based on the department. Below is a mockup of how we are ...
0
votes
2answers
155 views
Two Color Progress Indicator
I'm interested in any examples of a two color progress indicator. The user will be looking at a web page consisting of a list of reports that are a combination of approved reports and reports pending ...
0
votes
3answers
147 views
Grid with cards
I want to create grid withs cards that looks like on photo, every card have text in it. What would be better to make , all square or rectangular cards ?
1
vote
1answer
109 views
What's the best way to implement a search bar in the mobile view of a responsive site?
I'm currently working on a site that is content heavy and want to add FAYT (find-as-you-type) search. In the desktop view I have a regular search field in the top right hand corner with a magnifying ...
2
votes
1answer
79 views
Best way to stop a navigation from wrapping by changing design?
Didn't know whether this was a UI or a UX issue but I have been asked to change our header section so that the navigation items don't wrap to a second line when the user views our site on a smaller ...
2
votes
0answers
83 views
Any good presentation examples on why minimal + responsive design is a good approach for a website redesign? [closed]
I am making a presentation on responsive design and minimal design. Would be catered towards more elderly or less technical coworkers and stakeholders that do not yet know about this type of design ...
3
votes
1answer
115 views
Very complex responsive navigation
I'm working on a redesign project that has a complex navigation, especially in the case I have to make it full responsive. There is a navigation bar to go to several section of the site. Each section ...
10
votes
5answers
684 views
Tabs design pattern, solving for “N” tabs
I've seen many design patterns that help solve different content presentation issues by leveraging "tabs". Assuming I do want to display grouped content on a page (complex content or simple) and ...
6
votes
2answers
162 views
Why should I use em, and not % for fonts?
If ems essentially give you a result that is a percentage of the base font, what advantage is there to using it, rather than % for font sizing? I have looked around, and haven't really seen anything ...
41
votes
5answers
3k views
Should iOS native app be distinctly different than the responsive website's mobile version?
I was in a training session, where a room full of designers were learning iOS prototyping in Xcode, and there was an individual there who came from Apple to make sure everything in the course was done ...
1
vote
1answer
156 views
Displaying Master/Detail Panes/Linked Lists
I'm trying to determine what the best approach is for displaying a master/detail list. I've taken the approach where the details are displayed in a pane that is adjacent (to the right) of the master ...
1
vote
3answers
157 views
Which navigation pattern to use
We are currently working on designing a Responsive Web Site for a very niche market. The user base (elderly) would be using this site purely from content consumption - reading perspective more than ...
0
votes
3answers
289 views
Booking Calendar UX/UI - Approach
I am attempting to think a responsive design for a booking calendar which allows booking of available slots. In general, calendar UI's have time of the day as a vertical arrangement and days of the ...
0
votes
2answers
137 views
Responsive images for 3 different types of screens : Is this a good design?
Above image is a wireframe layout of my portfolio website. The navbar is at the bottom while the 2 images fill the remaining screen. The left and right picture will be contained in their own DIV ...
1
vote
2answers
217 views
Pane vs Modal vs ?: Across all screen sizes
Pane vs Modal vs ?: Across all screen sizes I am currently working on a web application that needs to be responsive, accessible, and provide a solid UX across all device screen sizes. We currently ...
2
votes
2answers
158 views
Optimal way to display long radio buttons on mobile
I'm working on designing a responsive form, and I'm wondering if anyone has ideas for dealing with "long" radio button options on mobile. For example, take the following image: I've browsed around ...
0
votes
2answers
463 views
What is the “desktop” alternative for a material design full-screen dialog?
The material design spec for full-screen dialogs says the following about full-screen dialogs: Mobile only: Due to limited real estate on mobile devices, dialog content appearing in other form ...
1
vote
3answers
80 views
Responsive design for sidemenus
I have a website that was designed to have a side menu running along left side of the screen from top to bottom. Works great, looks great, but I'm having some issues when it comes to making it ...
1
vote
2answers
253 views
Data Display of Tables: Table Cells with Must-See Values
I have a data-driven web app with horizontal resolution limit of 1280px, yet up to 15 columns (table cell data varying between 0-255 characters). I wouldn't like to display data on multiple rows as it ...
1
vote
2answers
68 views
For Wide Display Should Main Content be Centered or Left?
I am confused on how the main content layout should be on a wide screen monitor. So should I keep my main content on the left or middle? Since I have read many places that content should be on the ...
1
vote
1answer
51 views
How to create interfaces in a graphics editor for responsive grid systems considering that they aren't pixel-perfect? [closed]
Any responsive CSS grid system uses long decimal point percentage values for columns' width (e.g. "16.66666667%"). I don't understand how to lay out the grid in Photoshop, because elements of the ...
0
votes
3answers
123 views
How to accommodate more items in the same UI
I'm looking into a change request from a client which requires the following. Have a look at the visual below. The clients would like to be able to show more then 5 of the blue boxes (these show ...
4
votes
2answers
138 views
Should a responsive sticky side menu stay sticky at high resolution?
We have a website/app that has a side menu that sticks to the left side of the screen (see mockup below) It is a responsive site, so when accessed on higher resolution screens (or if the user zooms ...
1
vote
2answers
142 views
How to transform desktop UI to smartphone UI?
I have a live demo here, based on HTML, CSS, JS and Metronic. It's currently planned to be displayed on desktops, yet it's quite responsive (a little bit...) and I'd like to convert it to be displayed ...
1
vote
1answer
113 views
Truncation vs. Wrapping text when designing for responsive page for multiple devices - which is better?
For a ready only form that is also designed to be responsive, some fields are long and some short. Currently, the default behavior is truncating long fields based on the space constraint. And on ...
-3
votes
3answers
75 views
Should i use a mobile theme or responsive theme for my fashion store? [closed]
I have a fashion store, then I decide to buy a new theme for my store. I am wondering whether to buy a mobile theme or responsive theme. I know a mobile theme is more fast loading and simple than ...
1
vote
4answers
96 views
Should you design for the transition period of resizing the window
The big trend (rightly so) in web design right now is making your website responsive. Meaning that your pages will look good on any size screen. As a ux/ui developer I always initially test my pages ...
0
votes
2answers
96 views
How can I show a row of dropdown menu's in mobile
A brief introduction : Lets say in this web app the user is asked to upload an image. The resultant page will contain the image with a row of dropdown menu's to select from and a final submit button ...
0
votes
6answers
217 views
How many mockups do you typically do for a responsive bootstrap design?
I am scoping a responsive project and thinking it will need views spanning from mobile to desktop. I am just wanting to confirm if it is necessary/helpful to do mockups for all 4 sizes (Extra small ...
0
votes
3answers
136 views
Icon to request device rotation [closed]
Is there an existing icon that is recognized as a request / suggestion that a user rotate their mobile device? I am converting an OLD website to be more mobile friendly. (responsive) I have existing ...
