I am stuck with a app. It has so many fields and i am not good at designing forms..! But i need this app. to be look professional. So i want to know weather are there any standards which are adapted while designing a form ?
I think it looks alot better to use the "Align To Grid" menu item on objects. This 'snaps' them to the dotted gridlines you see on the form when designing (by slightly changing their height and width properties). Also, I find using some nice graphics on Toolbar buttons and even sometimes on normal command buttons work well
Thanks for the reply but i meant like are'nt there any standards ? Like how MS designs their apps. ? What they keep in mind when designing the apps. ? What standards they have when designing the app. ?
Like how much space should be there between 2 text boxes ?! so the app looks great and customer also likes working on it.
Professional form? Hmm... what does a professional form look like? The first thing that comes into my mind is that use as few objects as you can. Another thing: group objects (visually) that are related to each other in some way. Also, don't place objects too randomly on a form. What I mean is this:
Where combobox changes what is to be changed. And to make it userfriendlier, you could make even so that pressing enter saves the current value that is being edited and then next item is shown from the combobox for edit.
Humm... that's most I can figure out for now. I've seen too many ugly forms, but I can't remember all of the things that are "wrong" about them.
Edit Something more came in to my mind: you can use frames to place stuff inside them. This sometimes makes a nice look to the form, it depends of a project.
And as for the space between two textboxes, you just gotta try to trust your visual eye
Nope, don't think there are any standards like this. Tis up to you.
If you use a gap of say 45 twips (3 pixels) then you should use this throughout your app.
If you use command buttons like OK, Save and Cancel, then these should be the same size throughout your app, and the same gap.
Everything should use the same font too.
These are just application specific standards.
You can make these what the hell you like
We have a class in our app that validates a form.
You pass the form to a sub and it validates it for you and pops up messages...ie:
In a class module calles clsValidateForm
VB Code:
Option Explicit
Public Sub ValidateForm(ByRef pfrmForm As Form)
Dim ctlControl As Control
Form Each ctlControl In pfrmForm.Controls
If TypeOf ctlControl Is CommandButton Then
ValidateButton ctlControl
End If
Next ctlControl
End Sub
Private Sub ValidateButton(ByRef pcmdButton As CommandButton)
If pcmdButton.Width <> 1200 Or pcdmButton.Height <> 400 Then
MsgBox pcmdButton.Name & " should be 1200 by 400 twips", vbExlamation, "Validate Form"
End If
End Sub
Then in a module you have:
VB Code:
Public Sub ValidateForm(ByRef pfrmForm As Form)
Dim objValidate As clsValidateForm
Set objValidate = New clsValidateForm
objValidate.ValidateForm pfrmForm
Set objValidate = Nothing
End Sub
Then in your form you have:
VB Code:
Private Sub Form_Load()
ValidateForm Me
End Sub
This means that if you break your own standards then your app warns you when you open a form.
The validate class in our app here at work is HUGE! It checks for everything. We even validate control names, to make sure developers have named them correctly.
It checks other thinks like whether labels have a transparent background etc. Tis up to you how far you take this, but it's a good idea to use something like this. This ONLY monitors your own standards you have set throughout your own app.
VB Code:
Private Sub ValidateButton(ByRef pcmdButton As CommandButton)
If pcmdButton.Width <> 1200 Or pcdmButton.Height <> 400 Then
MsgBox pcmdButton.Name & " should be 1200 by 400 twips", vbExlamation, "Validate Button"
End If
If Left$(pcmdButton, 3) <> "cmd" Then
MsgBox pcmdButton.Name & "'s name should start with cmd", vbExlamation, "Validate Button"
One little trick, that might help you, is to place the command buttons in a picture box.
In the attached form I have used to picture boxes with no border.
One is alligned to the bottom oif the form.
This makes it very easy to keep the posiitons of ALL your buttons, without moving them manually.
Also, custom colors look ugly if somebody happens not to use Windows default color scheme. Like, someone might have text color white and otherwise a quite dark theme... so either use Windows system colors (tooltip color might work sometimes besides default white).
I think the form posted could be better. At the moment it has too much stuff in it, even if it is quite clear. I'm not too sure on what for the form is done so I can't give a good suggestion myself. But I'm sure there is a way to make it feel lighter and yet keep all the required functionality.
I don't know about you guys, but I have been able to use the tabbed dialog stuff with success, it isn't so bad if you know how to place it, looks much better when you use a tabbed dialog for windows that are only around 1/3 the screen size, any bigger and it kind of gets messy.
EDIT: Why the hell is there an angry face on the side of this topic?
thanks for all the tips etc. the form is actually i think can't be compacted due to the calculations preformed. Using tabstripi is not an option for me as it does not works becuase the user need to see the all the data at same time.
I have used different colours so the manufacturer's and suppplier details can be differentiated becuase both have same fields etc.
Now you all know that it needs calculations to be done etc. so can this form be modified now ?
Yup. Spot on.
The only thing I would do is have the buttons at the bottom of the screen.
And instead of 2 buttons I would have an OK, Cancel and Save button.
OK: Saves changes and unloads form.
Cancel: Cancels changes and unloads form.
Save: Saves changes, but leaves form open so the user can edit a field if they want to.
Something I always do is: Change the border to flat, AND resize the height to fit the input - and nothing more(this is for textboxes), so in the application you have, I'd make the textboxes small enough to only cover one line, unless you actually use the multiline functionlity, in which case my advice is useless. I've often found compacting it gives that extra edge that makes it really nice =).
"Lies, sanctions, and cruise missiles have never created a free and just society. Only everyday people can do that."
- Zack de la Rocha
I agree. At a 2nd glance your txt boxes do seem a little large in height.
I size them so the white gap at the top is the same as the bottom. You'l notice that you have a massive white gap at the bottom of your txtboxes.
You'll be supprised at the amount of realestate that is released on your form when you resize and move controls.
I have again re-designed the form according to the tips and tricks given by all the people..please re-check. Once the form becomes good and attractive i'll then re-design all my forms like that only. Currently i am using Wizards. But i want to give the user the flexibility of adding forms quikly without using wizards. Wizards are helpful but they consume time.
Thanks!
Last edited by AvisSoft; Jul 16th, 2004 at 09:49 AM.
Originally posted by Wokawidget I agree. At a 2nd glance your txt boxes do seem a little large in height.
I size them so the white gap at the top is the same as the bottom. You'l notice that you have a massive white gap at the bottom of your txtboxes.
You'll be supprised at the amount of realestate that is released on your form when you resize and move controls.
Wooof
I don't understand by the white gap...which white gap you're refering to ?
Woka - good spot on the text box height... I could "just tell" something wasn't right, but couldn't put my finger on it. Never send a gnome to do a badger's job.
Merri - while that interface looks cool and is very compact, how it for quick data entry. It looks like it would take alot or clicking around just to enter the data.
techgnome: basically just by pushing enter you get to the next data and save what you just did. That's why I sent the code too so you can test how it works. I'm sure it can be improved, I made it quickly in some 10-15 minutes.
Improving it... probably a possibility to use arrow keys to browse the listboxes so you can easily get back to the last one if you made a typo (at the moment the focus always goes to the textbox below a listbox).
Originally posted by techgnome Woka - good spot on the text box height... I could "just tell" something wasn't right, but couldn't put my finger on it. Never send a gnome to do a badger's job.
Merri - while that interface looks cool and is very compact, how it for quick data entry. It looks like it would take alot or clicking around just to enter the data.
Just my $0.02 worth, take it or leave it.
TG
Hey, I was the one to spot that
"Lies, sanctions, and cruise missiles have never created a free and just society. Only everyday people can do that."
- Zack de la Rocha
Designing a Form
Reply With Quote
