Solved
How to build an avatar through the survey
As part of our survey, we need our participants to build their own customized avatar, based on a set number of characteristics (e.g. face shape, skin color, hair length, etc). We have pre-built avatars for all possible combinations of these characteristics.
Is there a way to map a specific set of responses to a single image file (i.e. if a participant selects "oval face shape", "light skin", and "long hair", then the appropriate image with those features will be displayed)? There are over 600 finished avatars so ideally we are not doing this with a brute force method. Any suggestions are much appreciated!
Best answer by TomG
If I were doing it, I would import the characteristics and image urls into a web database, then write a web service to lookup the image and return it as an embedded variable.
If you don't have the ability to do that, a second option would be to define a JS object with the all the characteristics and image urls. Then use JS to do the lookup.
+27If I were doing it, I would import the characteristics and image urls into a web database, then write a web service to lookup the image and return it as an embedded variable.
If you don't have the ability to do that, a second option would be to define a JS object with the all the characteristics and image urls. Then use JS to do the lookup.
@TomG Thanks for this suggestion!
I'm a complete novice when it comes to JS. I noticed you made a similar suggestion in another post with some sample code, which I thought may be adapted to this problem.
var zips = {
60606: "33",
etc. (999 more zip codes)
};
Let's say in Q.1, Q.2, and Q.3, participants select their different feature options (e.g. "oval", "light skin", "long hair"). In terms of defining the JS object, do I define it in reference to those 3 questions?
var avatar = {
"{q://QID1/Oval},{q://QID2/Light},{q://QID3/Long}" : "IM_7aFjemLktwT0S1f",
etc
};
+27> @akcooper said:
> @TomG Thanks for this suggestion!
>
> I'm a complete novice when it comes to JS. I noticed you made a similar suggestion in another post with some sample code, which I thought may be adapted to this problem.
>
> var zips = {
> 60606: "33",
> etc. (999 more zip codes)
> };
>
> Let's say in Q.1, Q.2, and Q.3, participants select their different feature options (e.g. "oval", "light skin", "long hair"). In terms of defining the JS object, do I define it in reference to those 3 questions?
>
> var avatar = {
> "{q://QID1/Oval},{q://QID2/Light},{q://QID3/Long}" : "IM_7aFjemLktwT0S1f",
> etc
> };
>
>
I think you want to put it in an array of objects, then user .filter()
```
var avatars = [
{ face: "oval", skin: "light", hair: "long", avatar: "IM_7aFjemLktwT0S1f" },
/* additional objects, all with the same keys (face, skin, hair, avatar) and different values */
];
```
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.