Some Hints on How to Improve Your Graphics


     Some Hints on How to Improve Your Graphics


     Here are some hints for those of you who would like to improve your
 technique when making your own illustrations, for example paintings and
 title screens on the Amiga.

     I would like to stress the point that this article will not turn
 you into an instant artist as the subject is technique, not art.

     The computer as a medium for creating graphics has some built-in
 problems. However, let it be known that other mediums such as oil-paint,
 watercolour, ink, and crayon just to mention a few have just as many
 shortcomings and limitations.

Some of the shortcomings of computer painting are:
  i) the limited number of colours
 ii) creating gradual shading or flow of colour
iii) putting in extremely small details
 iv) the step effect created by lines that are  on an angle
  v) expression of material e.g. hair
 vi) the screen (canvas) size

     Some of these problems along with some others will be dealt with in
 the course of this article.


     If you  don't want to go to the trouble of creating a formatted
 blank disk with a directory for the images, you  have to make enough
 disk space on the disk with the painting programme to save your creations.


     Care should be taken in choosing your object to be painted. The
 two biggest pitfalls are small details and the need for too many colours.

     Start off by choosing a painting that has no more than one or two
 objects. It will help you to cope with the limited number of colours at
 your disposal. For this exercise I would choose a flower as most
 flowers are of a single colour, and basically you will need only two
 colours, one for the flower itself and one for the stem and leaves. The
 other 14, or so   colours left, depending on the resolution you are
 using (more of that later) can be devoted to shading, highlights, and


     I suggest that you copy an existing illustration to start off with
 because there are enough technical problems without creating artistic
 ones as well.
     Having chosen your object to copy how do you get the outline and
 details onto the screen? If you are painting from a photograph, postcard,
 magazine, or book you are faced with the problem of transferring the
 image to the screen preferably without damage to the original.
     Programs like DEGAS ELITE have a grid-tool that will help you to create
 a screen that looks like graph paper. Using this grid-tool create a
 grid where both the vertical and horizontal lines are approximately 10
 mm apart on the screen.

