Website Visual Design

[troyhunt]

What's there isn't terrible and it's worked, but like everything else, it also hasn't done anything for a decade. To my eye at least, it's become a bit flat and uninspiring. I'd really like to breathe some life into it and with that will inevitably come new markup and CSS.

This is obviously also tied into the discussion around modernising the logo and the two should be complimentary. My inclination is to keep the dark theme and blue gradients but give it a real good freshen up. Any suggestions design wise?

[neilcaldwell]

How about some snazzy graphics like a globe [ideally with latest breach locations, or user lookup locations] or an encrypted background when the search box is moused over?

aceternity UI github globe

aceternity UI evervault card

Inspired by beyond fireship

[yousefebrahimi0]

1. I think one or two sections are needed for some new (amateur) users to know more about the information, like
   "How you can deal with data leaks now" and "Frequently asked questions", ideas come from:
   https://www.f-secure.com/en/identity-theft-checker

2. After searching and some pwned found, at the end of "Breaches you were pwned in" it would be great to have some solution for the user like now you need to change your password or .... there are good tools to check your strength of your new password or check these pricacy focused password managers. Giving some solutions in general.

[troyhunt]

Yeah, totally agree with you there, we've gotta give a lot more info to the masses. Check out PR #16 that has some screen caps in it; we're gradually heading in that direction with the "recommended actions" section. What we're thinking is that for each and every data class we add a specific action. This could be "change your password" or "contact your bank" etc, but also a dedicated page like F-Secure's could be good too.

We're also thinking about plugging into 2FA directory to show an indicator when the breached site supports a second factor: https://2fa.directory/au/?q=dropbox.com

But I don't like password strength checkers: https://www.troyhunt.com/password-strength-indicators-help-people-make-dumb-choices/

[ysfchn]

I appreciate the effort of re-designing the website, but after taking a look to it, it kind of made me feel uncomfortable. I have no complaints about its aesthetics only on its own at all, but I feel like the current website design is more "sincere", meaning it provides enough "sincerity" as much to make me feel like HIBP is credible and it is not some sort of typical data harvester website at a glance. But this new website in its current state makes me feel the opposite since it reminds me of a generic startup website. Not saying being a generic "startup website" is always bad, but I just don't think it does or should fit specifically for HIBP as a organization. I believe it at least could benefit from having a more distinguishing look if this is going to be final. I know the new website is far from complete, but since it appeared to me that it is going for "that trend" after coming from Troy's blog, I couldn't help myself to not point out my thoughts.

After all, it just resonated with me much more HIBP having a "old-school" website, or maybe it is just me because I'm got used to seeing HIBP website for years and adored the usability and simplicity of 90s websites in general (if not about visually appearing), so it would be hard to criticize objectively since I'm biased about this.

[troyhunt]

I think it's this:

maybe it is just me because I'm got used to seeing HIBP website for years

Something Mikael said very early on when designing the logo was that we'd need to see it many times over before it really stuck. It's a little bit of that and a little bit of Who Moved my Cheese; it's change, and change can take a while to get used to.