Skeleton Screens

Thursday 29th November 2018

I have been thinking about some extra features I want to build into the design. I read an interesting article on medium recently about the importance of skeleton screens by Bill Chung.

So what are skeleton screens? For those that don’t know what they are Chung says has this to say about them in his article; “Skeleton screens are blank pages that are progressively populated with content, such as text and images, as they become available (i.e. when network latency allows)”.

I have listed a few examples below on very popular websites. You might not have even noticed these until seeing the screenshots because they only last for a split second in most cases.

These screens are proven by research to make the website seem to load faster when in fact, it has loaded at exactly the same pace but the user just doesn’t see a white screen.

The screens can also be animated, for example, Facebook uses a shimmer like animation over their screen to make it seem like the content is loading quicker.


Final Thoughts

I am not entirely sure this is needed for the stage I’m going to be taking the app as it is in the prototype phase and images will load pretty quickly on the prototype. But might be nice to integrate for a few milliseconds to show that I have considered it.

Nathan Patton

Interaction Designer

46.356995, 14.082128