4 ms·

C64 Yourself: Browser-based image converter to C64 color palette

103 points by erickhill 9y ago

steanne 9y ago
does this include the ones made by color switching? https://news.ycombinator.com/item?id=13935590 https://news.ycombinator.com/item?id=13935590
- andai 9y ago
  Unfortunately, no. But thanks for sharing that, that's really cool!
knlje 9y ago
Would love to try this but limiting the upload to drag and drop makes it hard for me. Not everyone uses Windows or Mac you know. Is there any way to upload stuff to these without having graphical file manager?
- digi_owl 9y ago
  welcome to the app-ification of the web...
  - throwanem 9y ago
    Not the problem here. A file input control would do the same job and be usable on mobile devices; this isn't "web apps lol", it's a straightforward UI design error.
- eehee 9y ago
  It can even be solved without any extra UI elements - just have clicking the drag & drop element act as a regular file input.
- Retr0spectrum 9y ago
  Firefox let me drag a recent image from my download menu. I agree that this is rather poor UX though.
AnthonBerg 9y ago
That name is so, so good.
cgrf 9y ago
What a great idea! I would love to see a "save AS disk" option that would let you download a D64 disk image containing the rendered graphics in some appropriate format like KoalaPainter or Amica Paint.
- erickhill 9y ago
  There are some good cross-dev C64 graphics editors out there on the PC - I think most of them will let you import pictures, convert them, then save as PRG (etc) executables you can run on a real C64. PC: - Timanthes: http://csdb.dk/release/?id=75871 http://csdb.dk/release/?id=75871 - MultiPaint: http://csdb.dk/release/?id=156376 http://csdb.dk/release/?id=156376 - ProjectOne: http://csdb.dk/release/?id=86776 http://csdb.dk/release/?id=86776 - PixCen: http://csdb.dk/release/?id=149752 http://csdb.dk/release/?id=149752 OSX: - http://csdb.dk/release/?id=156376 http://csdb.dk/release/?id=156376
kevinwang 9y ago
ok dis hard
franze 9y ago
here is the same concept, but i use vegetables instead of the c64 color palette http://veganizer.veganblatt.com/ http://veganizer.veganblatt.com/ never bother to publish or promote it somewhere, should work on mobile, creates huge images.
- franze 9y ago
  it's MIT, most of the magic happens here https://github.com/franzenzenhofer/veganizer2/blob/master/js/veganizer2.coffee https://github.com/franzenzenhofer/veganizer2/blob/master/js...
- andai 9y ago
  haha. nice
snvzz 9y ago
Not having an alternative method using a file selection dialog is extremely annoying on some platforms.
some1else 9y ago
Needs upload button (viewing on tablet)
bump-ladel 9y ago
There is also Retrospecs, an iOS app, that can simulate many retro computing looks. It's a lot of fun. http://8bitartwork.co.uk http://8bitartwork.co.uk
ungzd 9y ago
Does it limit character cell (8x8) to 2 (or 4?) colors?
sjclemmy 9y ago
As a ZX Spectrum user I was always jealous of the C64 colour palette. It had a single colour per pixel vs the ZX Spectrum's 1 colour per 8x8 pixel. https://en.wikipedia.org/wiki/ZX_Spectrum_graphic_modes https://en.wikipedia.org/wiki/ZX_Spectrum_graphic_modes
- imode 9y ago
  last I checked, you had 2 possible colors due to attribute cells.
- egypturnash 9y ago
  The c64's bitmap mode could either be 320x200 with color allocated in an 8x8 grid, much like the Speccy, or 160*200 with three selectable colors per 3x8 block, plus one background color shared across the whole screen. It did, however, also have sprites, which could float over or under the main screen. (If you're willing to dedicate pretty much all of the CPU time to flipping stuff around while the video chip is rendering the screen, you can have finer-grained color selections on the c64, but that's mostly the domain of demos.)
yalue 9y ago
Have you considered adding the ability to use dithering on this site? I made a similar tool a while back (to convert an image to an arbitrary color palette), and one of the main things I learned was how powerful dithering can be. For example, here are two images I created using my old tool to convert an image to the C64 color palette. Unlike the website, my tool isn't currently capable of doing the double-wide horizontal pixels, but it still illustrates the effect I think: Without dithering: http://imgur.com/nQL0y6i http://imgur.com/nQL0y6i With dithering: http://imgur.com/jfwUgnC http://imgur.com/jfwUgnC If you're interested, Wikipedia has a great example (with code) of the Floyd-Steinberg dithering algorithm, for example: https://en.wikipedia.org/wiki/Floyd%E2%80%93Steinberg_dithering https://en.wikipedia.org/wiki/Floyd%E2%80%93Steinberg_dither..., which I imagine wouldn't be too hard to integrate into your site.
- deleted 9y ago
  [deleted]
