Project

General

Profile

Actions

Design/UX #14712

closed

Design/UX #13998: Homepage Redesign

Default avatar images

Added by Colin McDonald over 2 years ago. Updated over 2 years ago.

Status:
Resolved
Priority name:
Normal
Assignee:
Category name:
Public Portfolio
Target version:
Start date:
2021-08-12
Due date:
% Done:

0%

Estimated time:
Deployment actions:

Description

Sara had the great idea on yesterday's dev call to redesign the default avatar icons for members, groups and sites to match the overall new visual feel. I'm assigning it to her here, where she can ask for more feedback from the team and share drafts.

We also noted yesterday that the main icon on internal pages like this:
https://commons.gc.cuny.edu/groups/cac-community-team-project-planning/

These icons 150x150, so we'll need the new defaults to be at least that large, and we'll also be pulling the different sizes to different places on the new design where we might want to incorporate a bigger or smaller icon.


Files

5d64323757db0-bpfull.png (11 KB) 5d64323757db0-bpfull.png Colin McDonald, 2021-08-16 12:06 PM
Screenshot_2021-10-27_09-02-19.png (273 KB) Screenshot_2021-10-27_09-02-19.png Boone Gorges, 2021-10-27 10:02 AM
Screenshot_2021-10-27_08-57-45.png (72.3 KB) Screenshot_2021-10-27_08-57-45.png Boone Gorges, 2021-10-27 10:02 AM
Screenshot_2021-10-27_09-01-55.png (152 KB) Screenshot_2021-10-27_09-01-55.png Boone Gorges, 2021-10-27 10:02 AM
Screenshot_2021-10-27_08-57-19.png (171 KB) Screenshot_2021-10-27_08-57-19.png Boone Gorges, 2021-10-27 10:02 AM

Related issues

Related to CUNY Academic Commons - Bug #13994: Some Site icons missing on Site archiveResolvedRaymond Hoh2021-02-16

Actions
Actions #1

Updated by Raymond Hoh over 2 years ago

  • Related to Bug #13994: Some Site icons missing on Site archive added
Actions #2

Updated by Boone Gorges over 2 years ago

  • Target version set to 1.19.0

Tentatively putting this into the 1.19.0 milestone, in hopes that we can tackle alongside the homepage redesign.

Actions #3

Updated by Sara Cannon over 2 years ago

Avatar images 150x150 jpgs are shared in this google drive folder: https://drive.google.com/drive/folders/1izn1V4-kUz2OPlJw4t9FWvwE-E2Dxu0p?usp=sharing

Actions #4

Updated by Boone Gorges over 2 years ago

  • Assignee changed from Sara Cannon to Boone Gorges

I'll try to get this implemented in the upcoming days so that the team can decide whether the all-blue scheme is a good one.

Actions #5

Updated by Raymond Hoh over 2 years ago

I'll try to get this implemented in the upcoming days so that the team can decide whether the all-blue scheme is a good one.

I've already implemented this for user avatars :)

Check cdev for the change. Code is in wp-content/plugins/bp-custom.php. Haven't committed it yet. For the hash, I'm using crc32() on the email address and using the modulus of the numeric hash to get the random number from 1 to 5 to be used for the default avatar.

I had to upload the default avatar images to production at /blogs.dir/1/files/avatars/random/ so Gravatar could pick it up for display on cdev.

Actions #6

Updated by Boone Gorges over 2 years ago

Thanks for doing this so quickly, Ray! Let's try to get some eyes on cdev to see what we think. I've also attached some screenshots.

I assume we're going to use the same defaults for groups and sites as well, correct?

Actions #7

Updated by Matt Gold over 2 years ago

To be honest, the blues look fine to me. Happy to hear objections from those who don't agree!

Actions #8

Updated by Boone Gorges over 2 years ago

Ray, quick follow-up that I had to commit your change in order to merge with some other stuff.

Actions #9

Updated by Raymond Hoh over 2 years ago

  • File deleted (Screenshot_2021-10-26_13-30-38.png)
Actions #10

Updated by Raymond Hoh over 2 years ago

  • File deleted (Screenshot_2021-10-26_13-28-18.png)
Actions #11

Updated by Raymond Hoh over 2 years ago

I assume we're going to use the same defaults for groups and sites as well, correct?

Yeah, I wasn't sure what we wanted to do here. I assumed the opposite as I think groups and sites should have a different style since they are different objects.

To be honest, the blues look fine to me. Happy to hear objections from those who don't agree!

Looking at the screenshots a bit, I feel the two hues of blue used for the line and background are too similar. Perhaps we can either darken the line or lighten the background so there is a bit more contrast?


(Side note: I removed two screenshots that were not related to this ticket and meant for #13998 here .)

Actions #12

Updated by Colin McDonald over 2 years ago

I agree with Ray that we might want to consider a different color or treatment for groups and sites. Is it too straightforward to consider an orange and a green in the canonical Commons color scheme, one each for groups and sites? I think the lines look ok generally, but I'm open to other contrast as Ray mentioned.

Actions #13

Updated by Boone Gorges over 2 years ago

I think we definitely need to do something for groups and sites. The gravatar defaults don't fit the theme.

I'm sensitive to Sara's line of reasoning here. The purpose of avatars is to assist users in scanning lists and conversations. If the defaults are all the same, they become useless for this purpose. And having users all default to blue while sites default to orange (for example) doesn't help this. I'd be in favor of having 3-5 visually distinct defaults, and have all items (groups, sites, users) pull from this default set.

Actions #14

Updated by Sara Cannon over 2 years ago

  • Assignee changed from Raymond Hoh to Sara Cannon

I'm also in favor of having all items pulled from a default set.

I've played around with some new variants - you can see them here: https://share.getcloudapp.com/ApuERrBj

Files in Google Drive: https://drive.google.com/drive/folders/1G_G3cD9pzqy7rxHVHeNB4IEYLmOzRpcN?usp=sharing

Actions #15

Updated by Raymond Hoh over 2 years ago

I've updated cdev so groups and sites use the new default avatar set: https://github.com/cuny-academic-commons/cac/commit/08ed2e5611e0e98ca9090b1dc19a9b070080a4ed.

For members, the new image set may not be ready for some users due to Gravatar caching: https://meta.stackexchange.com/a/139673. So if you're seeing an older avatar, check back in an hour or so and hopefully Gravatar's CDN is updated by then.

Actions #16

Updated by Boone Gorges over 2 years ago

Seeing these new avatars in practice, I think they strike the perfect balance between variability and subtlety.

Actions #17

Updated by Matt Gold over 2 years ago

I heartily agree. Beautiful work, Sara!!!!

Actions #18

Updated by Boone Gorges over 2 years ago

  • Category name set to Public Portfolio
  • Status changed from New to Resolved

Going to mark this one as resolved.

Actions

Also available in: Atom PDF