We're debating on using regular checkbox vs checkbox buttons
I feel the regular checkboxes (first one) is a better choice. Visually, it clearly says that there's a choice to be made. Also, it's very easy to make it responsive.
Any thoughts/perspectives.
The buttons closely resemble other more well-known patterns like toggles and tabs which could cause confusion. Especially if multiple selections are allowed. Toggles and tabs do not allow multiple selections, and that's probably why the button bar doesn't read like it will allow it either.
They also resemble buttons, obviously, which is problematic in itself. Buttons generally signal some kind of action, not selection.
There are also all sorts of answers to a very similar question here: Alternatives to checkboxes and radio buttons in web-based surveys?
Based on the two design choices you have proposed, it might help to make a decision by looking at some other factors such as:
is this going to be applied on desktop or mobile views (or both)? They have different interaction patterns and spacing requirements (if those are going to be issues for designers or users).
have you applied similar design patterns elsewhere (for the sake of consistency)?
will this be applicable to other sections of the UI (e.g. will the button group work if you have more than five things to select from)? If not then will you use two different designs?
length of text appropriate for other items? I think button groups suffer from the fact that they are not suitable for long text whereas there are different alignments and groups you can do with checkbox groups
