I’m starting this post, which will grow in time, because of feedback through a recent blog poll.
What are some basic design principles that should be remembered when designing an application, any application?
Most design principles are universal and not Access specific. They can apply just as much for Access Forms & Reports, as Excel Userforms, PowerPoint presentations or … Web Application. Here are a few of my basic recommendations.
I’ve split this discussion up into the following sections:
- The Basics
- Planning is Your Best Friend
- Get User Feedback
- Take It All With a Grain of Salt!
- In Conclusion
The Basics
I had a class in university in which we covered creating presentations, the first 2 points (colors and fonts) come from that. The important thing here is to think people are likely to be in front of your application for hours a day and you don’t want to straining their eyes.
Fonts and Colors
Colors
Use calm colors! Try and stay away from bright neon colors, vibrant yellows, reds, greens, … These are hard on the eyes and should be used very sparingly!
Things like the MS Metro tile colors are very harsh, stay away! In small doses they may be good for catching one’s attention, but they are ill-advised for background colors and other elements users may be looking at all day long!
Would you like to look at forms with these background colors all day long?! And yet, I have come across such color schemes in the past.
| #008F00 | #02FCFF | #FF02C6 | #D2FF02 |
There are entire websites dedicated to color selections. The important thing is to use colors that are not straining on the eyes and offer high contrast,
As a general rule, if you decide to go with light colored background, then use a dark font color and if on the other hand you use a dark background, then use a light font color. Using gradient background are typically ill-advised because it becomes very challenging to get a font color that contrast well on all the various background shades.
Bad Choices
| #ffffff background with #2C2B2B font | #ffffff background with #D5D3D3 font | #E3F705 background with #C1FEFF font | #F73136 background with #F77231 font |
Good Choices
| #000000 background with #1B9D2C font | #ffffff background with #000000 font | #8F1414 background with #ffffff font | #234061 background with #fffffffont |
Fonts
Use common font with contrasting colors to the background. Make it easy to read the content! A green font on a yellow background is not a good idea. A white font on a dark background can be.
One of my biggest peeves with some of the recent releases of Access is how MS decided to make the labels grey instead of black, making them harder to read. They have been promoting accessibility and then go do something like this?!
Style is nice, but it should never be at the cost of usability!
Layout
Layout of your forms is another often overlooked aspect of design.
There is a reason forms have different sections: Header, Detail, Footer and it is important to utilize them all!
Do not toss everything into the Detail section, instead enable the form Header/Footer and setup your general form controls appropriately. Things like search controls, buttons to clear a form, close the form, … should be located in the header or footer and standardize through all your forms in your application. Consistency is the name of the game here!
I also recommend differentiating the sections by using different background colors to make the data section, the Detail section, stand out from the general elements (header/footer/…).
Spacing
Having proper spacing is critical to the legibility of the data. Don’t cram things in!
For instances, if we retake the Good color choice from above, look at how much more legible the content is with proper spacing!
| #000000 background with #1B9D2C font | #ffffff background with #000000 font | #8F1414 background with #ffffff font | #234061 background with #fffffffont |
So not only line spacing affects the ease with which users can read, but things like padding in controls can impact your users!
Hidden Features
Functionalities should be obvious. You’re users should not need a manual to use a program. Commands should be easy to see with description labels, tooltips (even this is less than ideal), …
With this in mind, I’m against context-menus. right-click here and there to get different commands is poor design IMHO. Instead, create a custom ribbon, add command button to your header/footer, next to the controls of interest.
With the same reasoning in mind, this is why I shy away from things like double-click events and other secret handshake events that you need to magically know about.
Balance
Like with everything in life, good design is a balancing act at times. It is always nice to add colors, images, … but it needs to be done in a conscious and structured way. Too much of a good thing is a waste and can take away from your overall design and even be detrimental to performance.
I do believe in the KISS principle: Keep It Simple, Stupid. So don’t over complexify the design for no reason.
Uniformity
This one can’t be overstated, try to come up with a color, font, layout, … scheme from the start and stick with it through the entire project. This alone greatly helps with the overall cohesiveness of the application.
If you use the image of a doorway for a close button on one form, don’t use an ‘X’ in another. Make the user easily find themselves no matter what form/report/… they open.
Make all your buttons the same size and if you use images in them try and make them all of the same style.
If you place your close button in the form footer, always place it in the same spot for all you pages/forms.
If your footer is a certain color, apply that to all your footers.
As a general rule, try and use the same font, size, color throughout your design.
Standardize your formats throughout the entire application (dates, times, …).
Consistency should be the name of the game.
Cluttered Design
Densely cluttered designs are a no-no. I understand that it is nice to have everything on one screen, but let’s be realistic, the user will not look/use all that information.
You are much better off from many standpoints: data comprehension, performance, … to break it down into ‘subjects’ and have multiple forms, use tabs, lengthen the form so it scrolls, … At the same time that I say that, try and minimize the need for tab and especially scrolling whenever possible.
Be careful not to have too many list boxes, combo boxes, … as they all require querying the database as thus each instance impacts performance and load speeds. This, yet again, illustrates the importance of streamlining the design of forms to not try and build a single large form.
Help Your Users As Best You Can
This is one element that is often overlooked, try and help your users as much as possible.
- Setup the control order so Tabbing follows the proper flow
- By the same token, remove tab indexing from controls that don’t need to be normally accessed to save your user useless keystrokes
- Provide combo boxes/drop-down menu to choose from when possible to reduce random data entries and help guarantee the quality of the data being input.
- Set it up so that combo boxes/drop-down menu automatically open when they get the focus to save a click of the mouse
- Add visible Shortcut to your commands
- In Access specifically, ditch the built-in date picker and use any of a number of far superior ones
- Automate formatting to ensure consistency. For example, I allow users to enter phone number however they like and use events to reformat them all the same, agreed upon, way.
- Add proper validation. I use events to check the data being enter to notify users when e-mail addresses are invalid, phone numbers are too short/long, dates don’t make sense, …
- …
The key here is testing. Try out your form and perform multiple data entries like your user will and find the frustrations that your users might encounter and try and mitigate them as much as possible.
Dynamic Content
When building complex form/reports it can be beneficial for performance to load as little of the content as possible initially and dynamically load the content of tabs, combo boxes, … only if the user activates/focuses on them. What’s the point of loading everything on a hidden tab? None! Wait until the user activates it to load it’s content.
Obviously load the content you are sure they will always use, no point dynamically loading that.
Make Things Visible
Beyond colors and fonts, when I talk about making things visible to the user, I mean in a way that they will notice it.
Case and point, in Access, the Status bar. In my early years of development, I had many users comment that they never even noticed it and never saw any of the messages I was displaying there that I’ve completely stopped using the thing altogether (even more so now with larger monitors and higher DPIs). Now I use Progress forms, Dialogs, Message Areas that display in the Form itself and fade away, … whatever it takes to be sure the message is properly conveyed and apparent to the user. If they aren’t going to see it, then there’s no point in it in the first place. Conversely, if you think it is worthwhile to notify the user of something, then be sure they see it!
Glitter
I’d also advise you to be careful with your use of Images/Sounds or any media.
Images for your icons is a great thing, but setting images in the headers, footers, as backgrounds is normally a back practice.
Sound is a big no-no, users do not like developers hijacking their sound. I wouldn’t advise creating startup music and the likes.
Regardless of these statement, if you insist on doing so anyways, be sure to balance what you do. Using media, especially non-optimized media can, beyond annoying your users, impact download, load and overall performance of your solution.
Planning is Your Best Friend
I think after reading the above it becomes very apparent that taking a few moments to plan things can great aid you in your design process.
I like to create a simple mock-up that I present to my clients which illustrated clearly my planed color scheme, font selection, layout, … Once they approve it, then I use this mock-up as the basis for creating all my new objects/pages.
When taking over other peoples work I have written code to standardize such things in one shot.
Formats
Save yourself a lot of frustrations and re-design time by asking your client right from the start what format they want for:
- Dates
- Time
- Currency
- Phone Numbers
- …
Get User Feedback
Your best ally should be the users, so ask them what they like and dislike. Get them to test out beta versions, ask their opinion about some of your ideas (layout, colors, fonts, font sizes, …)
Be careful here, the person hiring you may not be the same person using the application, be sure to speak with the actual users!!! I have often found a disconnect between management and users, and it is important to identify this as early on as possible to open a dialog to solve such issue as they typically directly impact the design process.
Get feedback from all parties involved and extract the commonalities, but also divergent aspects. I’d urge you not to make decision for them, point out the divergent points and ask them to discuss it internally and come back to you with their final opinion on the matter (and yes, you can facilitate such discussions, nothing wrong with that).
Take It All With a Grain of Salt!
Like with everything in life, take my advice with a grain of salt. The most important thing at the end of the day is that your client is happy! So the absolute, most important aspect of any design beyond functionality is that you get their buy-in on the design. What I or you like may not be at all what your client likes/wants. This is where a mock-up is your best friend. A couple minutes invested now, can save you countless hours of frustrations and redesign down the road. Do this as early on as you can, prior to starting to develop any pages/objects or code anything.
In Conclusion
Most of this sounds like plain common sense, but as Voltaire put it “Common sense is not so common.” Just google images of interfaces and you’ll be amazed the number of excellent software solutions with absolutely hideous GUIs just because the developers couldn’t, or wouldn’t, do the above.
And if you think none of this is of any importance, this aspect of design, especially when targeting the mass market of the www, is often the decisive factor between someone purchasing your software over another! Remember when people are looking to purchase, the first thing they see and evaluate is your GUI, long before they actually download and try the software!!!
I’ll simply end with my 2 favorite quotes that sum it all up!
Design should never say “Look at me”. It should always say “Look at this”. — David Craib
A user interface is like a joke, if you have to explain it, it’s not that good! — Martin LeBlanc
One of the best sources for useful principles is the book “Tog on Interface”, one of the early designers of the Mac
I’ll have to check that one out. Thank you for sharing.
Daniel: Thanks for the great resource. As a part-time Access developer (I’m a mech eng and create apps to help myself and my team, but don’t do this full-time) and having the ability to drop in working code (sometimes with some tweaks to suit) really helps.
I found a really good general fomatter from Dave Grimes that I really like (formats most all elements of my forms), but it doesn’t address the fonts. I still have to call up every form, and address every element individually to change the font.
Other than changing the default (say I don’t want the labels to be the same font as the text in the combo box, for example), is there a way to add the pop-up font selection dialog to this format tool to set all the same type elements to the same font style?
Daniel,
Can you please expand on this topic via your YouTube channel? I’m a very young Access developer (with only 2 years of experience). I’ve found that effective GUI design in Access is very difficult to implement. It’d be helpful to see a few of your videos on this topic. Thanks!