How We Made a Simple Avatar Generator for Our Fitness Interviews

Published By

James Hook
An experienced Content Writer to work with a Big 4 consultancy on an exciting programme in the technology/AI (artificial intelligence) field, specifically within the transportation sector. Key responsibilities for the Content Writer include: Create white papers discussing subject matter in the technology/AI field, for applications within the transportation sector Utilise existing content ensuring it meets brand guidelines and drives the strategic priorities of the organisation Work collaboratively with colleagues The Successful Applicant will ideally have: Ability to produce written content, including editing and proofreading Strong understanding of technology language, drivers and outcomes Understanding of MS Office applications, Adobe Acrobat, Photoshop etc. Unrivalled attention to detail Good organisational skills including the ability to manage and reconcile competing priorities Good communication and interpersonal skills Ability to interact with stakeholders at various levels and ensure objectives are met Self-motivated, flexible and proactive attitude Exceptional English language skills

Top Tech Firms

Top App Developers in Singapore

There is no question about the fact that we have reached the...

Top 10 Sports Betting App and Sports Mobile App Development Companies

Sports betting is one of the oldest forms of gambling, carried out by generations for a very...

Top Mobile App Development Companies in USA and Worldwide

The global headcount of app developers is growing exponentially. Paradoxically, the gap between mobile and web app...

My name is Mads Phikamphon and I’m the founder of Bulk Hackers. At Bulk Hackers, we interview people who do great in fitness. A lot of stuff in fitness is going on on Instagram, so we wanted a way to build an attractive Instagram profile where we could share our interviews. Simplifying our workflow
Many fitness Instagram profiles look a bit the same, so we decided to go for making avatar images of every person we interview and use those images on our Instagram. Now, we could have done all these images manually, but that would create a potential bottleneck in our workflow as none of us are that good at drawing. It would also take time/money to keep creating the images manually 😨So instead of doing things manually, we built an online avatar generator, so we could easily make new images ourselves without involving an illustrator again and again.

Putting the avatars together
Our site Bulk Hackers runs on WordPress, so our avatar generator is a WordPress plugin. It basically works by layering images of face shapes on top of each other like this:

The layering is done in JavaScript using the merge-images NPM package, which makes our own part of the layering code quite simple. To make it possible to create many different avatars, so there’s something that matches almost everybody, we have so far created close to 200 face shapes that can be layered. Shapes in many different colors
Most of our face shapes can be colored in different ways, so the same hair, for example, can be both blond, brown and red.

Manually creating shapes in each and every color would take a lot of time and hurt my programmer’s heart, so we also create a routine for coloring the shapes automatically. All the shapes we get are delivered in the same three grey colors. The main grey, dark grey, and light grey. We then have a PHP function that runs through the shapes and creates colored versions as needed (i.e. if they don’t exist already). Sharing the avatars on Instagram
When an avatar has been designed, we want it to get ready for our Instagram. The way we do that is to run the generated avatar image through some more PHP code that crops the image a bit and adds the name of the person + the title of their interview. Finally, the avatar is ready for Instagram, so now it’s queued and will be shared on our Instagram through with the help of Buffer’s API.Final thoughts
All in all, it turned out to be much simpler to build an avatar generator than expected. After all, merging images together with code isn’t noble price stuff 😄But I hope you found this walk-through useful anyway.

- Advertisement -


  1. Great V I should certainly pronounce, impressed with your web site. I had no trouble navigating through all tabs as well as related info ended up being truly easy to do to access. I recently found what I hoped for before you know it in the least. Reasonably unusual. Is likely to appreciate it for those who add forums or something, site theme . a tones way for your client to communicate. Nice task..


Please enter your comment!
Please enter your name here

- Advertisement -

Future Technology

Cambium Network and Facebook Team Up For the Sake of Smart Cities

Of the many, many lessons we’ve taken away thus far from the coronavirus pandemic, it’s that the...

Facebook’s PyTorch3D : A Catalyst for Deep Learning and 3D Objects

To understand what PyTorch is, how it works, and its ability to catalyze technological advancements. It’s important first to understand the answer...

How AI Could Save the 3D Printing Industry and the Future of Machines

3D printing is a billion-dollar market with a variety of use cases- from healthcare, replicas to architecture, airplane parts.

How We Made a Simple Avatar Generator for Our Fitness Interviews

My name is Mads Phikamphon and I'm the founder of Bulk Hackers. At Bulk Hackers, we interview people who do great...

WhatsApp Users Hit 2 Billion: What Does This Mean for the Future of Privacy?

There are now over 2 billion registered users on the mobile messaging platform, up from 1.5 billion in 2017. Brief History...
- Advertisement -

More Articles Like This

- Advertisement -