I am trying to come up with a unique idea for a website that has not been done before. I like the idea of a color typewriter, which would allow you to write with colors rather than letters. For instance, if the user types “W” instead of the letter a block of color would appear. Typing a whole paragraph would result in a work of art. Has anyone seen this done before?
Sounds really interesting. I’ve never heard of it before but I did come across a physical version of what you’re describing: http://www.toxel.com/tech/2013/02/25/chromatic-typewriter/
I say go for it!
Finished version (from Katrina, the OP (I’m friends IRL))
http://www.katrinaschmelter.com/testing/colortypewriter/
She would forget to post this.
1 Like
That was fun and relaxing, I’ll definitely be trying this again tonight!!! You start off really slow but by the end of it it’s almost second nature. (Left is color typewriter, right is the reference pic)
3 Likes
Wow, I’ll be sure to alert her to this. That’s great!
Wow, that is pretty cool. I plan on adding some sort of gallery feature so that people can share all the cool things they make. Thanks for posting this, I can’t wait to see more!
2 Likes
Last one!
This is a lot of fun, it should definitely be moved into the showcase forum. I’d also try posting it up on PixelJoint’s resources forum, they’d love this and might give you ideas on how to take it further.
One idea for saving would be to just generate a URL that represents the canvas, that way you don’t need to actually save anything on your server. Something like:
/colortypewriter/?canvas_size=m&pixel_size=m&pixels=jsdhfjksakhdfakjhsfkjsahfk…
Or if you use a # instead of the ? you can “quick save” without actually reloading the page or anything. Anyways, just some ideas!
Great job!
1 Like
This is brilliant, @Mike_Novia great work! I’ve moved it to Showcase so others can see how awesome this is.
Do you have a Twitter handle at all? I’ll still post a link there, but at the moment I can’t tie it back to you directly.
Thanks for clarifying that, Ryan. I was getting very confused.
2 Likes
Thanks! It is actually my page. Mike is my boyfriend and at the time I was using his computer.
Cool app. Only thing that bothers me is the saved image has visible columns in it, which ruins the picture you created above.
I’m aware of the issue. I’m not sure how to fix it. I believe it’s a limitation of html2canvas. Temporarily, you could just screenshot your creation.
2 Likes
That’s really cool! A possible enhancement might be Shift/Alt modifiers which gave you a lighter/darker version of the same colour?
3 Likes
.I can’t get the - and = keys to work in FF. Any idea why? Are they mapped differently between browsers?
https://api.jquery.com/keypress/
Cmopare the keycodes you get in FF / Chrome. Seems FF doesn’t even map those characters?
The script seems to be looking at the which property on keydown.
In Chrome:
- is 189
= is 187
; is 186
In FF:
- is 173
= is 61
; is 59
It’s kinda all over the place for many non-letter/-number characters. Apparently there are a lot of differences between the ways each browser does this: http://www.quirksmode.org/js/keys.html
It just seems to be for a few keys. I think Katrina should bind both those keys. Chrome doesn’t go that low so perhaps bind both of them to that one color?
I dunno it’s set up sorta weird how it is.