Spread the love <3

Yeah, some people in the comments got really creative but it would definitely be nice if sharing it would be easier. I might also add a download as png button at the bottom of the canvas. (Can already be done by right clicking but thats not very user friendly)

For every letter typed a line is drawn. The length of the letter is determined by its position in the alphabet. The next line will be drawn with a rotation depending if its in the first or the second half of the alphabet. So it goes to the left is its between a and m and to the right if its between n and z. Hope that clears it up for you!

Thanks. got it. It would be great if you add an example in the site :)

Update: wow I did not expect this response, I am so happy that people are enjoying Names! I have gathered some ideas for new features and improvements from the comments, I will see if I can implement them.

"Names" is a programmatic visualisation of letters in a word, based on their position in the alphabet. Try typing a word yourself in the box below!

So I just typed each letter to see what the pattern was. Is there a reason you had the pattern rotate the other way after `m`?

I tried aabbccdd... to make a spiral and it broke at m.

You can do it:

abcdefghijklm...n..o..p..q..r..s..t..u..v..w..x..y..z..z.ab...z..c...z..d...z..e

etc.

i.e., `.` changes direction. Once you get to `z` you can continue appending additional `z`s to keep it going. I quit making the spiral here cos I realized the top comment is also a spiral, although theirs is in the other direction.

tried zzzyyyxxx... so infuriating

Looks like a bug to me.

Definitely not a bug. There is a piece of code in source that looks like this:

  function rotateLine(position) {
    if (position < halfabet) {
      context.rotate((-90 \* Math.PI) / 180);
    } else if (position > halfabet) {
      context.rotate((90 \* Math.PI) / 180);
    } else if (position === halfabet) {
      context.rotate((180 \* Math.PI) / 180);
    }
  }

Halfabet is a fun variable name.

Love your name/logo :)

Thank you! It was made with the generator :)

I know that was why i said name/logo :P

I saw the similarity, wrote "joost" and saw it was the same.