0

Which is the best way to treat no data states for table?

For context, this is a table that appears at the bottom of a form. Users can fill in the info, then add some records into the table.

mockup

download bmml source – Wireframes created with Balsamiq Mockups

VS

mockup

download bmml source

I'm at a cross roads with another designer. I'm more in favour of the latter bottom solution since it is simpler and cleaner and provides a way to help the user along.

My colleague is more preference for the former since it provides the sense that there's an empty table there so you should fill it. I think he's thinking affordance maybe? Or some sense of "Nature abhoring a vacuum" that the behaviour he is expecting is for users to want to fill this table?

What do you guys think? Open to any other solutions as well here.

  • I perfer the second one.User get a direct tip, not a blank table with thinking what to do next. – user87495 Jul 15 '16 at 1:43
1

There's a lot of articles to be found about empty states.
Example

I think all articles will concur with your second example and I agree.

Designing for the empty state is not just about filling empty space. It's about telling the user about what to do.
Showing an empty table might confuse users. Some might know they have to fill that table, but other might totally overlook the 'add entry' button.

As you might read in some of the articles, it's also a useful onboarding strategy.

I've only heard about the effectiveness of vacuum or emptiness to entice people to fill it in text inputs. This was in a discussion about "placeholder, yay or no". It stated that keeping an input blank with an inset shadow will make the user want to fill it. I'm not totally against placeholders, just not as the alternative to labels. But I see how vacuum can work in this case.
Your case however...

Just google "designing for empty states" and let your colleague read some of those articles ;)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.