Difference between revisions of "Text Images"

From Publication Station
 
(32 intermediate revisions by 2 users not shown)
Line 1: Line 1:
Text Images
'''Text Images'''


==Dates==
Pad: https://stuff2233.club/padlife/p/text-images
22Jan-2Feb. Tuesday - Friday. 13:00-16:00.


Room
[[File:shell-animations.mp4|600px|shell animations]]


 
{{:Text_Images/documentation}}
==Description==
 
The following elective will be based on the project [http://luciadossin.net/excelfie.html Excelfie] by design Lucia Dossin, where selfie (images), captured by a digital camera are converted onto plain-text files (ASCII-art). In these text-based images, the sequence of pixels of the captured images is mapped onto corresponding text characters, in order to create text-based rendition of the original bit map image.
 
[[File:3excelfie-derivation1.png|400px|right]]
 
[[File:excelfie-2017-11-12-18.28.12.jpg|Excelfie at Zinecamp 2017|400px|right]]


===Announcement text===
===Announcement text===
What are digital (bit-map) images? In their simpler form nothing more but sequence of pixels, each with its color value, organized into lines and rows. Such form of representing image information is uncannily similar to how text is represented digitally: a line-by-line sequence of characters, each with its corresponding value (code point). Can this similarity be used to transform pixel-based images into similar looking images made solely by text? And what happens when we reverse the process and try to get  the text-based images into pixels using Optical Character Recognition software?
What are digital (bit-map) images? In their simpler form nothing more but sequence of pixels, each with its color value, organized into lines and rows. Such form of representing image information is uncannily similar to how text is represented digitally: a line-by-line sequence of characters, each with its corresponding value (code point). Can this similarity be used to transform pixel-based images into similar looking images made solely by text?  




==Material ==
==Material ==
We will work towards the implementation of the Excelfie in the Publication Station, for which we'll use:
* raspberry Pi
* raspberry Pi
* camera (webcam)
* camera (webcam)
* LCD screen (HDMI input)  
* LCD screen (HDMI input)  
* headphones
* speakers (from action)
* typewriter
* typewriter


===Raspberry Pi software===
* Ascii art: figlet cowsay jp2a  [https://www.dyne.org/software/hasciicam/ hasciicam]
* imaging: imagemagick fbi
* audio: espeak
* editor: ne (nice editor)
=Sessions=
==Day 1 - Tue 23Jan==
===Excelfie===
http://luciadossin.net/excelfie.html


What is happening in this work?


==Organization==
[[File:3excelfie-derivation1.png|400px|right]]


ASCII Art
[[File:excelfie-2017-11-12-18.28.12.jpg|Excelfie at Zinecamp 2017|400px|right]]
* ASCII & Plain text
** origins of ASCII encoding
** previous encodings
** current encoding: Unicode


Typewriter Art
===Typewriter Art===
** vitality of type writer art
[[File:TypewriterArt.jpg|500px]]


Bit maps:  
[https://monoskop.org/log/?p=11300 Download PDF]
* sequences of pixels
* color depth


Plain-text image formats
[[File:typewritermanual.jpg|300px]]
[[File:newspaper.jpeg|700px]]


Capturing images


Assembling All Together


------
===ASCII Art===
=ASCII=
<pre>
==ASCII encoding==
_______________
< ASCII??ART??? >
---------------
        \  ^__^
        \  (xx)\_______
            (__)\      )\/\
            U  ||----w |
                ||    ||


==ASCII Art==
</pre>


<blockquote>
<blockquote>
Line 76: Line 80:




=== ascii software ===
* figlet - display large characters made up of ordinary screen characters
* cowsay - cowsay/cowthink - configurable speaking/thinking cow
* jp2a - convert JPEG images to ASCII


=Bit maps=


==bit maps: sequences of pixels==


== color depths==
===ASCII encoding===
** 1-bit color (2 colors): monochrome, often black and white,
[[File:USASCII_code_chart.png|500px]]
** 2-bit color (4 colors)
 
** 3-bit color (8 colors)
{{youtube|MijmeoH9LT4}}
** 4-bit color (16 colors)
 
** 5-bit color (32 colors)
 
** 6-bit color (64 colors)
 
** 8-bit color (256 colors)
 
** 8-bit greyscale (256 grey colors): each pixel represents only an amount of light (intensity information)
===Plain-text===
** 12-bit color (4096 colors):
{| class="wikitable" border="1"
** 24-bit True color (16777216 colors):  256 shades of each color channel red, green, and blue
|-
! Plain-text files
! Binary files
|-
| Each byte (8bits sequence) represents one ASCII character
| there is no one-to-one mapping between bytes and characters
|-
| Do not include any formatting information: only text
| Can have all sorts of formatting, like a Word doc, PDF, or image
|-
| are read/written with plain-text editors; or <code>less</code> <code>cat</code> commands 
| data can be interpreted by supporting programs, but will show up as garbled text in a text need specific applications, depending on the file, i.e.  Word for .doc. PDF-viewer for PDF
|-
| Are less likely to become corrupted, a small error shows up as a typo
| A small error may make it unreadable
|- 
| common file formats: ??
| common file formats: ??
|}
 
===Exercise: a text-based image===
Create a piece of typewriter art or ASCII art.
 
==Day 2 - Wed 24Jan ==
===UNIX===
* it was '''time-sharing''' system, allowing for mutiples users to login to the machine <code>ssh username@machineIP</code>
* included the '''shell:''' a program which performs command line interpretation 
** <code>whoaim</code>
** <code>pwd</code> '''p'''rint '''w'''orking '''d'''irectory - where am I?
** <code>date</code>
** <code>users</code> print the user names of users currently logged in to the current host
** <code>history</code> commands' history
* tree-structured file system
** <code>tree ~/</code> list contents of home (~ == /home/username ) in a tree-like format
** <code>ls ~</code> list files and directories in your user home ( ~ == /home/username ) 
** <code>ls .</code> list files and directories in current directory ( . == current dir ) 
** <code>ls ../</code> list files and directories in parent directory ( . == current dir ) 
** <code>ls foo/</code> list files and directories in child foo/ directory
** <code>ls /</code> list files and directories in root ( / == root )
* every thing is a file
** <code>ls -R / > /dev/dsp </code> file-system as sound
Others emerged from the development and use of the system and crystallized  into the ''Unix Philosophy'':
* '''Write programs that do one thing and one thing well'''
** <code>ls</code> lists files in a directory
** <code>cat</code> outputs content of file
** <code>wc</code> counts number of words in file
* '''Write programs that work together'''
** <code>echo "hello UNIX world" | sed 's/o/0/g' | sed 's/e/3/g' | sed 's/l/1/g' | figlet</code>
* '''Write programs that handle text streams, because that is a universal interface'''
** <code>man -a intro | espeak</code> Linux introduction to user commands.
 
 
===Essential commands===
For a PDF with Unix/Linux Command Reference - download the following [https://files.fosswire.com/2007/08/fwunixref.pdf link]
 
==== System Info ====
 
'''date''' – Show the current date and time<br /> '''cal''' – Show this month's calendar<br /> '''uptime''' – Show current uptime<br /> '''w''' – Display who is online<br /> '''whoami''' – Who you are logged in as<br /> '''finger ''user''''' – Display information about '''''user'''''<br /> '''uname -a''' – Show kernel information<br /> '''cat /proc/cpuinfo''' – CPU information<br /> '''cat /proc/meminfo''' – Memory information<br /> '''df''' '''-h''' – Show disk usage<br /> '''du''' – Show directory space usage<br /> '''free''' – Show memory and swap usage
 
==== Keyboard Shortcuts ====
 
'''Enter''' – Run the command<br /> '''Up Arrow''' – Show the previous command<br /> '''Ctrl + R''' – Allows you to type a part of the command you're looking for and finds it
 
'''Ctrl + Z''' – Stops the current command, resume with '''fg''' in the foreground or '''bg''' in the background<br /> '''Ctrl + C''' – Halts the current command, cancel the current operation and/or start with a fresh new line<br /> '''Ctrl + L''' – Clear the screen
 
'''''command'' | less''' – Allows the scrolling of the bash command window using '''Shift + Up Arrow''' and '''Shift + Down Arrow'''<br /> '''!!''' – Repeats the last command<br /> '''''command ''''' '''!$''' – Repeats the last argument of the previous command<br /> '''Esc + . (a period)''' – Insert the last argument of the previous command on the fly, which enables you to edit it before executing the command
 
'''Ctrl + A''' – Return to the start of the command you're typing<br /> '''Ctrl + E''' – Go to the end of the command you're typing<br /> '''Ctrl + U''' – Cut everything before the cursor to a special clipboard, erases the whole line<br /> '''Ctrl + K''' – Cut everything after the cursor to a special clipboard<br /> '''Ctrl + Y''' – Paste from the special clipboard that '''Ctrl + U''' and '''Ctrl + K''' save their data to<br /> '''Ctrl + T''' – Swap the two characters before the cursor (you can actually use this to transport a character from the left to the right, try it!)<br /> '''Ctrl + W''' – Delete the word / argument left of the cursor in the current line
 
'''Ctrl + D''' – Log out of current session, similar to '''exit'''
 
==== Learn more about Commands/programs ====
 
'''apropos''' '''''subject''''' – List manual pages for '''''subject'''''<br /> '''man -k ''keyword''''' – Display man pages containing '''''keyword'''''<br /> '''man ''command''''' – Show the manual for '''''command'''''<br /> '''man -t ''man'' | ps2pdf - &gt; ''man.pdf'''''  – Make a pdf of a manual page<br /> '''which''' '''''command''''' – Show full path name of '''''command'''''<br /> '''time ''command''''' – See how long a '''''command''''' takes
 
'''whereis ''app''''' – Show possible locations of '''''app'''''<br /> '''which ''app''''' – Show which '''''app''''' will be run by default; it shows the full path
 
==== File Commands ====
 
'''ls''' – Directory listing<br /> '''ls -l''' – List files in current directory using long format<br /> '''ls -laC''' – List all files in current directory in long format and display in columns<br /> '''ls -F''' – List files in current directory and indicate the file type<br /> '''ls -al''' – Formatted listing with hidden files
 
'''cd ''dir''''' – Change directory to '''''dir'''''<br /> '''cd''' – Change to home<br /> '''mkdir''' '''''dir''''' – Create a directory '''''dir'''''<br /> '''pwd''' – Show current directory
 
'''rm ''name''''' – Remove a file or directory called '''''name'''''<br /> '''rm''' '''''-r dir''''' – Delete directory '''''dir'''''<br /> '''rm -f ''file''''' – Force remove '''''file'''''<br /> '''rm -rf ''dir''''' – Force remove an entire directory '''''dir''''' and all it’s included files and subdirectories (use with extreme caution)
 
'''cp ''file1 file2''''' – Copy '''''file1''''' to '''''file2'''''<br /> '''cp -r ''dir1 dir2''''' – Copy '''''dir1''''' to '''''dir2'''''; create '''''dir2''''' if it doesn't exist<br /> '''cp ''file'' /home/''dirname''''' – Copy the filename called '''''file''''' to the '''/home/dirname''' directory
 
'''mv ''file'' /home/''dirname''''' – Move the '''''file''''' called filename to the '''''/home/dirname''''' directory<br /> '''mv''' '''''file1 file2''''' – Rename or move '''''file1''''' to '''''file2'''''; if '''''file2''''' is an existing directory, moves '''''file1''''' into directory '''''file2'''''
 
'''more ''file''''' – Display the file called '''''file''''' one page at a time, proceed to next page using the spacebar<br /> '''head ''file''''' – Output the first 10 lines of '''''file'''''<br /> '''head -20 ''file''''' – Display the first 20 lines of the file called '''''file'''''<br /> '''tail ''file''''' – Output the last 10 lines of '''''file'''''<br /> '''tail -20 ''file''''' – Display the last 20 lines of the file called '''''file'''''<br /> '''tail -f ''file''''' – Output the contents of '''''file''''' as it grows, starting with the last 10 lines
 
 
==== SSH ====
 
'''ssh ''user''@''host''''' – Connect to '''''host''''' as '''''user'''''<br /> '''ssh -p ''port user''@''host''''' – Connect to '''''host''''' on port '''''port''''' as '''''user'''''<br /> '''ssh-copy-id ''user''@''host''''' – Add your key to '''''host''''' for '''''user''''' to enable a keyed or passwordless login
 
 
==== meta characters ====
Meta Characters are characters that have special meaning within the terminal
 
* <code>~</code> the tilde stands for the user's home. <code>cd ~/</code> change directory to home
* <code>.</code> dot stands for '''this''' directory. <code>ls .</code> list this directory
* <code>..</code> dot dot stands for '''the parent directory''' to this directory. <code>cp myfile.jpg ..</code> copy myfile.jpg to the parent directory
* <code>*</code> asterisk is a wildcards which represents zero or more characters <code>ls P*.jpg</code> will list all the files, in the current directory, that begin with P and end with .jpg
* <code>\</code> backslash it is a literal character. It escape the meta value of the meta-characters and display them only as literal characters. <code>echo Foo \*</code> will output <code>Foo *</code> If \ wasn't there it would output all the files in that directory.
 
 
==== pipes, write to & append ====
'''A pipes (" | ") sends the output of one program to the input of another program'''.
 
<code>echo "my sentence"| wc</code> the echoed sentence "my sentence" is ''pipped'' into the program wc which counts the number of lines, words, and characters
 
 
<code>></code> Writes the output of a command to a file, rather than to print on terminal.
 
<code>df > df_output.txt </code> redirect the content of <code> man dfM </code> to a file called df_output.txt
 
If the said file doesn't exit it will create it, if it already exists it will overwrite its contents/
 
 
<code>>></code> appends the output of a command to a file, without overwriting the original file.
<code> echo 'also add this' >> df_output.txt </code> will add 'also add this' to the contents of df_output.txt
 
 
===Proto social network tools===
<code>wall</code> - write a message to all users <code>echo "how is the weather in your terminal?|wall"</code>
 
 
<code>write</code> enables you to chat with another user. You can find who is logged in and to which terminal with the <code>who</code> command.
 
Once you got the name and tty of whom you want to chat with you can start writing to him/her
<code>write username tty</code>
 
 
===ASCII Art tools===
 
* figlet - display large characters made up of ordinary screen characters <code> echo "say something big"|figlet</code>
* coway - cowsay/cowthink - configurable speaking/thinking cow <code>echo "look,I am a cow"|figlet</code>
* jp2a - converts JPEG images to ASCII
<code>jp2a image.jpg</code>
 
 
==Day 3 - Wed 25Jan: Bitmap ==
Software:
* imagemagick: a command-line program for image manipulation. We will be using it mainly through the command <code>convert</code> which convert 1 image onto another.
* fbi (frame-buffer image):  displays  the specified file(s) on the linux console using the framebuffer device
 
=== ftp ===
Use [https://filezilla-project.org/ Filezilla] to transfer files from your computer to the Pi and vice-versa
 
== bitmap images ==
You probably have heard before that bitmap images are grids of pixels, where
* resolution: the number of horizontal and vertical pixels. E.g. 1920x1080 is 1920 pixels wide and 1080 high
* color depth: the number of bits used to indicate the color of a single pixel
 
for a good introduction to bit maps see: See Bourke, Paul. n.d. ‘A Beginners Guide to Bitmaps’. Accessed 2 January 2018. http://paulbourke.net/dataformats/bitmaps/.
 
 
===Resolutions: ===
 
Color depth - (use microscope)
* [[Binary image|1-bit color]] (2<sup>1</sup> = 2 colors): '''monochrome''', often black and white, compact [[Macintosh]]es, [[Atari ST]].
* 2-bit color (2<sup>2</sup> = 4 colors): [[Color Graphics Adapter|CGA]], gray-scale early [[NeXTstation]], color Macintoshes, Atari ST.
* 3-bit color (2<sup>3</sup> = 8 colors): many early home computers with TV displays, including the [[ZX Spectrum]] and [[BBC Micro]]
* 4-bit color (2<sup>4</sup> = 16 colors): as used by [[Enhanced Graphics Adapter|EGA]] and by the least common denominator VGA standard at higher resolution, color Macintoshes, Atari ST, [[Commodore 64]], [[Amstrad CPC]].
* 5-bit color (2<sup>5</sup> = 32 colors): [[Original Amiga chipset]]
* 6-bit color (2<sup>6</sup> = 64 colors): Original Amiga chipset
* [[8-bit color]] (2<sup>8</sup> = 256 colors): most early color Unix workstations, [[VGA]] at low resolution, [[Super VGA]], color Macintoshes, [[Atari TT]], [[Advanced Graphics Architecture|Amiga AGA chipset]], [[Falcon030]], [[Acorn Archimedes]].
* 12-bit color (2<sup>12</sup> = 4096 colors): some [[Silicon Graphics]] systems, Color NeXTstation systems, and [[Amiga]] systems in [[Hold And Modify|HAM]] mode.
* '''8-bit color''': A very limited but true direct color system, there are 3 bits (8 possible levels) for each of the R and G components, and the two remaining bits in the byte pixel to the B component (four levels), enabling 256 (8 × 8 × 4) different colors.
* Grey scale (8-bit)
* True color (24-bit): Usually, true color is defined to mean 256 shades of red, green, and blue, for a total of 224, or alternately 2563, or 16,777,216 color variations. The human eye can discriminate up to ten million colors
<ref>https://en.wikipedia.org/wiki/Color_depth</ref>
 
 
{{youtube|06OHflWNCOE}}
 
 
 
 
===converting resolution===
with Imagemagick
 
to 100px wide
convert myimage.jpg -resize 100x output.jpg
 
to 100px  hight
convert myimage.jpg -resize x100 output.jpg
 
to 100x100px (image will loose its proportion; hence the "!" so imagemagick is sure that you wanna do that:)
convert myimage.jpg -resize 100x100! output.jpg
 
===converting color (bit depth)===
 
convert an image into monochrome (1 bit depth) image: 2color values (b/w)
convert myimage.jpg -colorspace gray -depth 1 out.png
 
(2 bit depth) image: 4 color values
convert myimage.jpg -colorspace gray -depth 2 out.png
 
(3 bit depth) image: 8 color values
convert myimage.jpg -colorspace gray -depth 3 out.png
 
(4 bit depth) image: 16 color values
  convert myimage.jpg -colorspace gray -depth 4 out.png
 
(8 bit depth) image: 256 color values
convert myimage.jpg -colorspace gray -depth 4 out.png
 
 
How can we be certain about this? How do can we see the grid that forms a bitmap image?
* magnify any digital screen
* a Plain-text bitmap: where you can read each pixel: X PixMap (XPM)
 
[https://en.wikipedia.org/wiki/X_PixMap X PixMap (XPM)] is a plain-text bitmap image format, where each color is assigned a character, which is mapped onto the text space.
 
convert myimage.jpg out.xpm
 
 
<source lang="c">
/* XPM */
static char *output[] = {
/* columns rows colors chars-per-pixel */
"50 73 2 1 ",
"  c black",
". c white",
/* pixels */
"                                                  ",
"                                                  ",
"                                                  ",
"                                                  ",
"              ................                  ",
"          ......  . .. . . .......              ",
"          .. .          .        ...            ",
"        . .  .. .            .    ..          ",
"        .. . .    .    .  .    .    .          ",
"        .  .      .    .  .    . .  ..          ",
"        .  .        .  .      .    . .          ",
"        ...          ..      .      ..          ",
"      ...              .. .        ...          ",
"        ..                            .          ",
"        .                            ..          ",
"        ..                            .          ",
"        .                            ..          ",
"      ...      .                    .          ",
"        .    .                      .          ",
"      ..                            .          ",
"      ..  .    .                  . .          ",
"        .    .                        .          ",
"      ..  .  .....                  .          ",
"        .    ..  ..                  .          ",
"        .  .      ..            .  .          ",
"      .  ..        .              ..          ",
"      .. .    .    .            .....          ",
"          .  ...    .          .    .          ",
"      .  .  ....  ..          .    ..          ",
"      . ..  ....              .      .          ",
"        . .          .          .    ....        ",
"      .  .          .          ..  ...          ",
"          .          .          .    ..          ",
"      ..  .        .            .    .          ",
"      .  .      ..            .    .          ",
"      .    ..  ..              ..  ..          ",
"      ..    ...                  ... .          ",
"      ..                              ..        ",
"      .                  .  .      .  .        ",
"    .  .  ..                          .        ",
"    .  . ....                    .    .        ",
"    .    ..  ...  .              ..  ..        ",
"    .. .  ..  .....  . ..  .  ...  .          ",
"      .    ... ..  ....          ....  .          ",
"      .    .....  ......    ...... .          ",
"      ..    . ..... .  ......... ... .          ",
"        ..  .........  .. .  ...... .          ",
"        .    ..  ....................          ",
"        .    ..  . ............... .          ",
"          .    .. ..  ............. .          ",
"          .      ..    .  .  .....  .          ",
"          ...  .  ...  .  .. ......  .          ",
"            ... .    .............    .          ",
"              ..  .      ..          .          ",
"              ...  ..                          ",
"                ...    .    .      ..          ",
"                  ..            .    .          ",
"                    ..              .          ",
"                      ....          ..          ",
"                          .....  ....            ",
"                              .....              ",
"                                                  ",
"                                    .            ",
"                  ..  .            ...          ",
"        ...  .. ..  ... .. .. ...... ...          ",
"        ............................  ..          ",
"        ...... ................. ...  .          ",
"        ......  ... ... ..... .... .. .          ",
"        ..                                        ",
"        .                                        ",
"                                                  ",
"                                                  ",
"                                                  "
};
 
</source>
 
 
 
 
{{Youtube|UBX2QQHlQ_I}}
 
==Day 3- Thursday ==
 
===ASCII animation===
=== ne: nice editor===
 
F1 - menu
 
==Day 4 Friday==
* FTP
* Dot matrix
* sound
 
==Sound==
===espeak===
echo "Can you hear me?" | espeak
 
===mpv===
mpv audiofile.mp3
 
 
===Dot Matrix printers:  escpos===
Using python [https://python-escpos.readthedocs.io/en/latest/api/escpos.html escpos ]
 
with Kube
 
 
 
With the Fujitsu DL6600:
<source lang="python">
In [11]: f=Serial(devfile=u'/dev/ttyUSB0', baudrate=9600, bytesize=8, timeout=1, parity='N', stopbits=1, xonxoff=False, dsrdtr=True)
Serial printer enabled
 
In [12]: f.text('test')
 
In [13]: f.close()
</source>
 
==Day 4 - Friday 26Jan: Bitmap outside the screen ==
The challenge for today is how to do we get out bitmap/ascii-art/plain-text image out from the screen and materialize it into something.
* a silk screen print ?
* a sound composition
* ?
 
 
 
-----
 
 
==Capturing image==
* fswebcam/xawtv: capture camera
fswebcam: no visual feedback
fswebcam --device  /dev/video0 --no-banner --save test.jpg
 
mpv: screen shot by typing "s"
mpv /dev/video0
 
------
 
 
 
 
= Capturing camera input =


==plain-text image formats==
= Assembling it all =
** [https://en.wikipedia.org/wiki/X_PixMap#XPM3 X PixMap]  (.xpm)
** [https://en.wikipedia.org/wiki/Netpbm_format NetPBM]
*** Portable BitMap[1] P1 P4 .pbm 0–1 (white & black)
*** Portable GrayMap[2] P2 P5 .pgm 0–255 (gray scale)
*** Portable PixMap[3] P3 P6 .ppm 0–255 (RGB)


== references ==


‘Ascii vs. Binary Files’. n.d. Accessed 2 January 2018. https://www.cs.umd.edu/class/sum2003/cmsc311/Notes/BitOp/asciiBin.html.
=Pi cheat sheet=
display image in Terminal 1 with 
fbi capture.jpg -T 1


Borzyskowski, George. n.d. ‘THE HACKER DEMO SCENE AND IT’S CULTURAL ARTIFACTS’. Accessed 2 January 2018. http://artscene.textfiles.com/history/essays/borzysko.txt.
picam; but Picam seems difficult to work with other software - should try webcam


Bourke, Paul. n.d. ‘A Beginners Guide to Bitmaps’. Accessed 2 January 2018. http://paulbourke.net/dataformats/bitmaps/.
raspistill -o test.jpg


‘Digital Art Guild - Portait of the Artist as a Young Scientist by Ken Knowlton’. n.d. Accessed 2 January 2018. http://www.digitalartguild.com/content/view/26/26/.
There is a python module for it: https://pzwiki.wdka.nl/mediadesign/PiCam


Ippgi. n.d. ‘History of the Scene: The Beginnings of the IBM-PC Underground’. Accessed 2 January 2018. http://artscene.textfiles.com/information/history.html.
= references =


Thomas, Matthew. n.d. ‘Welcome to Ascii-Art’. Accessed 2 January 2018. http://artscene.textfiles.com/information/faq-altasciiart.txt.
<references/>

Latest revision as of 09:56, 17 October 2019

Text Images

Pad: https://stuff2233.club/padlife/p/text-images

Text Images/documentation

Announcement text

What are digital (bit-map) images? In their simpler form nothing more but sequence of pixels, each with its color value, organized into lines and rows. Such form of representing image information is uncannily similar to how text is represented digitally: a line-by-line sequence of characters, each with its corresponding value (code point). Can this similarity be used to transform pixel-based images into similar looking images made solely by text?


Material

  • raspberry Pi
  • camera (webcam)
  • LCD screen (HDMI input)
  • speakers (from action)
  • typewriter

Raspberry Pi software

  • Ascii art: figlet cowsay jp2a hasciicam
  • imaging: imagemagick fbi
  • audio: espeak
  • editor: ne (nice editor)


Sessions

Day 1 - Tue 23Jan

Excelfie

http://luciadossin.net/excelfie.html

What is happening in this work?

3excelfie-derivation1.png
Excelfie at Zinecamp 2017

Typewriter Art

TypewriterArt.jpg

Download PDF

Typewritermanual.jpg Newspaper.jpeg


ASCII Art

 _______________
< ASCII??ART??? >
 ---------------
        \   ^__^
         \  (xx)\_______
            (__)\       )\/\
             U  ||----w |
                ||     ||

ASCII art is text art created with ASCII, a protocol established by the American National Standards Institute (ANSI), which is America's representative to the International Organization for Standardization (IOS). ASCII art uses ASCII text characters to produce images. The emoticon, an element of text messaging and email, is an example of ASCII art at its most popular and functional. [1]

Ascii Art as an idea coalesced into existence bceause people

wanted more. They wanted more than just your standard Hercules display Atari or your Monochrome Commodore 64. To meet this demand, one singular artist, whose name is lost to the annals of history decided to take the plunge. Instead of text, he (or she) had the ingenuity to use the characters /, \, |, -, _ and whatever else came to mind to create words. An amazing idea. [2]



ASCII encoding

USASCII code chart.png

{{#widget:Youtube|id=MijmeoH9LT4}}



Plain-text

Plain-text files Binary files
Each byte (8bits sequence) represents one ASCII character there is no one-to-one mapping between bytes and characters
Do not include any formatting information: only text Can have all sorts of formatting, like a Word doc, PDF, or image
are read/written with plain-text editors; or less cat commands data can be interpreted by supporting programs, but will show up as garbled text in a text need specific applications, depending on the file, i.e. Word for .doc. PDF-viewer for PDF
Are less likely to become corrupted, a small error shows up as a typo A small error may make it unreadable
common file formats: ?? common file formats: ??

Exercise: a text-based image

Create a piece of typewriter art or ASCII art.

Day 2 - Wed 24Jan

UNIX

  • it was time-sharing system, allowing for mutiples users to login to the machine ssh username@machineIP
  • included the shell: a program which performs command line interpretation
    • whoaim
    • pwd print working directory - where am I?
    • date
    • users print the user names of users currently logged in to the current host
    • history commands' history
  • tree-structured file system
    • tree ~/ list contents of home (~ == /home/username ) in a tree-like format
    • ls ~ list files and directories in your user home ( ~ == /home/username )
    • ls . list files and directories in current directory ( . == current dir )
    • ls ../ list files and directories in parent directory ( . == current dir )
    • ls foo/ list files and directories in child foo/ directory
    • ls / list files and directories in root ( / == root )
  • every thing is a file
    • ls -R / > /dev/dsp file-system as sound

Others emerged from the development and use of the system and crystallized into the Unix Philosophy:

  • Write programs that do one thing and one thing well
    • ls lists files in a directory
    • cat outputs content of file
    • wc counts number of words in file
  • Write programs that work together
    • echo "hello UNIX world" | sed 's/o/0/g' | sed 's/e/3/g' | sed 's/l/1/g' | figlet
  • Write programs that handle text streams, because that is a universal interface
    • man -a intro | espeak Linux introduction to user commands.


Essential commands

For a PDF with Unix/Linux Command Reference - download the following link

System Info

date – Show the current date and time
cal – Show this month's calendar
uptime – Show current uptime
w – Display who is online
whoami – Who you are logged in as
finger user – Display information about user
uname -a – Show kernel information
cat /proc/cpuinfo – CPU information
cat /proc/meminfo – Memory information
df -h – Show disk usage
du – Show directory space usage
free – Show memory and swap usage

Keyboard Shortcuts

Enter – Run the command
Up Arrow – Show the previous command
Ctrl + R – Allows you to type a part of the command you're looking for and finds it

Ctrl + Z – Stops the current command, resume with fg in the foreground or bg in the background
Ctrl + C – Halts the current command, cancel the current operation and/or start with a fresh new line
Ctrl + L – Clear the screen

command | less – Allows the scrolling of the bash command window using Shift + Up Arrow and Shift + Down Arrow
!! – Repeats the last command
command !$ – Repeats the last argument of the previous command
Esc + . (a period) – Insert the last argument of the previous command on the fly, which enables you to edit it before executing the command

Ctrl + A – Return to the start of the command you're typing
Ctrl + E – Go to the end of the command you're typing
Ctrl + U – Cut everything before the cursor to a special clipboard, erases the whole line
Ctrl + K – Cut everything after the cursor to a special clipboard
Ctrl + Y – Paste from the special clipboard that Ctrl + U and Ctrl + K save their data to
Ctrl + T – Swap the two characters before the cursor (you can actually use this to transport a character from the left to the right, try it!)
Ctrl + W – Delete the word / argument left of the cursor in the current line

Ctrl + D – Log out of current session, similar to exit

Learn more about Commands/programs

apropos subject – List manual pages for subject
man -k keyword – Display man pages containing keyword
man command – Show the manual for command
man -t man | ps2pdf - > man.pdf – Make a pdf of a manual page
which command – Show full path name of command
time command – See how long a command takes

whereis app – Show possible locations of app
which app – Show which app will be run by default; it shows the full path

File Commands

ls – Directory listing
ls -l – List files in current directory using long format
ls -laC – List all files in current directory in long format and display in columns
ls -F – List files in current directory and indicate the file type
ls -al – Formatted listing with hidden files

cd dir – Change directory to dir
cd – Change to home
mkdir dir – Create a directory dir
pwd – Show current directory

rm name – Remove a file or directory called name
rm -r dir – Delete directory dir
rm -f file – Force remove file
rm -rf dir – Force remove an entire directory dir and all it’s included files and subdirectories (use with extreme caution)

cp file1 file2 – Copy file1 to file2
cp -r dir1 dir2 – Copy dir1 to dir2; create dir2 if it doesn't exist
cp file /home/dirname – Copy the filename called file to the /home/dirname directory

mv file /home/dirname – Move the file called filename to the /home/dirname directory
mv file1 file2 – Rename or move file1 to file2; if file2 is an existing directory, moves file1 into directory file2

more file – Display the file called file one page at a time, proceed to next page using the spacebar
head file – Output the first 10 lines of file
head -20 file – Display the first 20 lines of the file called file
tail file – Output the last 10 lines of file
tail -20 file – Display the last 20 lines of the file called file
tail -f file – Output the contents of file as it grows, starting with the last 10 lines


SSH

ssh user@host – Connect to host as user
ssh -p port user@host – Connect to host on port port as user
ssh-copy-id user@host – Add your key to host for user to enable a keyed or passwordless login


meta characters

Meta Characters are characters that have special meaning within the terminal

  • ~ the tilde stands for the user's home. cd ~/ change directory to home
  • . dot stands for this directory. ls . list this directory
  • .. dot dot stands for the parent directory to this directory. cp myfile.jpg .. copy myfile.jpg to the parent directory
  • * asterisk is a wildcards which represents zero or more characters ls P*.jpg will list all the files, in the current directory, that begin with P and end with .jpg
  • \ backslash it is a literal character. It escape the meta value of the meta-characters and display them only as literal characters. echo Foo \* will output Foo * If \ wasn't there it would output all the files in that directory.


pipes, write to & append

A pipes (" | ") sends the output of one program to the input of another program.

echo "my sentence"| wc the echoed sentence "my sentence" is pipped into the program wc which counts the number of lines, words, and characters


> Writes the output of a command to a file, rather than to print on terminal.

df > df_output.txt redirect the content of man dfM to a file called df_output.txt

If the said file doesn't exit it will create it, if it already exists it will overwrite its contents/


>> appends the output of a command to a file, without overwriting the original file. echo 'also add this' >> df_output.txt will add 'also add this' to the contents of df_output.txt


Proto social network tools

wall - write a message to all users echo "how is the weather in your terminal?|wall"


write enables you to chat with another user. You can find who is logged in and to which terminal with the who command.

Once you got the name and tty of whom you want to chat with you can start writing to him/her write username tty


ASCII Art tools

  • figlet - display large characters made up of ordinary screen characters echo "say something big"|figlet
  • coway - cowsay/cowthink - configurable speaking/thinking cow echo "look,I am a cow"|figlet
  • jp2a - converts JPEG images to ASCII

jp2a image.jpg


Day 3 - Wed 25Jan: Bitmap

Software:

  • imagemagick: a command-line program for image manipulation. We will be using it mainly through the command convert which convert 1 image onto another.
  • fbi (frame-buffer image): displays the specified file(s) on the linux console using the framebuffer device

ftp

Use Filezilla to transfer files from your computer to the Pi and vice-versa

bitmap images

You probably have heard before that bitmap images are grids of pixels, where

  • resolution: the number of horizontal and vertical pixels. E.g. 1920x1080 is 1920 pixels wide and 1080 high
  • color depth: the number of bits used to indicate the color of a single pixel

for a good introduction to bit maps see: See Bourke, Paul. n.d. ‘A Beginners Guide to Bitmaps’. Accessed 2 January 2018. http://paulbourke.net/dataformats/bitmaps/.


Resolutions:

Color depth - (use microscope)

  • 1-bit color (21 = 2 colors): monochrome, often black and white, compact Macintoshes, Atari ST.
  • 2-bit color (22 = 4 colors): CGA, gray-scale early NeXTstation, color Macintoshes, Atari ST.
  • 3-bit color (23 = 8 colors): many early home computers with TV displays, including the ZX Spectrum and BBC Micro
  • 4-bit color (24 = 16 colors): as used by EGA and by the least common denominator VGA standard at higher resolution, color Macintoshes, Atari ST, Commodore 64, Amstrad CPC.
  • 5-bit color (25 = 32 colors): Original Amiga chipset
  • 6-bit color (26 = 64 colors): Original Amiga chipset
  • 8-bit color (28 = 256 colors): most early color Unix workstations, VGA at low resolution, Super VGA, color Macintoshes, Atari TT, Amiga AGA chipset, Falcon030, Acorn Archimedes.
  • 12-bit color (212 = 4096 colors): some Silicon Graphics systems, Color NeXTstation systems, and Amiga systems in HAM mode.
  • 8-bit color: A very limited but true direct color system, there are 3 bits (8 possible levels) for each of the R and G components, and the two remaining bits in the byte pixel to the B component (four levels), enabling 256 (8 × 8 × 4) different colors.
  • Grey scale (8-bit)
  • True color (24-bit): Usually, true color is defined to mean 256 shades of red, green, and blue, for a total of 224, or alternately 2563, or 16,777,216 color variations. The human eye can discriminate up to ten million colors

[3]


{{#widget:Youtube|id=06OHflWNCOE}}



converting resolution

with Imagemagick

to 100px wide

convert myimage.jpg -resize 100x output.jpg 

to 100px hight

convert myimage.jpg -resize x100 output.jpg 

to 100x100px (image will loose its proportion; hence the "!" so imagemagick is sure that you wanna do that:)

convert myimage.jpg -resize 100x100! output.jpg 

converting color (bit depth)

convert an image into monochrome (1 bit depth) image: 2color values (b/w)

convert myimage.jpg -colorspace gray -depth 1 out.png

(2 bit depth) image: 4 color values

convert myimage.jpg -colorspace gray -depth 2 out.png

(3 bit depth) image: 8 color values

convert myimage.jpg -colorspace gray -depth 3 out.png

(4 bit depth) image: 16 color values

convert myimage.jpg -colorspace gray -depth 4 out.png

(8 bit depth) image: 256 color values

convert myimage.jpg -colorspace gray -depth 4 out.png


How can we be certain about this? How do can we see the grid that forms a bitmap image?

  • magnify any digital screen
  • a Plain-text bitmap: where you can read each pixel: X PixMap (XPM)

X PixMap (XPM) is a plain-text bitmap image format, where each color is assigned a character, which is mapped onto the text space.

convert myimage.jpg out.xpm


/* XPM */
static char *output[] = {
/* columns rows colors chars-per-pixel */
"50 73 2 1 ",
"  c black",
". c white",
/* pixels */
"                                                  ",
"                                                  ",
"                                                  ",
"                                                  ",
"               ................                   ",
"           ......   . .. . . .......              ",
"          .. .           .         ...            ",
"         . .   .. .            .     ..           ",
"        .. . .    .    .  .     .     .           ",
"        .   .      .    .   .    . .  ..          ",
"        .  .        .  .       .    . .           ",
"        ...          ..      .       ..           ",
"       ...              .. .         ...          ",
"        ..                            .           ",
"        .                             ..          ",
"        ..                            .           ",
"        .                             ..          ",
"       ...      .                     .           ",
"        .     .                       .           ",
"       ..                             .           ",
"       ..  .    .                   . .           ",
"        .    .                        .           ",
"       ..  .  .....                   .           ",
"        .    ..   ..                  .           ",
"        .   .       ..            .   .           ",
"       .  ..         .               ..           ",
"       .. .    .     .            .....           ",
"          .   ...     .          .    .           ",
"       .  .   ....   ..          .    ..          ",
"       . ..   ....              .      .          ",
"        . .          .          .    ....         ",
"       .  .          .          ..   ...          ",
"          .          .           .    ..          ",
"       ..  .        .            .     .          ",
"       .   .       ..            .    .           ",
"       .    ..   ..               ..  ..          ",
"       ..     ...                  ... .          ",
"      ..                               ..         ",
"      .                  .  .       .   .         ",
"     .  .  ..                           .         ",
"     .  . ....                     .    .         ",
"     .    ..  ...   .              ..  ..         ",
"     .. .  ..  .....   . ..   .   ...  .          ",
"      .    ... ..  ....          ....  .          ",
"       .    .....   ......     ...... .           ",
"       ..    . ..... .  ......... ... .           ",
"        ..   .........   .. .  ...... .           ",
"         .    ..   ....................           ",
"         .     ..   . ............... .           ",
"          .     .. ..   ............. .           ",
"           .      ..    .   .  .....  .           ",
"           ...  .  ...  .  .. ......  .           ",
"            ... .    .............    .           ",
"              ..   .       ..          .          ",
"               ...   ..                           ",
"                 ...     .    .       ..          ",
"                   ..            .    .           ",
"                     ..               .           ",
"                       ....          ..           ",
"                          .....  ....             ",
"                              .....               ",
"                                                  ",
"                                     .            ",
"                   ..   .            ...          ",
"        ...  .. ..  ... .. .. ...... ...          ",
"        ............................  ..          ",
"        ...... ................. ...  .           ",
"        ......  ... ... ..... .... .. .           ",
"        ..                                        ",
"        .                                         ",
"                                                  ",
"                                                  ",
"                                                  "
};



{{#widget:Youtube|id=UBX2QQHlQ_I}}

Day 3- Thursday

ASCII animation

ne: nice editor

F1 - menu

Day 4 Friday

  • FTP
  • Dot matrix
  • sound

Sound

espeak

echo "Can you hear me?" | espeak

mpv

mpv audiofile.mp3


Dot Matrix printers: escpos

Using python escpos

with Kube


With the Fujitsu DL6600:

In [11]: f=Serial(devfile=u'/dev/ttyUSB0', baudrate=9600, bytesize=8, timeout=1, parity='N', stopbits=1, xonxoff=False, dsrdtr=True)
Serial printer enabled

In [12]: f.text('test')

In [13]: f.close()

Day 4 - Friday 26Jan: Bitmap outside the screen

The challenge for today is how to do we get out bitmap/ascii-art/plain-text image out from the screen and materialize it into something.

  • a silk screen print ?
  • a sound composition
  • ?





Capturing image

  • fswebcam/xawtv: capture camera

fswebcam: no visual feedback

fswebcam --device  /dev/video0 --no-banner --save test.jpg

mpv: screen shot by typing "s"

mpv /dev/video0



Capturing camera input

Assembling it all

Pi cheat sheet

display image in Terminal 1 with

fbi capture.jpg -T 1

picam; but Picam seems difficult to work with other software - should try webcam

raspistill -o test.jpg 

There is a python module for it: https://pzwiki.wdka.nl/mediadesign/PiCam

references

  1. ‘ASCII ART’. n.d. Accessed 2 January 2018. http://artscene.textfiles.com/information/ascii-newmedia.txt
  2. Necromancer. 1998. ‘History of the PC Ascii Scene’. March 1998. http://artscene.textfiles.com/history/essays/pcascii.txt
  3. https://en.wikipedia.org/wiki/Color_depth