ui design ideas

So I posted 2 picture , in that picture I added a skeleton ui for days rendering , i added month based rendering from backend and it takes something around 100ms something , but my question is should I add this skeleton ui for this calendar this looks odd like egg crates or just remove or a loader ?
No description
No description
2 Replies
Anurag M
Anurag Mβ€’2mo ago
I don’t think you really need a loader here. It might be better to just wait until the data is fetched, then show the calendar with a smooth fade in. That way, the experience feels much smoother and more polished 100ms isn’t a long wait, so a loader probably isn’t necessary in most cases. But if the network is slow and it takes over 300ms, you could show a simple spinner in the center as a fallback
Chooβ™šπ•‚π•šπ•Ÿπ•˜
What is actually being loaded in that 100ms? Is it just the day numbers or is there information about events on specific days that changes how that day is rendered? If it's just the numbers, you only need to send over year and month. All the numbers can be computed on the front end. If it's event data that alters the presentation of the days, you can precompute the numbers and alter their appearance when event data arrives. To indicate that event data is being fetched, you could do something like fade in and out all the numbers until all event data has arrived. Or you could have an additional message like "fetching events" or something similar but have the whole calendar without events already present.

Did you find this page helpful?