これは、processingで作った８×８ドット絵作成ソフトです。 ８×８の画面にポチポチ置いていくだけで絵が描けます。

This is 8 × 8 dot picture making software made by processing. You can draw a picture simply by placing it in an 8 x 8 screen.

Download zip file here ↓

ProcessingのZipダウンロードは、こちら

ソースコードを以下に公開していますので、色を増やしたりして、ドット絵を楽しんでみてください。マインクラフト風の画像を作成するのに便利です。

Since the source code is released to the following, please increase the color and enjoy the dot picture. It is convenient to create a Minecraft style image.

PImage data;
PImage pal;
PImage bg;
PFont font;
void setup() {
  font = loadFont("font.vlw"); 
  textFont(font, 16);
  data = loadImage("cha.png");
  pal = loadImage("pal.png");
  bg = loadImage("bg.png");
  size(512, 256); 
  frameRate(60);
  noStroke();
  noSmooth();
}
int cx;
int cy;
int mx;
int my;
color col;
boolean bott(String text, float x, float y) {
  boolean out = false;
  fill(0, 200);
  rect(x, y, 64+12, 17+32-13);
  stroke(0);
  if (mousePressed) {
    if (my > y+17 && my < y+17+16) {
      if (mx > x && mx < x+73) {
        out = true;
      }
    }
  }
  fill(255);
  if (out)fill(128);
  rect(x+1, y+17, 73, 16);
  noStroke();
  fill(255);
  text(" "+text, x, y+15);
  return out;
};
int gui(String text, float x, float y) {
  fill(0, 200);
  rect(x, y, 64+12, 17+32-13);
  int a = 0;
  stroke(0);
  if (mousePressed) {
    if (my > y+17 && my < y+17+16) {
      if (mx > x && mx < x+32) {
        a = -1;
      }
      if (mx > x+32 && mx < x+64) {
        a = 1;
      }
    }
  }
  fill(255);
  if (a < 0)fill(128);
  rect(x+1, y+17, 32, 16);
  fill(255);
  if (a > 0)fill(128);
  rect(x+32+9+1, y+17, 32, 16);
  noStroke();
  fill(0);
  text("  -1        1", x, y+14+17);
  fill(255);
  text(" "+text, x, y+15);
  return a;
};
float cl,pla;
int cha;
;
int gcx = 0;
int gcy = 0;
int pll;
int clox = 8;
int cloy = 4;
int palx;
int paly;
PImage temp0;
PImage temp1;
void draw() {
  temp0 = null;
  temp0 = createImage(9,9,ARGB);
  temp0 = data.get(gcx*8, gcy*8, 8, 8);
  temp1 = pal.get(palx*4, paly*4, 4, 4);
  mx = mouseX;
  my = mouseY;
  if (mx < 1)mx = 1;
  if (my < 1)my = 1;
  background(255);
  image(bg, 0, 0, 256, 256);
  image(bg, 256, 0, 256, 256);
  image(temp0, 0, 0, 256, 256);
  image(temp1, 256, 128, 256, 128);
  int s = 1;
  if (cx >= 8 && cy >= 4) {
    cx = ((mx)/64)*2;
    cy = (my)/32;
    if (mousePressed) {
      clox = (((mx)/64)*2);
      cloy = (my)/32;
      if (clox < 8)clox = 8;
      if (cloy < 4) {
        cloy = 4;
      }
    }
    s = 2;
  } else {
    cx = (mx)/32;
    cy = (my)/32;
    if (cx < 0)cx = 0;
    if (cy < 0)cy = 0;
    if (mousePressed) {
      //data.set(cx+(gcx*8), cy+(gcy*8), col);
      data.loadPixels();
      data.pixels[(cy+(gcy*8))*data.width +(cx+(gcx*8))] = col;
      data.updatePixels();
      //data.save("data.png");
    }
  }
  if (cx >= 8) {
    if (cy < 4) {
      cy = 4;
    }
  }
  if (cx < 0)cx = 0;
  if (cy < 0)cy = 0;
  noFill();
  stroke(255, 0, 0);
  rect(cx*32, cy*32, 32*s, 32);
  stroke(0, 0, 255);
  rect((clox)*32, cloy*32, 64, 32);
  col = temp1.get((clox/2)-4, cloy-4);
  //println(red(col), green(col), blue(col), alpha(col));
  stroke(red(255-col), green(255-col), blue(255-col));
  point((clox)*32+32, cloy*32+16);
  //println(clox);
  noStroke();
  fill(255, 0, 0);
  rect(mx-4, my-4, 8, 8);
  if (cy >= 8)cy = 8-1;
  if (cx <  0)cx = 0;
  if (cy <  0)cy = 0;
  cl += (float)gui("キャラ:"+nf(cha, 3), 256, 0)/6;
  pla += (float)gui("パレット:"+nf(pll, 2), 256+64+12+4, 0)/12;
  if(bott("   セーブ",256+64+12+4+64+12+4,0)){
    data.save("cha.png");
  }
  cha = int(cl);
  pll = int(pla);
  if(cha < 0)cha = 0;
  if(cha >= 256)cha = 255;
  if(pll < 0)pll = 0;
  if(pll >= 4)pll = 3;
  if(pll == 0){
    palx = 0;
    paly = 0;
  }
  if(pll == 1){
    palx = 1;
    paly = 0;
  }
  if(pll == 2){
    palx = 0;
    paly = 1;
  }
  if(pll == 3){
    palx = 1;
    paly = 1;
  }
  gcx = 0;
  gcy = 0;
  for (int i = 0; i < cha; i++) {
    gcx++;
    if (gcx >= 16) {
      gcx = 0;
      gcy++;
    }
  }
}

使用画像です。⇩Used images, here ↓