Robohash is fantastic. I have been using its output as my personal avatar for years now. Sad thing is that I can’t remember the input I used to generate the robot I use.
Unlike most of these, the robots are pretty distinctive.
Cool to see thai on the header example. However the results doesn't really make sense, for example this "name" โจ เคน (Jo Keen) has the first letters of each word จ (j) and ค (k) despite the order. However the service outputs โ (o) and เ (k).
If you really want to support it, you could maybe put some simple rules (might work in 90% of all cases) that you only grab the 1st consonant in each word. However even that won't be 100% correct because.. well, language rules basically.
Nice idea. As one wrote, this can easily done with one line of JS but having this as an web API which returns an image file is definitely neat.
However, I see a privacy issue with sending all my user's real names to some 3rd party service (even if they claim there's no tracking or something similar).
Absolutely, I'd probably also just use CSS and HTML and use the core package: https://github.com/lasserafn/php-initials to generate the initials, it's faster and you won't depend on third-party.
I absolutely see your point, that's also why I open-sourced the code (see footer), but obviously I could be using different code or track it on the server (nginx or similar?). This is not the case, but I understand. Another option is to use the core generator (which is also open sourced) so that the generation happens locally :) But then again, CSS+HTML does not require any generation
Why don't you rather provide a service which generates more complex avatars such as those from Github[1] or Slack.
Your API consumer sends some unique string (user-id, hashed user-id or hashed username or whatever they like) and you send back an unique avatar for that string. Moreover, you as the API provider offer different themes (e.g. tablecoth, space invaders, pixel-faces, etc.) which the consumer can again slightly customize (e.g. color, size, etc.) to have a unique style over all its avatars.
You current solution is elegant but at the same time just too easy to build oneself.
I built this service (or, the core GitHub package) because we needed it internally, and someone requested an API of this, so I quickly threw together this :-).
Also, I think theres a lot of those unique avatar generators out there (even one in the comments here), and I like them but they're not personal like your initials are. Also, for example, in accounting software (where I needed it internally) a monster or space invaders didn't fit with the audience.
I do however like your idea! Wouldn't be hard do create either. Who knows, that could be version 2
I think the key challenge with my proposed idea is to have another internal API just for the themes. Everybody can provide themes for the service and hook them into the main avatar service.
Imagine there would we just one avatar service where consumers can get thousands of different avatar-styles.
Didn't consider that aspect. That would be very cool! Okay, thats a little more of a challenge than generating some initials and making a circle, lol. I will investigate, sadly I'm not the most creative person, so wouldn't be as cool as https://robohash.org
If you use only the initials, you can cut or fake the other letters since they're ignored anyway. Not 100% privacy but better than sending the full name
SVG is awesome... but this is a basic enough subset of SVG that SVG is unwarranted. CSS will do this just fine (and any browser capable of displaying this SVG can probably support the CSS features required to pull this off).
The only thing I can see is the gravatar callback (which incidentally has to use a different endpoint anyway to work-around gravatar not supporting query params) - is that not as niche of a use as it seemed to me?
Probably because you don't have to have different css styles for many of the options like image size, font size, language, color. Though these can be achieved with css.
One use case I see is for native mobile apps to generate the avatars as an initial profile image during the signup.
Absolutely, but it’s not that simpel, it’s made to be flexible and handle different logic. Not that it’s magic by any means, it’s fairly simple but you’d want to generate the initials on the server anyway, to acomplish similar results
For example, it takes first letter of first name, and 2 letters from last name if only two names supplied and desired length is 3.
However if 3 names are supplied, it uses a letter from each name.
It’s not magic, but doing it in CSS wouldn’t be easy, I imagine
Note that the "take the first codepoint" approach doesn't work for all languages. Take Hindi for example. This is a name:
प्रेरणा
'preraṇa'
The convention for initials in Hindi is such that this would be the "initial":
प्रे॰ (< प + ् + र + े + ॰)
'pre'
which is the first four codepoints combined (because they are in some sense considered a single character) plus another codepoint!
If for some reason you needed to respect locale-specific initialism conventions for a lot of different locales, it might be worth introducing an abstraction for determining the initials of a name.
I'd absolutely recommend anyone, that has the ability, to generate them using HTML and CSS, it's way faster. You could even use the core package the generate the initials (as it's a little more than just each letter of each name)
That said, I've personally never liked using dynamic avatars on websites I'm involved with. They've always seemed a bit generic, regardless of whether they're gravatars, these letter avatars, gender symbols, etc.
Always felt it'd work better if my services simply took a random avatar from a large gallery of thematically appropriate pictures instead. Like say, on a gaming forum it'd give them a random video game character picture, and on a TV show forum one from the show in question.
But that's just my opinion on the matter. This seems like it'll work well for people who like that stuff.
Nice idea! What surprised me most: It is also very well executed, with a sane and simple API, good performance considerations, and it fits its purpose almost perfectly.
Having said that, please pardon my ignorance, but:
What's the advantage over simply not using an avatar at all?
Honestly? Nothing really. Well, you don't have to think about the code part but besides that? Nothing. Actually it would be more performant to use CSS and HTML (or SVG?) to generate avatars. I have a core package (used to generate the initials), and if used that with html, it would be far better.
I use the service for our internal products, as gravatar fallbacks
Nice service - I was looking for something like this to generate default avatars for our SaaS app recently.
How does it handle middle names? i.e., does "John Arthur Smith" still return (JS)? What about reverse names, e.g. "Smith, John Arthur"? Is it smart enough to parse the comma and work out first/last initials from that?
Addendum: I also assume that you intend this service to be a 'once off' generation of a user avatar which can be stored locally? Do you rate limit so that people cannot simply dynamically generate avatars for ridiculous long lists of people on their web page?
Ut stores the avatars on the server, cached by all parameters (not the name, but the generated initials) to avoid generating them again. Also some response headers are set to ask browsers to cache the response. I would also recommend users of this to download the avatars, as you suggested, especially to ensure fastest possible response rates.
Actually there is no rate limiting, but seeing just how many visitors this HN post has gotten, I may have to add some sort of limiting.
I haven't really figured exactly what I'm going to do regarding limiting and servers. Currently I'm setting up servers in each region my provider supports, to fix latency issues, and spread the load
Brilliant - thanks for this. Also, would be a nice feature to have the colours randomise themselves as an option, so that I could have different coloured avatars on my people listing without having to worry about generating pleasing colours and ensuring that the foreground and background do not clash.
It's funny you'd say this! I remember when I launched the core package on Github, someone suggested colors to be generated from the name or initials. I will look into this, it would be pretty neat! Thanks for the feedback :-)
Pretty neat but it seems the letters do not line up correctly. In such a small space any slight misalignment is really obvious.
I noticed the <Margin on the left is 16px, on the right is 17px. Similarly from the top is 21px and the bottom is 20px. It makes it look really off (to me).
I'm working to support Chinese as well, preferably would be support for all languages. Sadly not all fonts support each character so I've been resorting to use different fonts for different unicode scripts :)
Honest question, is anyone building new apps and actually care about older browsers? We’re using svg for everything now and haven’t run into a problem with support.
Hmm. The jpeg requirement seems odd. Even if it has "jpg" in the url, you can serve up a standalone SVG (with a jpg extension in the url) as long as you send the right MIME type. The example SVG above shows it's probably going to be lighter weight than pulling in a java image library.
Hat tip to the evil growth marketing technique (source long lost, sorry) suggesting use of a default female "outline" avatar to strongly motivate account creation / gender reassignment (and perhaps even replacement with genuine profile pictures)!
I think it's interesting how much thought goes into default avatars, and that it can be used as a marketing tactic. Thanks for providing link to Twitter as well. Guess I'll have to think more about it in the future.
For a service where the early adopters are predominantly male (perhaps an invalid assumption, but a lazy tech stereotype), you have the default picture be the outline of a female to incentivise the male to "correct" the default by uploading their own picture (demonstrating they're a male, rather than female).
Interesting thought process if my interpretation is correct.
The OP was referring to an "evil growth marketing tactic" - it wouldn't be as evil if it were mainly for empathy with the user base rather than as a dark pattern.
Absolutely, I've played around with this. There are tons of open source libraries to determine gender from name. Obviously it cannot be 100% correct, but it can provide a guess
https://www.peppercarrot.com/en/article391/cat-avatar-genera...
the furry version of
https://robohash.org/