Questions tagged [cards]
A bounded, self-contained element within the UI that signifies a tightly related set of information and actions.
118
questions
0
votes
1
answer
59
views
Alternative to using cards or tables for displaying different data/info
The problem
Our product currently uses a lot of data tables to show information to our users. We also have a lot of metrics and numerical data that we also display that is often clickable that filters ...
- 1
3
votes
2
answers
589
views
Double expansion option for a single card
I'm trying to work on a data card and its expanded version.
I want a user to access more details of a card body by expanding
There are children entity on a card where I also want user to access ...
- 121
0
votes
1
answer
93
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
5
votes
2
answers
2k
views
How do I handle white space in cards with varying amounts of information?
I'm creating this page to display books I've read/reviewed, but I'm not sure how to handle the different amounts of information that each card has. Most cards will not have a review so there ends up ...
- 53
4
votes
2
answers
115
views
Alignment vs. consistency in button space
Let's say you have a card that uses a gray area to separate buttons from content. Should the buttons try to be aligned with the content? (24px on left/right, 12px top/bottom)
Or should the left/right ...
- 12.8k
2
votes
2
answers
105
views
Does objects cause less cognitive load than tables
I have a feeling that if you make card view or similar object that represents an item from the real world, such as a 'car' or 'person', then it causes less cognitive load than a table view - except ...
- 125
1
vote
1
answer
262
views
Components in graph based UI with more complex interactions
Something that I noticed has become a feature of complex no-code software applications is the use of graph-like interfaces with more complex interactions such as the Unreal Engine 5 user interface.
I ...
- 27.5k
0
votes
2
answers
90
views
how to make card with more detail [closed]
How can I display all the information on this blood donation request card without cluttering the card's visibility on Stack UX? Additionally, I have a long text that describes the user's blood need, ...
1
vote
2
answers
141
views
Big form with blocks within blocks within blocks: how to improve or avoid this?
Apologies if this has been posted before.
I'm doing a visual rework on an existing webapp that's essentially a big form with a bunch of form fields, that are divided into sections, subsections, and ...
- 13
1
vote
2
answers
263
views
Carousel with focusable items
I have a carousel with partial display of the items on the far left/right. Every item has a button to open additional information under the carousel (the item then becomes "active" with some ...
0
votes
1
answer
122
views
What should be the order of icons in an accordion?
In the interface I'm designing, I'm using several cards that work as accordions (they can expand/collapse). Each card has a title, and next to it a " plus " sign. One particular card also ...
- 99
0
votes
1
answer
46
views
Section of Cards with Go to page option
I am designing the section of cards to show the status in the dashboard screen. I am showing only 5 cards, then I would like to provide the link to go to another page to see complete list of statuses.
...
2
votes
1
answer
66
views
Conveying that a card linked to a gallery has multiple photos instead of one
I'm creating a card view in which each card is linked to a separate view which contains either one photo or multiple photos. The resulting view is not necessarily a gallery, but more of an asset type ...
- 33
0
votes
1
answer
160
views
Visually distinguish cards in a list
I made an LMS webapp which, in the main page, shows a list of courses.
The page looks like this:
The goal of the app, from a graphical interface standpoint, is to keep an elegant material design look....
- 61
0
votes
1
answer
420
views
The Card Height Problem
You have a horizontal row of three cards on a page. There's an image, a header, descriptive text and a button.
How do you ensure all of the cards stay the same height if the content in each card isn't ...
- 1
0
votes
1
answer
505
views
Actions as icons on card
I'm looking for a way to properly display actions on my application's card without cluttering the interface too much, while still correctly emphasizing them.
My application allows teachers of a school ...
- 61
1
vote
3
answers
385
views
Presenting missing information on card
I have a multi-step form that requires filling in relevant details in each step. On each step we save the data. If a user leaves the form at any time, the draft will be saved and can be accessed from ...
- 146
2
votes
2
answers
731
views
How to avoid the use of nested cards
I am developing a school web app and trying to follow material design guidelines.
There's a functionality that allows teacher to create homework and in-class test models, wherein they can input a list ...
- 61
0
votes
1
answer
604
views
How should I design this, not sure if it's a container or card
I'm currently in charge of the design system and we have this component which I'm not sure if I can consider it a card, or should I just use the general term 'container'. I tried googling and results ...
- 53
1
vote
1
answer
421
views
Form with multiple rows of selectable options displayed on material UI cards, need help with adjusting the design
I have a form that has around 3 rows with selectable cards (only about 3 to 4 options each row). We do not have a UI/UX designer and I want to adjust the UI design but do not have a good idea about ...
- 11
2
votes
1
answer
186
views
How can I make it more obvious that a card view needs to be clicked?
We have a booking platform where users choose different types of activities to do in their area, But when users go to search page only 52.9% of them continue to activity page which made me think that ...
- 335
0
votes
2
answers
597
views
Horizontal scrolling or show more?
I'm working for a company and I have to make a section of a webpage that includes projects. They have 72 active projects and they want to show all of them in cards. The functionalities that include ...
2
votes
3
answers
545
views
How to concisely represent a set of statistics on a dashboard?
I'm designing a dashboard for a web app representing statistics related to a quiz/test.
I'm using visual aids like charts, icons and other cards displaying a small piece of information.
Each such card ...
- 123
2
votes
1
answer
674
views
Hover on a card with clickable links
I am working on card which has a clickable link/ clickable options but the card itself is not clickable. I want to add a shadow to the card when someone is hovering on/ clicking on the link. I have ...
- 1,035
1
vote
1
answer
83
views
Scroll time on SaaS
As is the case with most SaaS, there is sometimes simply too much data to fit on one section of a page. On the desktop app, we use a standard table view of data. On the mobile app, we use cards in ...
- 25
2
votes
2
answers
1k
views
For a list of 10+ cards, Should I use a CTA button on each card for a better conversion rate?
Should I use a CTA button on each card for a shortcut knowing that I have cards feed layout pagination for more than 10 cards?
For example if I have a projects feed inside a freelancing app here're ...
3
votes
4
answers
5k
views
Make it clear that a card is clickable
I am currently working on a Mobile Application, mainly using Material Design, with some client-specific adaptation.
On our project, we display a list of cards, each card having a varying number of ...
- 33
0
votes
3
answers
552
views
Benefits of displaying information in a grid of cards over a table list?
I can appreciate that using a grid of cards is useful when there are pictures or graphical information to display. However, are there any other pros/cons of using one over the other to display a large ...
- 33
1
vote
1
answer
84
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 ...
-1
votes
1
answer
54
views
is it better to keep the layout of the lists?
I have an application that manages several entities, each entity has a list page, each entity can have a child entity with its own list page.
Are you using different types of lists? table, cards, ...
2
votes
1
answer
6k
views
Card with Button or Completely Clickable Card
If a card has a button, the CTA will be clearer but it'll be more useful from usability point of view if the card completely clickable.
So in mobile, will a card with button or a completely clickable ...
- 196
1
vote
1
answer
81
views
How to decide what information should I place on the item card? [closed]
Imagine you have to design an app that will help users in ordering food from the restaurants. You make an order and go to "My orders" where you can see a list of your orders from different ...
- 11
1
vote
1
answer
150
views
What is the best way to combine a dismissible card with a collapsible panel?
I'm working on a checkout flow where a cart summary panel appears on the right hand side of the checkout form. We want the user to be able to remove a product, but due to legal and compliance reasons ...
- 61
0
votes
1
answer
77
views
Cross-platform mobile pattern for navigating among, editing, and creating cards
I'm a backend dev (mostly), very new to UX. I'm building a mobile-friendly Progressive Web App that allows users to view and edit cards with a few attributes (discussions: title, image, description, ...
- 469
2
votes
1
answer
500
views
Nested Cards on mobile
I've come across many good nested/hierarchical data on mobile, problem is they often only include one line of information.
I'm looking to include more information than just a card title, so I'm ...
- 95
2
votes
3
answers
222
views
What is the terminology, UI name for readonly field value?
What is the terminology of the following UI elements in this screenshot?
John Doe
https://www.facebook.com/john.doe
Principal: [email protected]
...
These UI elements are readonly field values; ...
- 123
0
votes
1
answer
63
views
Is there a name for a "Card with window/cutout" UI element
I have an app with a lot of card UI elements, they work great to organise data in categories. However, I am running into issues when I have a lot of data that I want to arrange in multiple columns. I ...
- 101
1
vote
1
answer
124
views
Display large chart inside a card in a Dashboard
I'm going to design a Dashboard, I know how to show the information but my client said to me that a cohort chart is going to have a lot of information. I wonder if it's ok to add to the card that ...
- 11
3
votes
1
answer
569
views
Mobile card carousel navigation
Background
We are currently using a standard mobile pattern to showcase 3 cards where users can compare different plans.
Problem
The cards are very text heavy and contain alot of content below the ...
- 61
1
vote
0
answers
41
views
Layout for many independent navigation in a section of a webapp [closed]
There are many sub section in my project and I am not able to find right pattern for the layout the user navigates into the section from side navigation bar and then there are close to 25 sub sections....
- 590
1
vote
2
answers
279
views
What is the best practice to apply the card design in webpage? [closed]
I have a question in terms of the card design style as I was designing the website for a company.
Basically, I noticed that other company's websites apply card design on their website. Like to ...
- 56
1
vote
1
answer
74
views
How can we change Call to actions on a card without making user learning process harder and longer?
We are designing a new dashboard for our platform which user request on some service and our providers submit offers for user requests.
when a request submitted by a user, He should wait until service ...
1
vote
1
answer
352
views
Using cards as navigation to other cards
I am trying to become good at web design, but feel I am missing that 'visual eye' that so many of you have.
The general flow of what I'm trying to make is a top-level subject (ex. Math), will bring ...
- 11
1
vote
2
answers
173
views
Userflow for questions based on answers on inspection app
I'm working on a mobile application to help technician to make inspections. They have a lot of question for each task, each question is about an item inspection. When the answer is positive no ...
- 13
1
vote
1
answer
11k
views
Managing different sized contents in a card
How to manage different size of contents in a card, keeping the card size same?
- 111
1
vote
1
answer
102
views
Should allow upload file in the same page or a new page?
I am building a web site where students have to do their homework online.
I have a page that shows a list of cards , every card represent a homework.
On every homework the students have to upload ...
- 111
1
vote
1
answer
420
views
How to display summary of user permissions from a data table into a row [closed]
I have a summary card for a web-based application which expands into an interactive table that consists of different users and permissions from Custom to Read, Write, Deploy, etc. There will be ...
- 11
0
votes
4
answers
810
views
How to utilise empty space in card list design?
My website's main page displays summaries of users' profiles. Each profile summary is encapsulated in a "card".
Take a look at an example here (using dummy data).
For reference, the card width is ...
- 103
2
votes
2
answers
1k
views
Button placement in the footer of card layout?
Should the button be placed on the bottom left corner or bottom right corner in the card layout?
I was referring to Google's material design I found out that action buttons are placed on the bottom ...
- 2,511
1
vote
2
answers
149
views
Adjusting information inside a card visually
Context
Currently, I'm working on Product Listing page of a web-store. Products shown on the web-store can basically be rented out and we have defined rental prices for different time duration such ...
- 1,819