Questions tagged [material-design]
Material Design is a design language developed by Google. Based on the paper and ink metaphor, the framework is characterised by the use of 'cards', grid-based layouts, responsive animations, transitions and depth effects such as lighting and shadows. "Material is an adaptable system of guidelines, components, and tools that support the best practices of user interface design." (Material.io)
15
questions with no upvoted or accepted answers
5
votes
2
answers
858
views
Android TabStrip navigation alternative on iOS
I am in the process of porting my material design Android app into a native iOS app with Swift. The two apps are very similarly navigated, and share many design features (a mashup of iOS design and ...
- 151
2
votes
2
answers
155
views
How to indicate selectability in an information-focused list
My first question, let me know if I should edit!
I'm working on a list-map hybrid, where each item on the list can be selected, to show up on the map (like Yelp).
The list needs to give a fair ...
- 146
2
votes
1
answer
99
views
Material design edge-to-edge chips field error display
The material design spec for text and chip fields says that errors should be displayed below the field
In the case of edge-to-edge chips fields (like those at the top of the chips page: https://...
- 253
1
vote
1
answer
80
views
Persistent Rich Tooltips
Material Design has rich tooltips which can also be persistent. As it's explained here, these tooltips:
remain active even when leaving the target region
can contain links
only disappear once you ...
- 145
1
vote
2
answers
50
views
Signify that some input controls map to private information
I'm developing an app meant to be used by a school; user personas are teachers and students.
Teachers can add exercises to the app database through an editor. Some of the fields of an exercise are ...
- 63
1
vote
1
answer
1k
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 ...
- 79
1
vote
3
answers
245
views
How to show pre-filtered list on a search results area
I am working an iOS app that manage employees requests,
I have a screen that shows requests, and a search field above it, I can search within my requests.
but, I can also send a push notification with ...
- 1,010
0
votes
1
answer
90
views
What UI elements do you use to display information in real time?
If some string like "Now executing cronjob...", "REST call made", "Authorization successful", "Cronjob complete", etc. need to be shown every 1-2 second, what ...
- 157
0
votes
0
answers
39
views
What should a toolbox look like?
I am making a dashboard application that allows you to execute and debug cronjobs. I give the users the ability to drag and drop elements in an UI. I need to create a toolbox that contains 15 action ...
- 157
0
votes
2
answers
217
views
Rationale behind the Material Design (M3) color system of interaction states
According to the documentation here, interaction states (hover, focus, pressed etc) are represented by overlaying an additional state layer on top of the container:
The state layer is an overlay with ...
- 101
0
votes
0
answers
49
views
Delicately combine Material 3 Text-fields and buttons
How do I get a "pure" Material 3 login screen to look good. What I don't think looks good is the height on the Text-fields and buttons are not the same, and the filled button have more ...
- 101
0
votes
1
answer
255
views
Material Design | Dialoge from floating action button - how to do it? Is it even a good idea?
I'm designing a dark-mode-first desktop website for an online media organization.
One of the key characteristics of the organiation is its community, and how open, friendly, inviting and communical it ...
- 101
0
votes
0
answers
96
views
Designing android apps: Material design and apps with own character
I'm new to mobile app development. I came across material design and its guidelines even though I just scratched the surface. I basically am curious how strict the guidelines have to be followed to be ...
- 101
0
votes
3
answers
725
views
Material Design the correct way to work with primary and secondary action in this case
Today I've got a question about the correct way to use material design in a "UX way" and in a particular case.
I'm working on a desktop interface with a sidebar on the left that control main focus ...
0
votes
5
answers
601
views
Guidelines for Material Card in Android
If I were to follow elevated card(first one) like here, where should I place the expand more arrow? Also, is it okay to do the same card with image on the left?
Cards displayed are different brands ...
- 1