a#$%0ß@").toCharArray();
> boolean invert = false;
> void setup() {
> size(640, 600);
> w = width/s;
> h = height/s;
> source = loadImage("data/source.png");
> textSize(s);
> }
> void draw() {
> background(255);
> image(source,0,0);
> noStroke();
> for (int i = 0; i < w; i++) {
> for (int j = 0; j < h; j++) {
> float val = getAvg(get(i*s,j*s,s,s));
> fill(val);
> rect(i*s, j*s, s, s);
> char replace = (( (invert)? (chr[floor(map(val,255,0,0,chr.length-0.01))]) : (chr[floor(map(val,0,255,0,chr.length-0.01))])));
> print(replace+" ");
> }
> println();
> }
> noLoop();
> }
> float getValue(char input) {
> PGraphics temp = createGraphics(s, s);
> temp.beginDraw();
> temp.background(0);
> temp.textSize(s);
> temp.textAlign(3, 3);
> temp.fill(0);
> temp.text(input, s*0.5, s*0.5);
> temp.endDraw();
> return getAvg(temp);
> }
> float getAvg(PImage input) {
> input.filter(GRAY);
> float sum = 0, imgW = input.width, imgH = input.height;
> for (int i = 0; i < imgW; i++) for (int j = 0; j < imgH; j++) sum += red(input.get(i, j));
> float avg = sum/(imgW*imgH);
> return (avg);
> }
>
> ```
Instructions - create a “source.png” inside of the sketches data folder to use.
---
### Author:  [@VOIDupgraded](https://discourse.processing.org/u/VOIDupgraded)
#### Post date: [June 1, 2021, 10:10pm UTC](https://discourse.processing.org/t/image-to-characters-ascii-art/28371/2 "2021-06-01T22:10:54Z")
# 😮 Really nice!
I have an idea in my bucket list to do something like this, but in video and with color, but just by looking at this code 😫 I still have a lot to learn.
---
### Author:  [@CodeMasterX](https://discourse.processing.org/u/CodeMasterX)
#### Post date: [June 2, 2021, 9:33am UTC](https://discourse.processing.org/t/image-to-characters-ascii-art/28371/3 "2021-06-02T09:33:15Z")
Don’t worry, the program I wrote for this is needlessly complicated. I made it like that to make it easier to output. You could start doing it with images and getting frames of images from it and after that just get the colors from the pixels. I am sure you could do it soon, but the best way to progress is with taking a step at the time. After all, “Even with the smallest step forwards, you are still making a difference”
Try to replicate this program with your own skills. After that, try to make it usable with colors. After that create a program that reads all of the frames out of the movie, put them through ascii-isation function and save it on the computer. When you are done, put the whole thing into the processing movie maker, which will return a .mov file, that you can put into a video editor software and transform it to .mp4
---
### Author:  [@CodeMasterX](https://discourse.processing.org/u/CodeMasterX)
#### Post date: [June 2, 2021, 9:34am UTC](https://discourse.processing.org/t/image-to-characters-ascii-art/28371/4 "2021-06-02T09:34:31Z")
the thing is that you would need to display the ascii image on the canvas to acheive colors. It is a bit troublesome, but if you can do the previous steps, you can do it easily. Good luck!
---
### Author:  [@VOIDupgraded](https://discourse.processing.org/u/VOIDupgraded)
#### Post date: [June 2, 2021, 12:11pm UTC](https://discourse.processing.org/t/image-to-characters-ascii-art/28371/5 "2021-06-02T12:11:19Z")
I remember messing around with the ASCII webcam example, and trying to make it work in a grid, but ending nowhere, but I will use your code as reference when I try again, but before I have a few ideas I want to work first. If I run into trouble in the future regarding this topic I may come ask for help.
---
### Author:  [@pokelan](https://discourse.processing.org/u/pokelan)
#### Post date: [June 2, 2021, 2:05pm UTC](https://discourse.processing.org/t/image-to-characters-ascii-art/28371/6 "2021-06-02T14:05:37Z")
Thanks for your code!
What does the question mark in “(invert)?” do?
---
### Author:  [@CodeMasterX](https://discourse.processing.org/u/CodeMasterX)
#### Post date: [June 4, 2021, 12:13pm UTC](https://discourse.processing.org/t/image-to-characters-ascii-art/28371/7 "2021-06-04T12:13:28Z")
Hi!
`((invert)? a : b)` is a useful thing.
The actual structure of it is:
`((boolean)? valueIfTRUE : valueIfFALSE)`
it is useful if you have a lot of conditions and don’t want to keep using if() else(). valueIf----- can only be a value. You cannot do something like `((random(100)>50)? doThis() : doThat())`
I hope this short “guide” will be of help in any way in your coding.
---
### Author:  [@pokelan](https://discourse.processing.org/u/pokelan)
#### Post date: [June 4, 2021, 6:45pm UTC](https://discourse.processing.org/t/image-to-characters-ascii-art/28371/8 "2021-06-04T18:45:06Z")
That made it clear for me! 🙂
---
### Author:  [@ru6y](https://discourse.processing.org/u/ru6y)
#### Post date: [May 23, 2022, 11:16am UTC](https://discourse.processing.org/t/image-to-characters-ascii-art/28371/9 "2022-05-23T11:16:02Z")
is there a way to get the ascii art out of the console and to portrait as a picture if you run the code? cause atm the picture is shown as pixels instead of the ascii characters and the characters only show in the console
---
### Author:  [@CodeMasterX](https://discourse.processing.org/u/CodeMasterX)
#### Post date: [June 5, 2022, 8:19pm UTC](https://discourse.processing.org/t/image-to-characters-ascii-art/28371/11 "2022-06-05T20:19:06Z")
> [@CodeMasterX](#):
>
> `print(replace+" ");`
replace this with `text(replace, i*scale, j * scale) ` and define variable scale as width/w. this should do the trick. However, I haven’t seen the code in 15 months, so it may be a bit different. Good luck