To get the grid for Degas Elite:

    Go back to the screen and count the number of whole squares from
 top to bottom. Do not count the incomplete block at the top and the

     Next, go back to the picture and measure the height only. Divide
 the height by the number of vertical squares that you have counted on
 the  screen. For Example: picture height 260mm, number of squares  on
 the screen 13. Divide 260mm by 13 screen squares = 20mm. Divide your
 picture  now by drawing vertical lines 20mm apart. If you do not wish
 to damage your picture stretch  a sheet of tracing paper over the top
 of it and do all line work on the tracing paper.

 Number the row of blocks along the top starting by  placing a 1 (one)
 in the block on the left.  Number the row of vertical blocks on the
 left hand side starting by placing a 1 (one) in the block at the top.
 The number 1 (one) will be common to both the vertical and horizontal
 rows of blocks.

     Go back to the screen and with the freehand-tool write in the
 numbers corresponding to those on your picture. Make sure that the
 numbered grid is in the centre of the screen. (When finding the middle
 line of the screen don't forget the part under the palette.) Rows of
 blocks on the right and left of the centered grid can be deleted.

     If your picture happens to have more horizontal blocks than the
 screen has you will have to decide which part of the picture horizontally
 is most important to you. This, however, does not happen very often.

     Now draw the outline and details by looking at the picture and
 drawing lines in the corresponding blocks. The numbers at the top
 and bottom of the screen and the picture will help you to identify
 corresponding blocks.The mouse is not the ideal tool for drawing, but
 the outline does not have to be perfect. If you have chosen a face or
 head make sure the important details such as eyes and nose are in the
 right place.

     When you have finished with the outline and details remove all the
 grid lines by using the background colour. My use of colours, in most
 cases is black for the background and cream-white or brown for the line
 work and grid lines. Background colours other than black are likely to
 interfere with colours in the picture and white line work is hard on
 the eye.


     Not much choice here...unless you use something like SPECTRUM 512
you've got 16 colours in lo-res.
     If you are about to start your first picture I would recommend using
 lo-res. (surprise,surprise) 

     The interference of adjacent colours can be very useful.
 Dots of white and red next to each other will result in pink.
 Two white dots with one red dot on the side will give white with a pink
 Five shades of grey with one red (6 basic colours)  will result in 15
 colours - 1 red + 5 shades of grey + 5 combinations of red with grey +
 4 further combinations of grey.

     I will leave it to you to figure out the total number of combinations
 possible with 16 colours.


     The choice of the palette is probably the most important step. A
 bad choice of colours will result in a continuous struggle for more
 colours. Because there is no interference from adjacent colours with
 lo-res care should be taken to ensure that besides the basic  colour
 chosen for your object you  have 2 or 3 shades that are lighter and
 darker than it. This will make it easier to create shadows and highlights.
 The computer programmes have a feature called "range". After you specify
 the darkest colour and say 5 colours away, the lightest colour,
 the programme will select the in-between colours. To modify the Degas
 palette check them DOCs! We've also covered some other Art packages like
 NEO, so take your pick!
 The colour to be changed you can alter the colour with the RGB-controls.
 All 16 colours can be changed, but care should be taken with some
 of the colours as they are basic to background, lettering and borders.

     It is of note that AMIGA users get very used to lots of colors.Because
 only 16 colours are available to us it is very important that every colour 
 can be used to create several other colours. For example, white with dark
 green could cut out the need for light green. Some experimentation
 on a free part of the screen will help you to decide.

     Because I do not know what you are going to paint I can only give a
 typical palette. It should contain black and white and at least 4
 following shades of grey and brown. Since grey and brown are not very
 strong and are easily overshadowed by the prime colours (red, blue and
 yellow)  their effect will result in darker and lighter shades of the
 prime colours so essential for good shadow work and highlight details.


     At this stage we have an outline of the picture, and a palette. If
 you wish to use the spray-paint tool this is the time to use it. Spray
 painting can be very effective for some backgrounds. Choose a "spread"
 that is not too big, and limit the numb er of dots. Give the background
 the basic colour you want it to be and spray the desired pattern. If you
 do not use "masking" of your major object the limited spread and small
 number of dots will prevent too  many unwanted dots getting into your
 Also, staying away from the object and imitating the spray pattern close
 to it using a single pixel brush will help.
 If using more than one spray colour use the darker spray at the bottom and
 the lighter one at the top. The dark colour will work as a foundation.
 However, if you use spray for sky the darker colour should go to the top.
 It will give the painting depth.

     Filling in is the next step. Before you use the fill-in tool make
 sure you do not have any breaks or gaps in your outline. You can check
 for  breaks by using the magnifying-tool. If you overlooked a gap and
 part of the painting that you didn't want to fill-in gets filled-in,
 use the UNDO to remove it, close the gap and try again.
 After filling-in all the basic colours check for details that are out of

     Most of the shading in can be obtained by using a progression
 of colours. Sometimes better results are obtained by using a basic
 colour and a progression of darker brown dots for red, yellow and green,
 and grey dots for white and blue. At the cost of time you can create a
 checkered pattern. It could for example be made up of red and brown
 squares. By progressively using darker browns the red will also darken
 by the influence of the brown. The brown dots can't be seen as the red
 is the mo re dominant colour. It will appear that the red gets darker,
 creating an illusion of a shadow. Using two shades of red will extend
 the range from light to dark even further.

     A typical annoying feature of computer graphics is that lines on an
 angle and curves have little steps. Most of these steps can be eliminated
 by putting in an intermediate colour. For example, if the object with the
 steps is red and the background colour is black put brown dots in
 the corners of the steps. The ragged outline will then be smoothed out.

     Most of what has been said here can be seen by scrutinizing my two
 paintings on this disk. Both of the paintings are med-res and they can
 be transferred to a painting programme to be looked at with the


     Finally, I would like to advise you to save your work each hour. 
  Also, at the end of your day's work make a back-up copy. Detailed 
 paintings can take several days to complete.
 To lose a painting because of memory or disk failure can be very
 disheartening. (And don't we just know it!!)

~~~~~~~~~~~~~~~~~~~~~~~~~~~ END OF PAINTHINTS ~~~~~~~~~~~~~~~~~~~~~~~~~~~

TEX PAINT-HINTS..Part of a series in ST NEWS disc magazine.

by Erik of The Exceptions

The fourth part of this highly popular series is here. This time, 
ES will talk about some graphic-tricks like transparent graphics, 
anti-aliasing and more like that.   

 Hi de hi, readers! Have you gained enough energy for yet another 
round  of TEX-tips?  For this part you don't even  need  specific 
assembler knowledge,  since it mainly covers my personal field of 
expertise:  Graphics.  Some  of you might now think that  there's 
rather little left to be said about that;  many pages in books as 
well  as  magazines have been filled with  the  subject  already, 
aren't they?  But I am sure that there are some more or less rare 
tricks and tips from which you didn't know anything;  or are  you 
familiar with:

 - Anti-aliasing
 - Animated graphics by palette animation
 - Transparent effects
 - Back-and foreground scrolling without programming trouble

  You don't know anything about this?  Then it'll be soon -  just 
read  on.  Additionally,  I  will tell you  something  about  the 
"Neochrome"  drawing program that your surely didn't  know.  Just 
like all earlier episodes in this series,  all things said  refer 
to  the low resolution of the ST,  where you can normally use  16 
colours  (readers of ST NEWS Volume 3 Issue 5 will now of  course 
chuckle lightly).
  Well,  let's  start  to talk about the  subjects  listed  above 
systematically.  'Anti-aliasing' is listed first there.  This  is 
commonly  used  in  professional  circles  of  computer  graphics 
artists. Freely interpreted, this would mean: "How the heck can I 
avoid that gradation in my computer picture?"
 You all know that the ST, just like its colleague-homecomputers, 
has  a  fairly  limited  screen  resolution.   This  means   that 
especially  diagonal  lines or circles show  typical  gradations. 
Since we cannot fool the hardware in this case, we'll simply have 
to fool another 'peripheral':  The human eye.  We can hereby  use 
the way an eye sees contrast.  When Anti-aliasing,  one uses  the 
following scheme: At the boundary of two colours, one insert some 
dots  on  the  gradation that have colours  in  between  the  two 
colours that you use. That's all.
  To  demonstrate the remarkable effect,  please  make  a  little 
practical exercise. You surely have a drawing program with a zoom 
function. Load it and define the following colours:

  Background color - 000
  Drawing color 1  - 711
  Drawing color 2  - 600
  Drawing color 3  - 400
  Drawing color 4  - 300

  Now just draw a triangle with drawing colour 1,  and  therefore 
draw three lines, for example for the upper left corner (position 
x=0 and y=0) to position x=20 and y=80, then back to x=0 and y=80 
and  then back to the upper left hand corner.  Fill it  as  well, 
with  drawing  color 1.  Now,  a bright red triangle is  on  your 
screen  of which the right side clearly demonstrates the  typical 
 Now copy this triangle,  so that you have two triangles next  to 
each  other  on  the screen.  The second one will  now  be  anti-
 Enter zoom mode again and select drawing color 2. Put ONE dot of 
this color on each 'stairs' of the gradation at the right side of 
the triangle.  Then select drawing color 3 and do the same, and a 
third  time  with  drawing color 4.  Now  you  have  added  three 
darkening red colors to every gradation. Leave zoom mode and look 
at the effect.  The difference is quite stunning,  isn't it?  The 
second triangle seems to be displayed in a much higher resolution 
than the first one. That's anti-aliasing; quite simple!
 When you'd like to experiment a bit more,  you can draw a filled 
circle  in drawing color 1 and again put the darkening shades  of 
red on the gradation steps.  You will then also develop a feeling 
of where you can put which number of anti-aliasing-dots,  since a 
circle contains all different gradation sizes.
 Using this technique,  all graphics can be enhanced if the color 
palette has been properly designed.  In our example,  black (000) 
was the background color,  bright red (711) the drawing color and 
2-4 were the anti-aliasing colors.
 Have fun experimenting with these effects!

 Now,  what's up next?  Ah! Color palette animation! First, let's 
start with a small explanation what this actually is.
  The ST has sixteen color registers;  when some or all of  these 
are  swapped in a cyclic way,  this is called 'color cycling'  or 
palette animation.  This is often used to simulate flowing water, 
and  one of the oldest "Neochrome" pictures,  "Waterfall",  is  a 
typical example.  In this case,  the shades of blue contained  in 
the water are swapped in a circle.
 But there are much more possibilities with palette animation.  I 
have  always  had the dubious pleasure of creating  effects  with 
this  that many people considered to be  graphic  programming.  A 
very  nice application of this technique can be found in the  TEX 
program "Super Neo Demo Show".  There is a scrolling text in  the 
lower  border of the screen,  and under that are a lot  of  small 
propellers.  After  this  introduction you will probably  not  be 
surprised  to  hear  that these rotating lines  are  nothing  but 
palette  animation  - which many people were  when  we  initially 
explained this trick to them.
 How it's done?
  Well,  it's quite difficult to put into words (like  love,  ex-
ED.), but I'll give it a try.
  Just imagine that you've drawn 12 lines that cross one  another 
in  the middle;  each line has its own color.  Now,  you set  all 
colors  to  black with one exceptions:  One  color  remains  e.g. 
black.  In the middle you put a small circle with a non-animating 
color  to cover the part where all lines cross.  If you  now  let 
these  12  colors cycle,  you have the impression of  a  rotating 
line,  since  only one of the 12 lines is displayed in red  at  a 
 There are more tricks of this kind, e.g. the hopping dots in the 
2nd Psych-O-Screen of our "B.I.G. Demo", but they principally all 
use the same trick:  About all used colors are put in  background 
color,  and only some of them are colored;  by palette animation, 
movement starts. One can use this to such extend that an animated 
figure, e.g. a little man, walks across the screen. The method is 
the same;  you draw the movement phases in an other color at each 
time  and  you  set  them next to each  other  (they  should  not 
overlap).  Since each of the men 'lights up' after the other  due 
to  the  color animation,  it appears as though the  shape  walks 
across   the  screen.   True  animation  effects  can   thus   be 
accomplished  by animating the colors.  The disadvantage of  this 
trick  is  obvious:  When  you  use a lot  of  colors  for  color 
animation,  only  few are left for the rest of the  picture.  But 
that's each one's own decision.

 Well,  dear readers, now we're really starting. The previous was 
only  to be classified among 'harmless toying  around',  but  now 
we're  really cookin'.  Maybe you have seen graphics that  seemed 
like  transparent  glass or that seemed to float in some  of  our 
programs.  Maybe  you  wondered  which  wonderful  and  difficult 
program sat behind it all.  Ha!  All wrong! I suppose you're just 
about used to it, but this is also covered by a sleazy trick. But 
to  understand  it,  you must know something  about  the  graphic 
buildup of the ST - so I will mention it here in short to refresh 
your memory.
 In low resolution, it looks like this: A certain piece of memory 
is referred to as 'screen memory'.  There, four sequential memory 
words  (1 word = 16 bits) always belong together,  and each  word 
represents a so-called 'plane'.  It's best to imagine these  four 
words  lying under each other;  this way you see best  that  each 
pixel is represented by four bits.  According to this combination 
of bits,  the color value is taken from one of the sixteen  color 
registers. With a resolution of 320x200 (640,000 pixels) of which 
each pixel can take one of 16 colors,  each plane is therefore  8 
Kb in size; an ST graphic screen thus costs 32 Kb.
  These planes do not only have to be used to  represent  colors, 
but  when you truly look upon them as 'planes' and use them  like 
that program-technically, there are some interesting aspects.
  Let's presume we made a piece of graphics that only uses  eight 
colors.  These  colors  can be realised with only 3  'planes'  (3 
'stacked'  bits  means 8 combinations possible),  so  that  their 
colors will be found in color registers 1 to 8.  But there's  one 
plane left!  In this plane, it is for example possible to display 
a piece of graphics that only uses one color.  When we set  color 
registers  9-16  to the same value,  we can move  this  piece  of 
graphics  in  just one plane (the program only uses  each  fourth 
word) and the corresponding bit combinations only give the colors 
in register 9-16. That's how it is possible to put a single-color 
piece  of  graphics  on  top of one that  has  8  colors  without 
difficult logical operations.
 That's all.

 Oh,  I hear you call:  "What's up then with transparent effects, 
and fore-and background,  eh?!" Well,  program-technical  nothing 
else  happens  than what I just described  above.  All  else   is 
simple brainmangling thought about setting proper color palettes. 
Again: Transparent-as well as back-and foreground effects are now 
only realised by simply setting proper color palettes!
 Therefore you must thoroughly realise what's happening with  the 
bit  combinations when a piece of graphics in one plane is  moved 
'over'  the  three  others.  The  colors  that  result  into  the 
corresponding effect are always the last eight (number 9-16), the 
colors   located  that  are  called  by  the  corresponding   bit 
combinations are located there.  These are the colors that appear 
when  the  separate plane is moved 'over' the other  three  -  in 
other words when the fourth bit (fourth plane) is set or cleared.
 When you understand this, it is easy to think of a way to create 
the 'transparent' effect:  Simply put intermediate colors in  the 
upper  half of the palette that correspond to the  brightness  of 
the other eight.  In our program example (present in the disk  in 
the  PROGRAMS folder as a .S file) a bright red 'plate of  glass' 
moves  over a background pattern that only uses shades  of  grey. 
The colors are hereby set as follows:  Color 1-8 are black  (000) 
along all shades of grey to white (777). The 'transparent colors' 
9-16  go from dark red (004) to yellow (770).  So when  the  one-
color  graphics block of the fourth plane goes 'over'  the  other 
three planes,  color 9 appears where 1 used to appear, 10 where 2 
used to appear,  etc.  Program-technically speaking, this is very 
simple, but about that we haven't even talked.
 Udo and the others were also quite blabbergasted when I came  up 
with the idea,  you'll believe me.  The whole back-and foreground 
business is very much the same;  just look at the B.I.G. scroller 
in  our "B.I.G.  Demo" where a scrolling text scrolls in  between 
the fore-and background.
  With  this effect,  one has to set the upper  eight  colors  as 
follows:  With  each of the colors that the one-colored piece  of 
graphics should go behind,  you set the corresponding upper color 
to  the same.  All colors that should be covered by the  graphics 
block  should get the value you want them to have when they  move 
'in front' of it.  So if you want the one-plane graphics block to 
move  all in the background of all three other planes,  one  sets 
the upper colors exactly the same as the lower ones.
 Not really simple, you think?
 Hmm.  You might be right.  But we do everything to get the  very 
last thing possible out of the ST, don't we?
  With this effects,  it is also not quite simple to put it  into 
words (sigh, ex-ED.). When you have a look at our listing (in the 
PROGRAMS folder), your last doubts will disappear.
 The program does the following:  It builds a background  pattern 
in three planes, thus using the first eight colors. It then makes 
a graphic block in the fourth plane move to and fro.  Using  keys 
1-4,  it is possible to call different color palettes,  that will 
support  the  description I have above.  By only  pressing  these 
keys, the following effects are realised:

 Key 1 : Palette 1, one-colored block moves over graphics
 Key 2 : Palette 2, block moves in background
 Key 3 : Palette 3, block moves through the pattern
 Key 4 : Palette 4, transparent block moves over graphics

  Have  fun  trying.  It is easy to use some of  your  own  color 
palettes; some extremely funny effects can be created that way.

 This almost made an end to this issue's "Wizards"  article.  But 
at the end I found it necessary to make a plea.  No! Nothing like 
"Tortured  ST users everywhere get together!";  it is  much  more 
about my favourite drawing program that I (and many others) think 
is one of the most grotesquely underestimated programs on the ST. 
I'm  talking about "Neochrome" here,  that was supplied with  the 
Atari ST in the early days (version 0.5).  It was supposed to  be 
sold  in  the  better version 1.0,  but  it  was  never  properly 
marketed.  Most salesmen also considered 1.0 to be Public  Domain 
and that's why just about every ST user could get the program.
  The reasons why the program is so gut will be explained to  you 
in just a little while,  when I will tell you something about the 
program  that  most of you probably didn't  know.  The  basis  is 
actually  brief:   "Neochrome"  already  includes  (almost)   all 
functions one would need for creating GOOD pictures;  unnecessary 
function  are  not present and it is  fast,  very  FAST.  It  has 
several  function that would even make "Degas Elite" look  rather 
 When you've drawn pictures yourself,  you'll have to admit  that 
the most important tool of all is the zoom mode.  On the contrary 
to all other drawing programs that are available, "Neochrome" has 
a  zoom  mode that is always present,  also when you  operate  on 
blocks,  draw lines,  fill,  etc. This zoom mode is very fast, by 
the  way,   because  it  uses  raster  interrupts.  Further,  the 
'Jackknife' function allows you to cut out whatever form you want 
(not  just  polygons),  and  these  can  also  be  moved  in  the 
background ("DPaint II" on the Amiga can't even do that!).
 I suppose you already know the functions that are implemented on 
the "Neochrome" menu. So I will now talk about some function that 
are not so obvious;  you might be in for a surprise! Many things, 
for  example,  are  hidden  in the right  mouse  button:  In  the 
'normal'  block  menu,  the current block is set on  the  current 
position,  but  with 'Jackknife' you can DRAW with  pressing  the 
right button, just like a brush (and, unlike other programs, this 
also  happens FAST)!  While in 'brush' mode,  pressing the  right 
mouse  button takes care that you draw with the colors that  have 
been installed between the 'color arrows' - this is also the case 
when using nozzles (highly effective when using color animation).
  When you're in 'grabber' mode,  you can get the color of  every 
pixel on the screen you want by pressing the right mouse  button. 
In  'line' mode,  the current line is deleted when you press  the 
right  button with the left one.  When double-clicking the  right 
mouse button on the eraser icon, the entire screen is erased.
 But now a very hot tip,  since only few people know that there's 
a  complete  animation tool in  "Neochrome"!  Dave  Staugas,  the 
programmer, had no time to make it completely bug-free so that he 
just hid it.  This is the way to get the new icon on the  screen: 
Go  to the 'grabber' mode and click with the right  mouse  button 
precisely in the curve of the last 'R' in the word 'GRABBER' that 
will  appear  on  the right side of  the  menu.  A  small  camera 
  You can now do the following after selecting that  camera:  You 
can define an animation area with the mouse. With the right mouse 
button  you  can now slide the whole picture through  this  area. 
When you have the right part,  you simply click on 'add' and  the 
part  of  the  picture is in  'animation  memory'.  Add  as  many 
pictures as you want,  and then you slide the cutout back on  the 
first cutout (only Dave knows why) and you can use the arrows  to 
play the animation forwards as well as backwards.  With 'Del', it 
is possible to delete the current screen,  and 'Load' and  'Save' 
also  work  (just don't get startled when  the  fileselector  box 
that's busted - stop animation before!). Just experiment a little 
with the animation tool; unlike all other animation tools for the 
ST, this one's EASY to use. The biggest advantage is that you can 
edit  a  figure  that has to be animated  right  in  the  drawing 
 But be warned:  This new menu option is not bug free!  It is for 
example  not quite smart to press the Undo key or make  the  menu 
disappear while the camera is selected.  So it's probably  better 
to  save your picture before you enter the animation  tool.  When 
you  have the VERY OLD St demo with the flying  parrot,  you  can 
load  it  without  problems.  But  do  not  forget  to  load  the 
accompanying picture before (the shore landscape) with regard  to 
the color palette.

  Finally,  a little gag:  You can define the colors in the  menu 
yourself!  When started up,  "Neochrome" looks for a file  called 
"NEO.CMP"  in which 512 words with color values need to  be  that 
will replace the preset palette.
  When  you intend to use "Neochrome" more often in  the  future, 
look  into  your heart and give good ol' Dave something  for  his 
trouble  and his really good program.  He is currently  a  system 
programmer  at Atari and quite disappointed about the  fact  that 
his excellent program wasn't treated accordingly in the  magazine 
- and we're not even talking about the lousy marketing. Financial 
contributions can be sent to:

ATARI Corporation
Personal Mr. Dave Staugas
1196 Borregas Avenue
Sunnyvale, California 94088-3427

  If you're a "Neochrome" fan,  do not falter!  Dave wrote to  me 
that  he  will consider rewriting old source stuff and  making  a 
better "Neochrome" version if the 'fanmail' is accordingly. I beg 
you: Do so!

 Well,  dear readers,  again we have told you some of our tricks, 
but  the  crown on our work of 'hardware-torturing'  has  yet  to 
come;  we're hereby talking about getting rid of the lower border 
so  that  graphics can be displayed there  as  well!  Using  this 
trick,  you  will be able to effectively display more lines  than 
ever before anticipated by the developers of the ST.
 Just wait for the next episode...
 Bye, bye.

The source listing referred to can be found on the relevant ST NEWS
disc, but you need K-SEKA to assemble the bloody thing! S.P