Team page layout and style updates

[qvm1Wak]

Hi Team Dash,

Here's a patch to update styling on the team page.
Existing page
With design updates

The PR touches the following things:

• Enlarged images for better visual balance
• The desktop grid for the page is now four-up for more density
• Changed each person's contact details to icons
• Resized font for each person's name and title
• Updated the smallest responsive breakpoint to fill better on phones (fix)
• Added Font Awesome

Some questions and concerns I had while working on this:

• Four-up or higher density display. I think on desktop we could show up to eight people side-by-side, but four seemed okay for now.
• I considered adding tabs or buttons to toggle between different groups of people
• It could be good to have a "Join us" CTA which links to a careers page.
• We could emphasize certain members of the team visually, drawing attention to people like Ryan Taylor, Andy Freer, and Evan Duffield perhaps. I'm actually not sure who. We could have a row of three items, breaking the grid for emphasis and allowing for larger images.
• We should eventually make the photos consistent and more professional. Professional clothing, nice background, high-resolution, and well-lit photos would be nice.
• It seems good to keep the keybase identities listed. For now I've collapsed them behind a key icon. Maybe we can add a tooltip for clarity or find an actual keybase icon.
• Adding emails could lead to spam for those people, other team pages don't seem to do this. We might consider removing them.
• Adding Font Awesome or another icon font
• Adding the font through npm or via file download (I downloaded it and added it to the repo)

That seems like a lot for now. The changes are visually tested across all screen widths on Firefox and Chrome latest. If things go well, I'm happy to contribute some more changes. Feel free to steer me in different directions or put me in touch with a visual designer.

Thanks for looking!

Steven

[mrleewong]

@qvm1Wak

Hi, Steven

The first of all:
Very nice suggestions indeed, thanks for collaboration.

I just looked through your PR and here is my thoughts:

• I'd like to keep tiny images for awhile. It's not an easy to get better resolution photos from all of us at the same time. Once it's done we will replaced with new ones.

• There is typo error in twitter icon class fas fa-twitter. You can see the result of that on screenshot that you provided :)

• .icon class could be more specific, because it will replace all styles for icons that could be added in future, especially when we are using !import.

• Would be great to have some hover effect on icons. For example 10% lighter or something like that.

Also, good catch with "Join us" button, I will replace this link to specific email and then to the "careers page"

[mrleewong]

Please see my comments :)

[qvm1Wak]

Hi @mrleewong,

Thanks for catching my missed details. I made a few changes to the things you mentioned.

---

I had some stray thoughts about getting photos from people. Please ignore if I'm being impractical here.

One of the main reasons I looked into the team page is it's the first place I look when evaluating cryptocurrencies and software teams. Dash has a bunch of smart people, but the page just needs some polish.

With crypto, there are a couple ways I think you can go:

• Appeal to the finance side: people wear collar shirts where they can, images look professional.
• Appeal to the hacker side: the page is smart/fun/quirky, but probably still polished and professional.

I don't think it's feasible to send around a photographer to get everyone's photo, so instead we can ask people to supply their own photo.

We could require something like the following specific rules:

• try to emulate Chuck, Evan, or Darren's "photo in front of a nice tree".
• photos should be:
  • face-lit
  • have enough torso and space above head that we can crop them for consistency
  • +300px wide resolution
  • a collared shirt or suit (for the execs/biz-side)
  • good grooming: haircut, clean face
  • everyone must be holding a gun for consistency (just kidding! :P)

We can probably make a little uploader for people to use. I'm happy to keep track of this if you're open.

Thanks for the notes and kind words!

[tungfa]

agree with MrV
tx qvm1Wak