Jump to content
JimIn1985

Changing individual pixel colors in an image

Recommended Posts

JimIn1985

To debug a program I'm testing, it would be massively useful to take a white image and increment the color values of certain pixels every time something happened, so I could get a beautiful color blob which clearly shows for example where users click the most on a window. I attempted to do this about a year ago, but no method I tried could do what I stated above!

I did try to use GDIplus and it sort of worked. But I had to make a new object for every single pixel on an event, and it proved to be extremely difficult to increment the colors of each object, not mentioning the fact that it got slow and crashed after > 1000 objects were added, it was just a nightmare. Simply editing an image file directly would be so much more efficient and easy. I just want a way to increment the color value of specific pixels in an image! I can not find any topics on this! Is it simply impossibly with Autoit or am I missing something?

EDIT* I'll try to dig through my backups to find the GDIplus code I was using.

EDIT** GDIplus code was lost to oblivion, can't find it :(

Edited by JimIn1985

Share this post


Link to post
Share on other sites
Bert

I'm asking out of ignorance here - Why do you need such a program? An example please. I could easily see how this sort of thing can be used as a sort of keylogger but for a mouse and I can't think of a legit use. Looking to educate myself here.

Share this post


Link to post
Share on other sites
JimIn1985

Well I don't see how the keylogger equivalent to a mouse would be useful, besides if I wanted to do that I could just log the mouse co-ordinates to a text file. I'm aiming to develop this for personal use. I just thought it would be useful to see where the user clicks in a GUI, then use that information to make it more efficient. For example if you have a half of a button that's never touched by the user, you would be able to see that and shrink it down to make it more efficient. For example in the picture below, I would be able to see that the entire right portion of the 'click to convert' button is unused (assuming the colors correlate to the areas with the highest click density), meaning I could shrink it and possibly add another feature with the saved space. I know this is a little overkill and I probably won't use it for many projects, but knowing where users click most often would undoubtedly make me better at formatting GUIs.

Concept.png

Share this post


Link to post
Share on other sites
Bert

Ah, I understand. As a person who designs interfaces for users may I offer some advice that you may find helpful.

Efficiency is important in a design but so is aesthetics. Sometimes big buttons or large text fields are not so bad. You may design something and later you may give your code to someone else to use. In other cases you may make something, not use it for a long time and when you do use it - the buttons and text is so bunched up you have a hard time understanding what your interface does. (Been there, done that) 

I always think how OTHERS will use my interfaces, not just me. I find it forces me to be a bit more clever, more open minded, and more simple. ITs real easy to over-engineer something. Take the German and Russian tanks during WW2. The German tanks were masterpieces of engineering. They were TERRIBLE to maintain and a nightmare to repair. The Russian tanks were just good enough, easy to fix and it didn't matter much when they broke down. True it sucked driving the Russian T34s for you felt all beat up afterwords but it got the job done. When you drove the Panzer 4, it was like driving a sports car - easy to drive and you were relaxed doing it. 

You can over-engineer it, or make it so it works but it is ugly, or go for the middle so that it works well and is easy to use and looks good. 

Hope this helps

 

-B

Share this post


Link to post
Share on other sites
SlackerAl

I think this looks quite an interesting thing to check out, but surely the simple solution is as you said: 

16 hours ago, JimIn1985 said:

I could just log the mouse co-ordinates to a text file.

Then import that into excel and create a scatter plot - you won't get the pretty colours, but the density variation should be fairly obvious anyway. You can then copy the chart object and paste it over a screen shot of your app - this is easy to do in MS-Project for example. OK, it's not fully automated, but unless you are planning on doing this a lot, it's probably a lot quicker than writing all the code.

 


Problem solving step 1: Write a simple, self-contained, running, replicator of your problem.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.