Creating simple graphics for documents

What happens when you’re tasked with “beautifying” a web site? Or when you need to spruce up a document to add some colour? In both cases, the graphics required don’t even need to
be done by professionals, just good enough to be close to professional quality. The graphics aren’t even the main focus, nor will they make or break a deal.

What you need is an easy way to come up with something moderately good. What you need is Paint.NET. After you’ve set the software up (it’s free), draw some rectangles on the canvas.
Four rectangles

Then use the Radial Blur effect
Radial blur menu

Set it to say 10 degrees
Radial blur option

And you’ll get this
Radial blur result

Or you can experiment with the zoom effect
Zoom blur menu

Set the zoom amount to 30
Zoom blur option

With the zoom result below
Zoom blur result

Maybe you’re in the artsy mood for twisting
Twist effect menu

Set the twist amount to 20 and the quality to 5
Twist effect option

And the final result
Twist effect result

Ok fine, so they don’t look like much. But they can fill in the space for a top right corner of the web page or something. Or as an unobtrusive background of some header text. You can try using block colours, but they really look terrible. With some imagination, you can create some nifty graphics. Go to the tutorial forums of Paint.NET and get some ideas!

Rapidly calculating Bezier points

The standard cubic Bezier curve is given by
B(t) = (1-t)3p0 + 3(1-t)2tp1 + 3(1-t)t2p2 + t3p3
where p0, p1, p2, p3 are the control points and t is in the interval [0, 1].

Very elegant, but not very practical. Too many multiplications and additions to be used in a fast-paced environment such as game development. If it’s a 3D Bezier curve, 3 separate calculations are needed for the x-, y- and z-component for a given t value. What we need is a simplication of the equation.

Expanding the polynomial equation, we have
= (1 – 3t + 3t2 – t3)p0
+ (3t -6t2 + 3t3)p1
+ (3t2 – 3t3)p2
+ t3p3

Rearranging the coefficients of tn, we have
= t3(-p0 + 3p1 – 3p2 + p3)
+ t2(3p0 – 6p1 + 3p2)
+ t(-3p0 + 3p1)
+ p0

The coefficients can now be reduced to constants by precalculating them, and calculation of a Bezier point takes less computation.

In matrix form, the equation looks like
Coefficient matrix form of Bezier curve

Mathematicians make better programmers

Prove root 2 is irrationalMany programmers I know graduated either with a degree from computer science or obtained a professional certificate in programming. Yet simple programming errors or lengthy solution constructs still exist. These programmers only know the how, but not the why. Given a math graduate and a computer science graduate, both with similar academic results, you’re better off hiring the math graduate.

Abstract thinking
In solving problems, a mathematician comes up with a theory given what is known, and work towards a solution. For example, the Königsberg Bridge Problem was solved by translating what is known (the layout of bridges and land) into a mathematical equivalent, a graph of nodes and connections. Solving the graph theory problem is then equal to solving the bridge problem.

This ability to transform problems from unfamiliar to familiar grounds is crucial. Business requirements often have ridiculous conditions defying normal programming laws. An experienced programmer can draw upon his vast knowledge and piece together a solution. A mathematician can come up with an equivalent problem but is easier to solve. Tip: Hire the math graduate. He’s cheaper.

Naturally logical
I have seen program code with wrong if conditions, such as incorrect inverse disjunctions like if (!(p || q)) is equivalent to if (!p && q). It is disastrous to form wrong tests for conditional statements and loops, 2 commonly used programming constructs.

Mathematicians exhaustively explore all test conditions to ensure a complete solution. This ties in with their chain of thinking. A solution with sequential steps is only correct if all the steps are correct. If A then B. If B then C. If C then D. Therefore if A then D. What if B is false? Then the whole thing collapses. Mathematicians are used to checking their OR’s and AND’s.