errozero 9y ago
Cool! I've got an urge to go out and take some photos, run them through this and create a retro adventure game. Do you think it would be possible to do the image conversion in Javascript so it does not need to be uploaded to the server?
- windows3095 9y ago
  The "C64ication" (if that's what you mean by conversion) actually happens purely in JavaScript - if I understand the source correctly, the image is only _resized_ on the server.. but the whole shebang can be done client-side. Yep. Would be awesome if the author(s) released this as a MIT licensed JS lib. Would love to use and credit it myself! :-)

103 points by erickhill 9y ago

does this include the ones made by color switching? https://news.ycombinator.com/item?id=13935590 https://news.ycombinator.com/item?id=13935590

andai 9y ago
Unfortunately, no. But thanks for sharing that, that's really cool!

knlje 9y ago

Would love to try this but limiting the upload to drag and drop makes it hard for me. Not everyone uses Windows or Mac you know. Is there any way to upload stuff to these without having graphical file manager?

digi_owl 9y ago
welcome to the app-ification of the web...
- throwanem 9y ago
  Not the problem here. A file input control would do the same job and be usable on mobile devices; this isn't "web apps lol", it's a straightforward UI design error.
eehee 9y ago
It can even be solved without any extra UI elements - just have clicking the drag & drop element act as a regular file input.
Retr0spectrum 9y ago
Firefox let me drag a recent image from my download menu. I agree that this is rather poor UX though.

AnthonBerg 9y ago

That name is so, so good.

cgrf 9y ago

What a great idea! I would love to see a "save AS disk" option that would let you download a D64 disk image containing the rendered graphics in some appropriate format like KoalaPainter or Amica Paint.

erickhill 9y ago
There are some good cross-dev C64 graphics editors out there on the PC - I think most of them will let you import pictures, convert them, then save as PRG (etc) executables you can run on a real C64. PC: - Timanthes: http://csdb.dk/release/?id=75871 http://csdb.dk/release/?id=75871 - MultiPaint: http://csdb.dk/release/?id=156376 http://csdb.dk/release/?id=156376 - ProjectOne: http://csdb.dk/release/?id=86776 http://csdb.dk/release/?id=86776 - PixCen: http://csdb.dk/release/?id=149752 http://csdb.dk/release/?id=149752 OSX: - http://csdb.dk/release/?id=156376 http://csdb.dk/release/?id=156376

kevinwang 9y ago

ok dis hard

franze 9y ago

here is the same concept, but i use vegetables instead of the c64 color palette http://veganizer.veganblatt.com/ http://veganizer.veganblatt.com/ never bother to publish or promote it somewhere, should work on mobile, creates huge images.

franze 9y ago
it's MIT, most of the magic happens here https://github.com/franzenzenhofer/veganizer2/blob/master/js/veganizer2.coffee https://github.com/franzenzenhofer/veganizer2/blob/master/js...
andai 9y ago
haha. nice

snvzz 9y ago

Not having an alternative method using a file selection dialog is extremely annoying on some platforms.

some1else 9y ago

Needs upload button (viewing on tablet)

bump-ladel 9y ago

There is also Retrospecs, an iOS app, that can simulate many retro computing looks. It's a lot of fun. http://8bitartwork.co.uk http://8bitartwork.co.uk

ungzd 9y ago

Does it limit character cell (8x8) to 2 (or 4?) colors?

sjclemmy 9y ago

As a ZX Spectrum user I was always jealous of the C64 colour palette. It had a single colour per pixel vs the ZX Spectrum's 1 colour per 8x8 pixel. https://en.wikipedia.org/wiki/ZX_Spectrum_graphic_modes https://en.wikipedia.org/wiki/ZX_Spectrum_graphic_modes

imode 9y ago
last I checked, you had 2 possible colors due to attribute cells.
egypturnash 9y ago
The c64's bitmap mode could either be 320x200 with color allocated in an 8x8 grid, much like the Speccy, or 160*200 with three selectable colors per 3x8 block, plus one background color shared across the whole screen. It did, however, also have sprites, which could float over or under the main screen. (If you're willing to dedicate pretty much all of the CPU time to flipping stuff around while the video chip is rendering the screen, you can have finer-grained color selections on the c64, but that's mostly the domain of demos.)

yalue 9y ago

Have you considered adding the ability to use dithering on this site? I made a similar tool a while back (to convert an image to an arbitrary color palette), and one of the main things I learned was how powerful dithering can be. For example, here are two images I created using my old tool to convert an image to the C64 color palette. Unlike the website, my tool isn't currently capable of doing the double-wide horizontal pixels, but it still illustrates the effect I think: Without dithering: http://imgur.com/nQL0y6i http://imgur.com/nQL0y6i With dithering: http://imgur.com/jfwUgnC http://imgur.com/jfwUgnC If you're interested, Wikipedia has a great example (with code) of the Floyd-Steinberg dithering algorithm, for example: https://en.wikipedia.org/wiki/Floyd%E2%80%93Steinberg_dithering https://en.wikipedia.org/wiki/Floyd%E2%80%93Steinberg_dither..., which I imagine wouldn't be too hard to integrate into your site.

deleted 9y ago
[deleted]

errozero 9y ago

Cool! I've got an urge to go out and take some photos, run them through this and create a retro adventure game. Do you think it would be possible to do the image conversion in Javascript so it does not need to be uploaded to the server?

windows3095 9y ago
The "C64ication" (if that's what you mean by conversion) actually happens purely in JavaScript - if I understand the source correctly, the image is only _resized_ on the server.. but the whole shebang can be done client-side. Yep. Would be awesome if the author(s) released this as a MIT licensed JS lib. Would love to use and credit it myself! :-)