User Coloring

[curran]

The problem of coming up with colors for users is an interesting one. There are tradeoffs. I'm opening this issue to externalize/organize some thoughts from conversations with @houshuang.

Goals:

• Application code can specity a desired luminance, so that the colors contrast well enough with the background (could be dark, or light).
• Each user gets a unique color that's differentiable from other users.

Open questions:

• Should the color be the same for a user across clients?
• Should the color be the same for a user across sessions?
• Should we favor the ability to differentiate users in a single client, or globally unique and persistent colors for each user?

I've protpotyped an idea for a solution, which maximizes the distance between colors (hues) for a fixed set of users (only 5), and allows application code to specify a fixed chroma and luminance:

// Colors for names. Fixed chroma and lightness, varying hue.
const colors = names.map((name, i) => hcl(i / names.length * 360, 90, 35));

If we can come up with a function that can map user name/id to a hue, we could assign each user a "permanent" hue. This would satisfy consistency across sessions and clients, but also runs the risk that two users may have very similar hues.

We could also have some tolerance for varying across luminance and chroma as well - maybe intervals of acceptable values (to avoid poor contrast).

[curran]

I was researching hashing algorithms, and I think we can generate an integer between 0 and 360 for hue (with nice properties regarding distribution and collisions) like this, using @emotion/hash (Murmur hash):

const hue = parseInt(hash(userId), 36) % 360;

[houshuang]

Wonder if there is any research on the maximum number of colors which are both all usable for text for example (ie. dark enough on a white background), and all easily distinguishable from each other? The higher this number is, the more useful a hashing function will be.

On Tue, Apr 16, 2019 at 4:26 PM Curran Kelleher notifications@github.com wrote:

I was researching hashing algorithms, and I think we can generate an integer between 0 and 360 for hue (with nice properties regarding distribution and collisions) like this, using @emotion/hash https://www.npmjs.com/package/@emotion/hash (Murmur hash https://sites.google.com/site/murmurhash/):

``js const hue = parseInt(hash(userId), 36) %360;

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/datavis-tech/json0-presence-demo/issues/5#issuecomment-483682892, or mute the thread https://github.com/notifications/unsubscribe-auth/AADwh0-oXg07uJKIRBViglWFPymYk64nks5vhd2qgaJpZM4cxgPK .

-- http://reganmian.net/blog -- Random Stuff that Matters