M is the first letter of Miles, my first name. I understand this letter as simple compared to some other letters, even though a serious designer named Katherine tells me that I am wrong, and that in fact “M is one of the most complex letters.”

My animation shows M performing a passionate, dipping motion. I had very few preconceptions for this animation, and figured it out through experimentation.

I like Lauren Valley’s O, because it is surprising, and would be difficult to use in a practical way. I agree with Lauren’s characterization of O as a predatory letter.

Letter on Anitype.

[iframe src=”http://www.anitype.com/entry/agtzfmFuaXR5cGVjb3IUCxIHbGV0dGVycxiAgIDA2Z3QCAw/” width =”620″ height=”360″]

Anitype.register('M', {

  author: 'Miles Hiroo',
  website: 'http://mileshiroo.info/',
  construct: function(two, points) {

    var anitype = this;
    var polygon = anitype.makePolygon(points);
    var sign = Math.random() < 0.5 ? -1 : 1;
    polygon.scale = .7;

    var w = Anitype.Dimensions.width;
    var h = Anitype.Dimensions.height;

    var left_leg = polygon.vertices[0];
    var right_leg = polygon.vertices[points.length-1];
    var middle = polygon.vertices[2];
    var left_knee = polygon.vertices[1];
    var right_knee = polygon.vertices[3];
    
    anitype.addTween(left_knee, {
       from: {x: middle.x, y: middle.y+h*.2},
       to: {x: left_knee.x, y: left_knee.y},
       easing: Anitype.Easing.Elastic.Out,
       duration: 2,
       start: .4,
    });
    
    anitype.addTween(right_knee, {
       from: {x: middle.x, y: middle.y+h*.2},
       to: {x: right_knee.x, y: right_knee.y},
       easing: Anitype.Easing.Elastic.Out,
       duration: 2,
       start: .4,
    });
    
     anitype.addTween(left_leg, {
       from: {y: left_leg.y - w*.2},
       to: {y: left_leg.y},
       easing: Anitype.Easing.Linear.None,
       duration: .2,
       start: 0,
    });
    
    anitype.addTween(right_leg, {
       from: {y: right_leg.y - w*.2},
       to: {y: right_leg.y},
       easing: Anitype.Easing.Linear.None,
       duration: .2,
       start: 0,
    });
          
    anitype.addTween(middle, {
       from: {y: h*.8},
       to: {y: middle.y},
       easing: Anitype.Easing.Elastic.Out,
       duration: 2,
       start: .2,
    });
    
    var xSign = Math.random() < 0.5 ? -1 : 1;
  
    anitype.addTween(middle, {
       from: {x: middle.x + (Math.random()*w*.3) * xSign},
       to: {x: middle.x},
       easing: Anitype.Easing.Elastic.Out,
       duration: 1,
       start: 0,
    });
    
    anitype.addTween(polygon, {
      to: { rotation: 0, scale: 1 },
      easing: Anitype.Easing.Elastic.Out,
      duration: 1, 
      start: 0       
    });
    
    return two.makeGroup(polygon);
  }
});