Then I imported the file as a composition, keeping all the layers. So I already had my layered Illustrator file and started After Effects. But to point out the possibilities of the amazing Bodymovin extension (which I will discuss later) I will describe the steps I took shortly: Since it is not my intention to write an in-depth article about hardcore animation I will not dive in too deep. Let’s get down to business: After Effects if browser doesn't support 'selectionEnd' property on input, use 'value.length' property instead Var eyeLCoords, eyeRCoords, noseCoords, mouthCoords, eyeLAngle, eyeLX, eyeLY, eyeRAngle, eyeRX, eyeRY, noseAngle, noseX, noseY, mouthAngle, mouthX, mouthY, mouthR, chinX, chinY, chinS, faceX, faceY, faceSkew, eyebrowSkew, outerEarX, outerEarY, hairX, hairS ĭiv = document. 5, dFromC, mouthStatus = "small", blinking, eyeScale = 1, eyesCovered = false, showPasswordClicked = false Var activeElement, curEmailIndex, screenCenter, svgCoords, emailCoords, emailScrollMax, chinMin =.
querySelector ( '.bodyBGnormal' ), bodyBGchanged = document. querySelector ( '.hair' ), bodyBG = document. querySelector ( '.eyebrow' ), outerEarL = document. querySelector ( '.face' ), eyebrow = document. querySelector ( '.chin' ), face = document. querySelector ( '.tongue' ), chin = document. querySelector ( '.tooth' ), tongue = document. querySelector ( '.mouthOutline' ), tooth = document. querySelector ( '#mouthMaskPath' ), mouthOutline = document. querySelector ( '.mouthLargeBG' ), mouthMaskPath = document. querySelector ( '.mouthMediumBG' ), mouthLargeBG = document. querySelector ( '.mouthSmallBG' ), mouthMediumBG = document. querySelector ( '.mouthBG' ), mouthSmallBG = document. querySelector ( '.mouth' ), mouthBG = document. querySelector ( '.nose' ), mouth = document. querySelector ( '.eyeR' ), nose = document. querySelector ( '.eyeL' ), eyeR = document. querySelector ( '.armR' ), eyeL = document. querySelector ( '.armL' ), armR = document. querySelector ( '.twoFingers' ), armL = document. querySelector ( '.svgContainer' ), twoFingers = document. querySelector ( '#showPasswordToggle' ), mySVG = document. querySelector ( '#showPasswordCheck' ), showPasswordToggle = document. querySelector ( '#loginPassword' ), showPasswordCheck = document.
querySelector ( '#loginPasswordLabel' ), password = document. querySelector ( '#loginEmail' ), passwordLabel = document.
querySelector ( '#loginEmailLabel' ), email = document.