Intellihair: AI that Suggests a New Style to You
Our AI will suggest a new haircut and some accessories that fit you perfectly!
I've recently had the pleasure to create an experimental JavaScript application with Face API, a very simple-to-use facial recognition service provided by Microsoft. It has several features such as comparing two faces and getting the probability of a match back or, the one that I’ve used, extracting tons of information out of a person’s picture like their estimated age or the colour of their hair.
The following example shows you, what you get from the service by default:
[
{
"faceAttributes": {
"accessories": [],
"age": 34.0,
"blur": {
"blurLevel": "medium",
"value": 0.37
},
"emotion": {"anger": 0.0, "contempt": 0.0, "disgust": 0.0, "fear": 0.0, "happiness": 1.0, "neutral": 0.0, "sadness": 0.0, "surprise": 0.0
},
"exposure": {
"exposureLevel": "goodExposure",
"value": 0.59
},
"facialHair": {
"beard": 0.1,
"moustache": 0.1,
"sideburns": 0.1
},
"gender": "male",
"glasses": "NoGlasses",
"hair": {
"bald": 0.33,
"hairColor": [
{"color": "blond", "confidence": 0.98},
{"color": "gray", "confidence": 0.87},
{"color": "brown", "confidence": 0.56},
{"color": "other", "confidence": 0.21},
{"color": "red", "confidence": 0.14},
{"color": "black", "confidence": 0.04}
],
"invisible": false
},
"headPose": {
"pitch": 0.0,
"roll": 4.7,
"yaw": -0.8
},
"makeup": {
"eyeMakeup": false,
"lipMakeup": false
},
"noise": {
"noiseLevel": "low",
"value": 0.11
},
"occlusion": {
"eyeOccluded": false,
"foreheadOccluded": false,
"mouthOccluded": false
},
"smile": 1.0
},
"faceId": "b71a8ce9-4c93-4d03-bab9-74d5951772b0",
"faceLandmarks": {
"eyeLeftBottom": {"x": 172.4, "y": 154.4},
"eyeLeftInner": {"x": 180.8, "y": 152.7},
"eyeLeftOuter": {"x": 165.0, "y": 151.2},
"eyeLeftTop": {"x": 173.2, "y": 148.3},
"eyeRightBottom": {"x": 218.6, "y": 158.5},
"eyeRightInner": {"x": 210.4, "y": 155.2},
"eyeRightOuter": {"x": 228.2, "y": 157.3},
"eyeRightTop": {"x": 219.3, "y": 151.9},
"eyebrowLeftInner": {"x": 186.1, "y": 144.7},
"eyebrowLeftOuter": {"x": 152.8, "y": 144.1},
"eyebrowRightInner": {"x": 204.2, "y": 146.9},
"eyebrowRightOuter": {"x": 235.6, "y": 150.7},
"mouthLeft": {"x": 165.0, "y": 200.0},
"mouthRight": {"x": 216.7, "y": 204.1},
"noseLeftAlarOutTip": {"x": 175.8, "y": 181.4},
"noseLeftAlarTop": {"x": 182.7, "y": 173.2},
"noseRightAlarOutTip": {"x": 211.1, "y": 183.3},
"noseRightAlarTop": {"x": 204.7, "y": 173.9},
"noseRootLeft": {"x": 188.3, "y": 155.5},
"noseRootRight": {"x": 201.1, "y": 156.3},
"noseTip": {"x": 193.4, "y": 183.8},
"pupilLeft": {"x": 172.6, "y": 151.7},
"pupilRight": {"x": 218.3, "y": 156.1},
"underLipBottom": {"x": 190.5, "y": 211.2},
"underLipTop": {"x": 191.1, "y": 205.6},
"upperLipBottom": {"x": 191.0, "y": 204.8},
"upperLipTop": {"x": 191.1, "y": 201.1}
},
"faceRectangle": {
"height": 109,
"left": 139,
"top": 124,
"width": 109
}
}
] The goal of the project was to create a showcase for conferences and congresses to which VIU is attending. We wanted to create something that’s funny and entertaining but also demonstrates some of our skills. It should draw the attention of the visitors to our booth and work as a conversation starter. That’s how Intellihair was born. Intellihair is a fictional hair or beauty salon that tries to sell you products based on your gender, age, hair colour along with others. In the end, it also recommends you a new look which is directly applied to the picture of your face so you’re able to see how it’d look in real life. Even the interface itself will adapt to the “customer” in front of the camera by setting the background colour depending on the gender or increasing the font-size if a certain age is exceeded.
The basic setup for the application is simple. All you need is a screen and a camera. The app is accessible through a website. The newest version is now responsive and works on almost any device with a front-facing webcam. Then, all you need to do is to press “Take picture” and wait for the magic to happen. I won’t talk about all the possible outcomes, you rather give it a go yourself. The results are the most accurate if you’re using a good camera and proper lighting.
The app has a hidden event mode that features a more exciting way to trigger the photo being taken. In event mode, instead of having to press a button, the person standing in front of the camera simply has to hold a VIU business card into the camera. The app recognizes it by its shiny red-orange colour and triggers a countdown for the shot. Not only is it easier to use the app, as it wasn’t necessary to click something, but also the potential customer has our business card in his hand. Nice. What I thought to be a cool idea turned out to be quite tricky to implement in reality. For example, the colour-detecting algorithm had to be calibrated for every location where the app was used due to different light conditions or different camera qualities. So, sometimes a shot was triggered when not intended or vice versa. This and other issues were overcome by the positive effect it had on the visitors though.
The app is public and free-to-use. You can find it under the following URL:
https://www.intellihair.ch
Please note that the app is an experiment and still a beta version.
©viu AG
Imprint