Elegant solutions
In my university days, I used to fear the Terrifying Triple, consisting of a 4-letter, 5-letter and 7-letter word. They are “Show”, “Prove” and “Justify”. I get a lurch in the stomach whenever one of these words start off a problem.

  • Show that [whatever] is equal to [whatever]
  • Prove that [whatever] is true
  • Justify your answer

However these exercises made me shrink my answers to the most concise solution I could think of. The less of a solution to be picked on by my professor, the better.

I find that some programmers simply write a solution code to the problem at hand, and if it compiles, oh yeah! And if it does what it’s supposed to do, woohoo! Next! Unbelievable… This is why the following code exists:

void SomeFunction(){
   int i;
   i = 0;
   abcd[i++] = 111;
   abcd[i++] = 222;
   abcd[i++] = 333;

Either the original programmer don’t know that a literal number value can be used as the array index, or he just found out about post-incrementing and is absolutely ecstatic that he can apply his new found knowledge.

Problem solving
Mathematicians are used to grabbing theorems from say calculus and apply them to chaos theory. They are accustomed to interdisciplinary thinking. Thinking out of the box is good. Sometimes making the box larger is better.

Then there are the programmers who copy and paste example code without giving a hoot to what the code is actually doing or why the author coded it that way. Then they compile and test it, and ask why it didn’t work. The situation is different for the copiers and a slight change is required to make the example code work, yet the effort required to understand the code is beyond them, thus escalating the slight change into a major shift in thinking.

Programming is simply giving instructions to the computer to solve problems. Learning to program for the sake of programming is limiting to the focus on problem solving. Sure, math isn’t the be-all-end-all of interdisciplinary thinking. But it’s a start.

Write code that helps write code

Writing tool codeI have discovered a rather surprising fact about my fellow programmer colleagues. Some of them, hate, programming. They go through the day writing code, copying and pasting where appropriate, crushing bugs and then go home. Their distaste for writing code has blinded them to the notion of creating programs to help them in their work. They will only create a program for a project, and not create smaller helper programs to ease the work.

Code generators
For my university thesis, I wrote a simulation program for computer virus behaviour. It was coming along fine, until I wanted to have graphs of my results. The simulation program was written in C and I didn’t know how to create graphs from C. Luckily, I had some experience in Matlab, and remembered how to create graphs for mathematical functions.

So I added some code in my simulation to output the results in a text file, which became the input for my graph generating Matlab code. Basically I used two different programming languages to help in writing my work. The output of one became the input of another.

Random data generation
There was a time when I had to generate a huge amount of data in the database, for a presentation of a web application I developed. And it had to be relatively similar to the real production data. Copying and pasting SQL insert statements wasn’t going to cut it.

So I wrote a small program to generate the insert statements into a SQL script. Then I ran that script in the database. A couple of minutes to run the generation program, and another couple of minutes to run the script, and bingo, mass random data records.

Testbed applications
I have 3 testbed projects, one for console output, one for Windows programs and one for web applications. They are used to test out theories, like what would the output of DateTime.Now.ToString(“dd/MM/yyyy”) look like.

By having these testbeds, I can test my code in a tightly controlled environment, because that testbed application can do only one thing, the code I want to test. Sometimes, testing the code in the actual program is hard, because there can be a lot of other stuff around. Testbeds allow me to just test that chunk of code without all the other distracting fluff. Which helps me write better code.

Custom tool programs
Sometimes, a fully working program is written just so its output can be used in another program. The demoscene and game production are examples of this need.

Demos are computer programs generating stunning visuals and music in real time. Some demo groups, like Conspiracy, have created full-blown applications to help create content such as 3D models and sound files.

Game production teams have tool programs, such as a preview program of texture mapping on a 3D model for artists, or dungeon creation programs to produce the 3D dungeon model used in the game.

These tool programs are not packaged in the final product, yet are essential to the success of the product, because they help make creating the product easier.

Writing code can be easier. Using a professional code generation software might be overkill for a tiny bit of code. Copying and pasting can be tedious. With a little imagination, you can make your programming life easier, by writing code to help you write code.

Editing screenshots with Paint.NET

Providing screenshots of a step by step process to a user is one of the most powerful guidance techniques. However, dumping a few megabytes of unprocessed image data into an email can crash your user’s mailbox. And if you copied the email to several other people as well? You had better be on very good terms with all of them.

This is where Paint.NET comes in. The software has features rivalling those of professional image editors. There’s the rotation and zooming, standard tool functions from Windows Paint, better colour selection interface, and unlimited * undos!

Doing more than just Print Screen
So you are at the screen for the screenshot, and you’ve hit the Print Screen button. Start up the Paint.NET program and paste the contents. You might be asked to expand the canvas or the working area for your image.
Expand canvas

Image cropping
Then you want to select the image area you are interested in (you are rarely interested in the entire image). Select the [Image] menu item, then [Crop to Selection], and you’ll get something like this:
Cropped image

Box and arrows
Then you make use of the rounded rectangle and line drawing tools on the Tools bar (located on the left by default).
Lines and rounded rectangle tools
You can also add pointed arrows at the end(s) of your lines, making process diagrams easier to draw.
Arrows for ends of lines

Add text for finish
Add some text and you’ll have a self-explanatory screenshot.
Screenshot with explanatory text

Bonus tip: Gaussian blur unimportant areas
You can even guide your user to focus on a certain area for emphasis. First select the area you want to highlight:
Highlighted area

Then do an inverse selection. Select the [Edit] menu item, then [Invert Selection]. Then select the [Effects] menu item, then [Blurs], then [Gaussian Blur] with 2 pixels as the radius. And you’ll get this:
Inverted selection with gaussian blur

So there you have it, simple steps to create good looking screenshots. The screenshots can then be used in documents or placed on the Internet (or Intranet) as part of an FAQ. So go get Paint.NET now!

* limited only by hard disk memory

Programmer’s dilemma – Making tough choices

I’m lucky to be given relatively free reign in my design and coding decisions. Unfortunately, that often means I have to choose between what is right, and what is easy. Here’s a few of them:

Usability – If it’s optional, then don’t make it mandatory
When given the choice of optional fields, a user can and will take the path of least resistance, which is to leave all optional fields as is. I recently developed a web page that retrieves records from a database. All fields are optional. Consequently, everything from the database is retrieved. Which crashed my web server.

Since I was giving a presentation to a customer when this happened, I was just a tad embarrassed. After the presentation, I went back, made a few fields mandatory, with corresponding error messages to avoid Raymond’s feedback form experience. Sometimes, I have to be a user too.

Result oriented – Programmers Don’t Like to Code
I used to tell people I love programming. I’m not so sure now. Then I realised what I really love is solving problems, and that I can express my solution in a program. Even though solving that CSS display bug or optimising that loop gives me joy, it means little to the result-oriented user. So I have to choose practicality sometimes.

CSS Design – Suckerfish Dropdowns
There is this web application I’m maintaining that displays a menu for navigation. The code is unwieldy and makes use of some Javascript copied and pasted without much thought. Hideous to look at and horrendously tedious if I have add a new page. Luckily I found a more elegant dropdown menu solution. It means I have to redesign the navigation element, but it’s worth the effort.

The one you never want to meet – The Brillant [sic] Paula Bean
I have seen my fair share of obnoxious idiots of programmers, and chose patience and understanding instead of exclaiming their ineptitude. But Paula, the experienced Java programmer, raises stupidity to an art. Brillant!

Socialise or be ostracised – In Programming, One Is The Loneliest Number
Not only is programming by yourself lonely, but it’s dangerous to your code, health and social life. It was tough when I first started interacting with people I don’t know but were on my office floor. Don’t have any programmer colleagues? Get help by persuading your manager to hire another competent programmer.

Texture maps and the soul of programmers

Texture mapping is a technique which adds detail to 3 dimensional models. You’ll see it in graphically rendered movies like Toy Story or Shrek, and in games such as Doom and Final Fantasy XII.

Suppose we have two 3D models, a sphere and a fractal-generated terrain.
3D models of sphere and terrain
When we map a texture (which is just an image) such as
Sunset onto the 3D models, we get
3D models with sunset texture

If we change the texture to
Quiet campus and map that onto the 3D models, we get
3D models with quiet campus texture

Fundamentally, the 3D model is the same. The output changes because the texture is changed. It’s the same with programming. Two programmers will produce two different sets of program code, yet produce the same required logic.

The unique coding fingerprint of the programmer becomes the texture that maps onto the required logic (a 3D model). It’s the way the programmer thinks up a solution. It’s the way the programmer writes and organises code. It’s the personal touch that programmer has imparted onto the resulting program. And a skilled programmer can even alter the logic, such as adding checks not specified in requirements, to create a more useful resulting program.

When you’ve done enough programming of your own, reading other programmers’ code gives you insight into their minds. Understand why a piece of code is written the way it is written. There are many web sites providing programming help with sample code, most of them with further explanation of the code. So read through the entire solution, explanation, code and all.

Yes, you really really just need the code to solve your problem. When you’ve solved your problem, read through the code and try viewing the problem as the original programmer would have. You’ll learn even more because you’ll have gained some fraction of wisdom, and be better at creating solutions. You’ll have developed your unique texture, and the distinctive soul of a programmer.

Fractal nature of computer programming

Have you ever felt like you are doing the same things over and over and over again? Your daily commute, your workday schedule or your programming pattern?

Fractional capacity dimension
MandelbrotFractals possess the distinctive property of self similarity. They look the same when you zoom in and when you zoom out. Take a small part of a fractal, and it looks similar to another part of the fractal.

So how does programming come into the picture?

A simple programming structure
When you write a program, there are typically 3 sections to it:

  • Declare variables
  • Perform logic
  • Obtain a result

In the program, you might write functions to help break up the program into smaller pieces. And in the function code, you

  • Declare variables
  • Perform logic
  • Obtain a result

See any pattern yet? How about programs calling other programs? The caller program declares some variables, calls another program to perform logic, and obtain a result from that callee program.

Self referential
There’s a special type of function whose programming logic involves calling itself again. They are called recursive functions. An example is the function for calculating factorials. The factorial of 6 is the product of all positive integers less than or equal to 6. Or 1*2*3*4*5*6 = 720. The recursive function will be f(n) = n * f(n-1), where f(1) = 1. In code, it looks like

public int Factorial(int x)
if (x == 1) return 1;
else return x * Factorial(x - 1);

It is programmatically inefficient, but it is concise. (Math is like that sometimes…)

Iterative process of software development
The very cycle of software development is itself self similar. You develop, test, debug, roll out and get feedback from your users. Then based on the feedback, you develop again, test again, debug again, roll out the next version and get more feedback.

Sometimes, it’s even shorter. You write some code for a small part, test it until you’re satisfied with it. Then you write some code for another part and test that until you’re satisfied.

Can you give more programming examples with fractal properties?

5 simple tips to meet project deadlines

Jared was halfway through developing that unbelievably cool application. The specifications were complete, the customer was pleased with the prototype of his user interface and everyone was doing what they did best. There was just this teensy little problem. Sometime ago, Jared had to go help out that fellow colleague with a programming task. Then there’s the time when his users seemed to conspire against him, and decided to take turns calling him with technical queries throughout the day.

Whatever the reason, Jared made a brief calculation and discovered that he’s starting to run out of time. Then he remembered some tips he read from an incredible web site.

1. Shut down your email
Outlook can be detrimental to your productivity. Having to constantly glance at the bottom right of your monitor to check if a new email came in will sap the focus out of you. Ignore people who call you up and say they’ve sent an email 5 minutes ago, and demands that you explain why you haven’t responded. Try checking once in the morning, once after lunch and one last time an hour before you leave work.

2. Go to the toilet often
It matters little if you have a strong bladder. Just go. Walk slower than usual on the way. Have a good look around the office. Take your time while washing up. Your goal is to get away from the computer, away from the task. Your body gets a little exercise and your mind experiences different sensations. All good impetus for igniting your creativity.

If you really want a good reason to go, just follow the next tip.

3. Drink more water
Your brain is already working at hyperspeed. Your body is aching from holding your special fast and furious typing stance. Drink more water. Eat proper foods. Cooling your brain and taking care of your body is important, because you can think better when you can physically keep up with your mental processes.

4. Wear a scowl
Monarch butterflies advertise their distastefulness with contrasting bright colours. Soldiers deter intruders with barbed wire fences. You can achieve the same effect with people who absolutely must bother you with some insignificant detail. Put on the meanest, angriest and most unforgiving scowl you can muster, and note the dropping number of unwanted guests.

5. Leave on time
This may seem counter-intuitive, but leaving work on time forces you to make the best use of your time while you are in the office. You are a responsible programmer, and so you will make sure that the project is still delivered to the best of your abilities. What you want is maximise your throughput instead of increasing the amount of time spent.

After Jared followed those simple tips, he was able to crank out tons of flawlessly elegant code. And lunch with his colleagues. And leave work on time. And manage to catch up with the latest tech news and blogs of his favourite authors.

As Jared was leaving work on the eve of the project delivery, he saw the unfortunate programmers a few cubicles away, mindlessly and desultorily going about their work, having forgone their lunch and now working overtime. Jared laughed (silently of course, as a form of respect for the others), shook his head and left with jaunty steps.

5 reasons why you need polymath programmers on your team

A polymath is someone who is knowledgeable in a wide variety of subjects or fields. And polymath programmers are people whose interests and knowledge cover programming and related subjects. In this age of information overload, let me tell you the 5 reasons why you absolutely must have at least one polymath programmer on your software development team.

1. They are fast learners
Their natural curiosity compels them to find out more about anything that interests them. Fueled by unwavering discipline, they quickly master the basics of a topic, and attain above average to advanced proficiency. Technology moves fast, and your team will benefit if at least one of you can keep up.

2. They are embracers of the unknown
You can only innovate if you are willing to step out of your comfort zone. To stand out means trying something no one’s done before. To create simple software solutions means seeing what cannot be seen. New ideas are born out of the darkness of the unknown. And polymaths are skilled at bringing them to light.

3. They are idea connectors
Their breadth of knowledge enables them to link seemingly disparate ideas and create new ideas. Sir Isaac Newton discovered the law of gravity from a falling apple. Archimedes found a way to calculate the volume of an irregular object when he was bathing in a bathtub. Fresh perspectives are a premium. The answer to your problem can be sitting just a few cubicles away.

4. They are role contortionists
They’re flexible. Polymath programmers know how to program in C. And C#. Probably Javascript too. Some Unix commands. ASP.NET. Connect to a database. Network stuff. Why a float or double is a very bad choice for storing monetary values. Write technical documents. Liaise with users. Answer technical questions from customers.

And when your star database administrator goes on leave, your polymath programmer can smoothly take on the duties. Your genius web developer has a cold and takes the day off? Let your polymath programmer handle that small but business critical graphic change.

This may sound degrading, but it’s true. Polymath programmers act like plug and play components. They can become whatever role you need them to be, whenever you need them to be.

5. They are autonomous agents
Set them an interesting and challenging task, and watch them work at it with little intervention from you. Amassing knowledge from different sources require self discipline and organisational skills. Let them know what you need, and stop bugging them. Your job as a manager is to stop other people from bugging them.

There you have it, the 5 reasons why having polymath programmers on your team can help with your bottom line. So how do you find them? That, my friend, is another story…