Thank you for your reply but that is not what I meant. I want to change the shape but I dont really know how.
I made a new shape in illustrator, and when I choose "save as" and then "show SVG code" I get this code:
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Laag_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 595.3 841.9" style="enable-background:new 0 0 595.3 841.9;" xml:space="preserve">
<style type="text/css">
.st0{fill:#FFFFFF;}
</style>
<g>
<path class="st0" d="M69.5,242.5c137.6,0,275.3,0,412.9,0c0,68.3,0,136.6,0,205c-137.6,0-275.3,0-412.9,0
C69.5,379.1,69.5,310.8,69.5,242.5z M366.2,421.4c6.8-1.3,13.9-1.8,20.3-4c36.6-12.6,54.7-56.7,38.8-93.4
c-10.3-23.7-33.1-42-62.4-40.4c-17.6,0.9-32,8.7-44,21.6c-10.7,11.6-21.4,23.4-32.9,34.1c-14.4,13.5-31.8,12.4-45.6-1.9
c-4.3-4.4-8.2-9.2-12.4-13.7c-10.9-11.3-23.8-16.1-39.4-11.4c-21.7,6.6-33.5,31.6-25.7,54.2c9.3,27.2,40.8,35.8,62.1,16.6
c6.3-5.6,11.5-12.5,17.5-18.5c10.9-10.9,25.3-12.4,38.2-4c4,2.6,7.8,5.8,11.1,9.2c9.5,9.8,18.6,20,27.9,30
C332.2,413.3,347.3,421.1,366.2,421.4z"/>
<path d="M366.2,421.4c-19-0.3-34-8.1-46.5-21.5c-9.3-10-18.5-20.1-27.9-30c-3.3-3.4-7.1-6.6-11.1-9.2c-12.8-8.4-27.2-6.9-38.2,4
c-6,6-11.2,12.9-17.5,18.5c-21.3,19.1-52.7,10.6-62.1-16.6c-7.8-22.6,4-47.6,25.7-54.2c15.5-4.7,28.5,0.1,39.4,11.4
c4.3,4.4,8.2,9.2,12.4,13.7c13.8,14.3,31.1,15.4,45.6,1.9c11.5-10.8,22.2-22.6,32.9-34.1c12-12.9,26.4-20.7,44-21.6
c29.4-1.6,52.2,16.7,62.4,40.4c15.9,36.7-2.2,80.8-38.8,93.4C380.1,419.6,373,420.1,366.2,421.4z"/>
</g>
</svg>
But where and which code do I place where? I want my circle to END in the above shape. My current code now is:
<div class="blob2">
<div class="left-text">
</div>
<div class="right-text">
</div>
<svg version="1.1" id="Layer_2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="300px" height="200px" viewBox="0 0 300 200" style="enable-background:new 0 0 800 400;" xml:space="preserve">
<path id="circle2" class="path2" d="M94,188 C145.914766,188 188,145.914766 188,94 C188,42.0852335 145.914766,0 94,0 C42.0852335,0 0,42.0852335 0,94 C0,145.914766 42.0852335,188 94,188 Z"/>
</svg>
</div>
<script>
TweenLite.set("#circle, #circle2", {scale: 0.1, transformOrigin: "center center"});
TweenLite.to("#circle, #circle2", 1, {scale: 1});
setTimeout(function(){
TweenLite.to("#circle, #circle2", 1, {morphSVG:{shape:"M110.471,116.507 C136.143,89.207 148.064,71.207 166.737,71.207 C185.335,71.207 190.511,82.099 204.721,97.207 C211.714994,104.845596 221.595662,109.195499 231.9525,109.195499 C242.309338,109.195499 252.190006,104.845596 259.184,97.207 C274.217907,80.8327544 274.212258,55.6744929 259.171,39.307 C252.183736,31.663125 242.304691,27.3090796 231.9485,27.3090796 C221.592309,27.3090796 211.713264,31.663125 204.726,39.307 C190.655,54.255 185.32,65.592 166.565,65.592 C148.079,65.592 136.182,47.362 110.458,20.009 C98.8104224,7.27175885 82.3453776,0.0169090374 65.0855,0.0169090374 C47.8256224,0.0169090374 31.3605776,7.27175885 19.713,20.009 C7.53155605,33.1110573 0.808302952,50.3673354 0.915,68.257 C0.806447888,86.1426132 7.52773912,103.39543 19.707,116.494 C31.3932892,129.167947 47.8227515,136.412777 65.062,136.494 C82.355667,136.41735 98.7843648,129.177088 110.471,116.507 Z", shapeIndex:14}});
}, 1000);
</script>
I made a new one and put the code in, but nothing happens when I do that The code that I get (you can save it as .svg and open with Illustrator) is this:
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Laag_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 595.3 841.9" style="enable-background:new 0 0 595.3 841.9;" xml:space="preserve">
<style type="text/css">
.st0{fill:#FFFFFF;}
</style>
<g>
<path class="st0" d="M94,188c51.9,0,94-42.1,94-94S145.9,0,94,0S0,42.1,0,94S42.1,188,94,188z"/>
<path d="M110.5,116.5c25.7-27.3,37.6-45.3,56.3-45.3c18.6,0,23.8,10.9,38,26c7,7.6,16.9,12,27.2,12s20.2-4.3,27.2-12
c15-16.4,15-41.5,0-57.9c-7-7.6-16.9-12-27.2-12s-20.2,4.4-27.2,12c-14.1,14.9-19.4,26.3-38.2,26.3c-18.5,0-30.4-18.2-56.1-45.6
C98.8,7.3,82.3,0,65.1,0S31.4,7.3,19.7,20C7.5,33.1,0.8,50.4,0.9,68.2c-0.1,17.9,6.6,35.1,18.8,48.2c11.7,12.7,28.1,19.9,45.4,20
C82.4,136.4,98.8,129.2,110.5,116.5z"/>
</g>
</svg>