search

responsible-ai-collaborative / aiid

The AI Incident Database seeks to identify, define, and catalog artificial intelligence incidents.
https://incidentdatabase.ai
Other
170 stars 35 forks source link

Card nesting and borders #970

Open lmcnulty opened 2 years ago

lmcnulty commented 2 years ago

The current landing page has nested cards. E.g.

The user in the think-aloud #902 found this confusing. In the above case we should probably find a way to make the nested card into a single card containing the blog post title and the "latest blog post" label.

It may also be an issue that cards, text inputs, and table cells look almost the same in our current design language. In the below case, it would be possible to interpret the "Report URL" input as a very wide card containing a label. Probably no one will actually make that mistake, but it probably increases the required mental processing enough to bother the think-aloud user. I think this could be improved if we made the text inputs more distinct – e.g. with a background color or inset box-shadow. This will probably go along with the Tailwind migration.

image

Table cells also look similar to cards. This could be fixed by giving each row an alternating background color (which is almost always a good idea anyway).

lmcnulty commented 2 years ago

This is partly addressed by #1047.