GUI Design?

[dufran3]

I am creating a second GUI. The first GUI that I have created. Was fantastic, and worked well. However, it was not visually appealing at all. I am trying to "re-vamp" it, to make it look better. I'm not sure how. I was hoping that some of you may have some ideas for me. Since you guys are all fantastic, and have some very good GUI's yourselves. First, the GUI is a Automation Tool for installing apps in my industry. IS staff checks the boxes of applications that they need installed, and settings, and other things. They then click the Start Button, and it runs through and checks for the boxes that have been selected, and runs the appropriate function. Now that you know how this is used, maybe you can provide some assistance as far as design goes. The code seems to function well, and I haven't had problems. Like I said, just having issues with the design of the GUI. First is a pic of the first GUI. I blocked out some of the info for privacy only. :-(

As you can see, it is cluttered, not alphabetized, and all other many of imperfections. here is the new one that I started.

Ideas anyone? I was hoping to use maybe an Icon for each of the items in the list, as you can see, I haven't re-entered all back into the new GUI, but I wasn't sure about the frame of the GUI yet. HELP!?

Thought I should add this, Again, I really appreciate any input! Thx A TON!

Edited February 27, 2007 by dufran3

[dufran3]

No inspiring advice from any of the greats?

[James]

What do you want? Design help?

Here is what I personally try to avoid in GUI design:

• Clutter
• Too much text that is not needed (clutter)

Here is what I try to make my GUI with:

• Space
• Easy to read labels, font, colour etc
• A neat layout
• Simpleness

Sometimes, you have to make exceptions but other than that I try not too.

Secure

[dufran3]

Design help, yeh I guess. Those are some great tips, I will keep those on a list and in my mind when designing GUI's. Is there a way to pretty up the checkboxes? Maybe use an icon in place of the actual box? Anything like that possible? Xskin is fantastic, and has already helped me pretty up a ton of things!

[James]

Yep, Val did great with X-Skin

Checkboxes??? I think you can change the colour of them by using a .dll so you will need to do a searh.

[dufran3]

Really? hrmmm...didn't know you could do that, I will try to do some searching...

[Valuater]

I am glad to see that XSkin has been a great help to you!

1

I like that you moved to the tab design, it can allow more space on a single gui and "sections" are created by the tabs for more of a "user friendly" application

2

I like the "sub-sections" made with Guictrlcreategroup(), this creates a title for that sub-section and a thin line around that area... example

I am not sure... again i am not sure with the design of XSkin that you can use this control/design

3

I think the Icons look nice if used properly and there are now buttons available with skins in XSkin.au3, however buttons are more easily implimemented with EzSkin.exe. EzSkin does not use mouseover colors etc

just some thoughts

8)

[Valuater]

Yep, Val did great with X-Skin

Checkboxes??? I think you can change the colour of them by using a .dll so you will need to do a searh.

XSkinID[#]

will also change the color of the checkboxes with a mouse-over movement

8)

[James]

OH, I didn't know that Thanks Val.. I will be making my life alot easier now

[dufran3]

XskinID...hrmm...never heard bout that. Thanks for the tips. I will see if creating a group for these will help make things a little easier to use. I really appreciate your comments. As you can see in my "2nd" new GUI, the color scheme is poo. However, I haven't been able to change the actual tab color, to match the "inside of the tab" any thoughts?

[Valuater]

... I haven't been able to change the actual tab color, to match the "inside of the tab" any thoughts?

Nopper, I don't know of any way to change the atual "tab"'s color

8)

[dufran3]

I found the XskinID in the Xskin.au3 file...how do I use this. Sorry man...

; option, automatic mouse-over color for "your" controls use $XSkinID[ ]
; see Autoit Limits in help for GUICtrlSetBkColor()
;Dim $XSkinID[6] ; the amount of controls you want "mouse overed" +1, see example below

Edited February 28, 2007 by dufran3

[Valuater]

I found the XskinID in the Xskin.au3 file...how do I use this. Sorry man...

; option, automatic mouse-over color for "your" controls use $XSkinID[ ]
; see Autoit Limits in help for GUICtrlSetBkColor()
;Dim $XSkinID[6] ; the amount of controls you want "mouse overed" +1, see example below oÝ÷ Ûú®¢×¤yêbÚ.r"¶ax7¨Ëkjب z+^ÆZ{[azë²êå

8)

[dufran3]

hrmmm...get a "XSkinIcon" undefined function. I checked the Xskin.au3 file I'm including, and the function is in there....hrmmm...

[Valuater]

hrmmm...get a "XSkinIcon" undefined function. I checked the Xskin.au3 file I'm including, and the function is in there....hrmmm...

I remember we covered this one in your last thread

BTW. do you have the latest XSkin.au3 file ???

Feb. 12, 2007

XSkin.au3 v1.3.7 ** UPDATED **

8)

Edited March 1, 2007 by Valuater

[dufran3]

Roger, double checked, latest and greatest.

[Valuater]

Roger, double checked, latest and greatest.

post it here.... or send it to me in a PM...

I will check ti out for you

A FULL ZIP FILE WITH ALL FILES INCLUDED..PICS ETC

8)

Edited March 2, 2007 by Valuater

[dufran3]

PM'd u!

[Valuater]

PM'd u!

OK!!! There are numerous errors that are not XSkin problems

like...

$main1 = XSkinGUICreate("Testing", 400, 500, $Skin_Folder)

$XIcon = XSkinIcon($XSkinGui, 3)

should be

$main1 = XSkinGUICreate("Testing", 400, 500, $Skin_Folder)

$XIcon = XSkinIcon($main1, 3)

there are many more but i sent you the script back with

corrected...

color over labels, gui closing buttons, select all, deselect all, etc

8)

[EndFunc]

I am creating a second GUI. The first GUI that I have created. Was fantastic, and worked well. However, it was not visually appealing at all. I am trying to "re-vamp" it, to make it look better. I'm not sure how. I was hoping that some of you may have some ideas for me. Since you guys are all fantastic, and have some very good GUI's yourselves. First, the GUI is a Automation Tool for installing apps in my industry. IS staff checks the boxes of applications that they need installed, and settings, and other things. They then click the Start Button, and it runs through and checks for the boxes that have been selected, and runs the appropriate function. Now that you know how this is used, maybe you can provide some assistance as far as design goes. The code seems to function well, and I haven't had problems. Like I said, just having issues with the design of the GUI. First is a pic of the first GUI. I blocked out some of the info for privacy only. :-(

As you can see, it is cluttered, not alphabetized, and all other many of imperfections. here is the new one that I started.

Ideas anyone? I was hoping to use maybe an Icon for each of the items in the list, as you can see, I haven't re-entered all back into the new GUI, but I wasn't sure about the frame of the GUI yet. HELP!?

Thought I should add this, Again, I really appreciate any input! Thx A TON!

There a million ways you can make your app look and with XSkin it just makes it even better. Now the design part is cool but you can also add a whole lot more functionality to it. If you want it to do certain things show the progress, but not using progress bars but a display. You can also have it give you computer information, log everything that is ran etc. One thing I had a problem with when I first started this last year was updating it. I see that your items are out of order and not alphabetized. I'm assuming you'd have to edit your source code change that around or add new items.

What I did on my last version I created, was made it slightly dynamic and it reads config files to get the info. I just write the code basically with all variables and then it looks at the config file for the location of the installs, the name of the installs, the name of checkbox etc. When I want to add a new item, I just add it to the config file and when the program is ran its there as another checkbox. That is a whole lot to go into but just letting you think of other things to get you going if you wanted more functionality since you were redesigning.

Hope my suggestions help.