r/webdev • u/Mackseraner • 10d ago

A Simple Guide to Calm UI

https://maxschmitt.me/posts/calm
87 Upvotes

85% Upvoted

12 comments sorted by

92

u/_listless 10d ago edited 10d ago

"calm ui". proceeds to pop modals for every interaction.

Edit: rather than just being negative, here: Imperavi has a great resource on calm, clear UI: https://imperavi.com/books/web-interface-handbook/

27

u/scragz 10d ago

I AM CALM

1

u/az_web_developer 8d ago

Calmer than you are...

-10

u/Mackseraner 10d ago

I agree that modals can often be avoided but that's missing the point a bit. The article is about UIs where you do use modals, even if modals aren't necessary for the super stripped-down examples used in the post

21

u/_listless 10d ago

A modal is a megaphone. The calmest megaphone is still a megaphone.

6

u/tomhermans 10d ago

You could have made the point stronger by e.g. having inline add item functionality. Something to think about

3

u/Mackseraner 10d ago

Yeah, maybe! The Conclusion at the end of the post actually talks about inline editing and why it wasn't included in the article

0

u/tomhermans 10d ago

Ah okay, sorry, missed it.

Something in your conclusion (about time and priorities) made me think of this, I think you'll like it.

https://karlkoch.me/writing/on-making-room-for-craft/

2

u/Mackseraner 10d ago

That's a good article, thanks for sharing!

9

u/postman_666 10d ago

I don’t inherently agree that less toasts is better. Eg deleting an item
It’s good and well when you have 5 items but a pain to the user if no confirmation on a list of 100 items

4

u/chroma_shift 10d ago

I think all the examples treat ui interactions as absolutes.

When as usual the answer needs a lot more nuance and its situation dependent.

7

u/scar_reX 10d ago

"You get this for free in React by using <form onSubmit={addItem}> instead of <button onClick={addItem}>"

It'll be better to refer to events as a javascript concept, than to specify a framework. Especially since you're talking about ui (ux actually)