Convertir fotos con dithering de Atkinson

 (gazs.github.io)
1 puntos por GN⁺ 2025-06-08 | 1 comentarios | Compartir por WhatsApp
  • Convierte fotos al estilo del filtro de 1 bit del Macintosh clásico, aplicando el efecto de dithering de Atkinson usando solo píxeles en blanco y negro
  • Cada píxel se convierte en negro o blanco tomando como base un gris del 50%, y el error de conversión se distribuye a los píxeles cercanos
  • El error se reparte en 1/8 para cada una de las 6 posiciones alrededor del píxel actual, creando una imagen en blanco y negro con una textura característica
  • La imagen resultante se puede guardar con clic derecho, pero por limitaciones del navegador no se puede arrastrar al escritorio para guardarla
  • La implementación usa Canvas, Drag and Drop events, WebWorkers y la API de FileReader, y requiere un navegador moderno

Cómo funciona el procesamiento de dithering de Atkinson

  • Esta implementación recrea el filtro clásico de 1 bit de Macintosh usado en Hyperdither y HyperScan
  • El proceso compara cada píxel con un gris del 50% para convertirlo en negro o blanco
  • La diferencia entre el valor de entrada y el valor de salida que se genera durante la conversión se distribuye entre los píxeles cercanos
    • 1/8 para cada una de las 2 posiciones a la derecha del píxel actual X
    • 1/8 para cada una de las 3 posiciones de la fila siguiente, comenzando desde la izquierda
    • 1/8 para 1 posición a la izquierda en la fila de abajo

Uso de la demo y requisitos del navegador

  • La imagen renderizada se puede guardar con clic derecho
  • Por limitaciones del navegador, no se puede arrastrar para guardar la imagen al escritorio
  • El código usa Canvas, Drag and Drop events, WebWorkers y la API de FileReader
  • Se necesita un navegador moderno para ejecutarlo

Lecturas relacionadas

1 comentarios

 
GN⁺ 2025-06-08
Opiniones en Hacker News

  • Sigue siendo mi algoritmo de dithering en blanco y negro favorito
    En la universidad había un escáner plano en blanco y negro conectado a una Mac, y probablemente con un stack de HyperCard podías escanear imágenes y convertirlas en imágenes en blanco y negro
    Cuando empecé a hacer juegos shareware para Mac, alrededor de 1988, escaneaba rápidamente libros de clip art que compraba en la librería de la universidad y los usaba como “logos”
    En ese momento no sabía qué tan bueno era el algoritmo de Atkinson, pero después, al hacer dithering con otros algoritmos, me di cuenta de lo bien que se difundía en el código de Bill
    Hace poco, mientras hacía un proyecto de calendario con eInk, quería crear una serie de imágenes “estilo Atkinson” a partir de fotos de la luna en distintas fases, así que encontré un sitio parecido al enlazado y apliqué dithering de Atkinson a las fotos de la luna [1]
    [1] Ver la luna en la captura: https://github.com/EngineersNeedArt/SystemSix/blob/10f2332b5...

    • ¡Realmente hermoso! Si hay algún lugar donde se pueda ver el código de Bill, me gustaría trastear con él y aprender

  • Es mejor no hacer clic en “as follows” del cuadro de diálogo de información
    Parece que no se ha actualizado en un buen tiempo y, mientras tanto, el enlace se volvió NSFW

  • La implementación es excelente, y podría mejorar un poco si se le pasa un valor al atributo download del anchor para darle al archivo descargado un nombre predeterminado y la extensión .png
    Referencia: https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorE...

  • ¿Por qué no dithering Sierra?
    https://tannerhelland.com/2012/12/28/dithering-eleven-algori...

    • Originalmente era nostalgia por las primeras Mac, y parece haber vuelto a surgir porque Bill Atkinson acaba de fallecer

  • Estoy haciendo, en ratos libres, algo que permite convertir varias imágenes a MacPaint y meterlas en una imagen de disco en formato MFS de 400k
    https://github.com/minorbug/mfsjs
    Este proyecto lleva varios meses juntando un poco de polvo en mi directorio home
    Usé Gemini Deep Research para ayudarme a crear la biblioteca, y también incluí el Markdown generado por el LLM para quien quiera reproducirlo o mejorarlo en otro lenguaje

    • Dice que “las imágenes de MacPaint tienen un formato fijo con una resolución de 576 x 720 píxeles”, pero ¿de verdad era un formato fijo?
      Wikipedia también lo dice, pero no tiene fuente

  • Esta implementación es excelente y la interfaz también despierta nostalgia
    Me preguntaba por qué hoy habían aumentado las visitas a mi web component de dithering Atkinson[0], pero fue por la triste noticia
    Siempre pensé que el dithering de Atkinson producía las imágenes más agradables en monitores muy nítidos como los de las Mac originales
    Se ve genial y muy ochentero, así que también lo usé en un juego el año pasado
    [0] https://sheep.horse/2023/1/improved_web_component_for_pixel-...

    • Hacer dithering a nivel de píxel en una pantalla Retina es bastante peculiar
      En algunas fotos el estilo encaja bastante bien, y en otras no
      Tiene una vibra antigua extrañamente moderna, y los puntos individuales no molestan como en las fotos antiguas reales

  • Si quieres probarlo en Python, existe hyperdither
    https://github.com/tgray/hyperdither

    • Al hacer scroll, las imágenes del README se vuelven marrones

  • Parece que encajaría muy bien con dispositivos eInk/ePaper

  • ¿Es el mismo Atkinson que falleció hoy, y esto es un homenaje?

    • En cierto modo sí, pero el primer commit del repositorio fue hace 15 años, así que no es algo hecho a las apuradas por la noticia
    • Sí, él inventó este algoritmo
      Probablemente sea un homenaje
      Corrijo: “inventó”, no “descubrió”. Ver abajo

  • Hice https://atkinson.franzai.com/ porque quería aprender un poco más sobre el algoritmo
    Lo volví a verificar con varias IA, así que espero que los datos sean correctos