Icons for Access using Metro with Greg Regan

Ever wish your Access applications looked less like software from the 1990s and more like modern, professional interfaces?

Greg Regan's presentation to the Access Express Australia user group demonstrates how to create sleek, icon-based interfaces using Metro Studio, a free tool from Syncfusion. The session covers the complete workflow from finding the right icons to implementing them in Access forms, including color selection, sizing considerations, and handling different icon shapes. Greg also explores advanced techniques like creating paired icons for enabled/disabled states and addresses the practical challenges developers face when working with non-square icons.

Whether you're looking to modernize legacy applications or simply want to move beyond text-heavy interfaces, this detailed walkthrough provides all the tools and techniques needed to create professional-looking Access applications.

Why Choose Icon-Based Interfaces

Benefits Over Text-Based Design

• Faster user interaction once users learn the icons
• More professional and modern appearance
• Space-efficient design
• Universal visual language

Implementation Considerations

• Include tooltips for first-time users
• Maintain consistency across the application
• Consider your user base (technical vs. general users)
• Balance aesthetics with functionality

Metro Studio Overview

Key Features

• Over 7,000 free flat and wireframe icons
• Organized by categories for easy browsing
• Project-based organization system
• Built-in color customization tools
• High-resolution export capabilities

Icon Styles

• Wireframe: Minimalist, outline-style icons (recommended for consistency)
• Flat: More detailed icons including brand logos and specific applications

Finding and Organizing Icons

Search Methods

• Category browsing: Use left-side categories for topic-specific icons
• Keyword search: Type terms like "computer," "exit," or "settings"
• Brand icons: Available in flat style for applications like Excel, Facebook

Project Management

• Create client-specific projects for organization
• Group related icons together
• Use descriptive project names
• Build reusable icon libraries

Color Selection and Branding

Color Inspiration Sources

• Coolors.co: Online palette generator with free and paid options
• Power BI dashboard templates: Search Google Images for color combinations
• Client branding: Extract colors from existing company materials

Color Implementation Tools

• Browser extensions: Colorzilla (Chrome), Tab Color Picker (Edge)
• Desktop tools: Instant Eyedropper (free system tray application)
• Built-in Access: Use "More Colors" option to find hex codes

Color Workflow

1. Select colors from Access form elements
2. Copy hex codes from the custom color dialog
3. Apply colors to entire icon sets in Metro Studio
4. Maintain consistency across all project icons

Technical Implementation

Icon Preparation in Metro Studio

• Use 256-pixel resolution for crisp display
• Remove padding for precise alignment
• Set transparent backgrounds
• Export all icons to dedicated client folders

Access Integration

• Use Image controls instead of Command buttons for better image handling
• Set Size Mode to "Zoom" for proportional scaling
• Utilize the Access image gallery for shared icons
• Implement click events for functionality

Form Design Best Practices

• Create frames with labels for visual organization
• Use consistent spacing and alignment
• Align multiple icons using Access's arrange tools
• Consider screen resolution differences

Advanced Techniques

Paired Icon States

• Create enabled and disabled versions of the same icon
• Use different colors to indicate functionality status
• Implement form load logic to show appropriate icon state
• Stack icons and show/hide based on data conditions

Handling Non-Square Icons

• Accept that landscape/portrait icons require manual adjustment
• Use frames for visual alignment reference
• Resize icons individually while maintaining proportions
• Consider custom dimensions in Metro Studio for better initial sizing

Image Control vs Command Button

• Image advantages: Better scaling, transparent backgrounds, precise control
• Command button limitations: Poor image handling, resolution dependencies
• Event handling: Both support click events and mouse move events

Workflow Summary

Complete Process

1. Create new project in Metro Studio
2. Search and collect required icons
3. Choose consistent color palette
4. Apply colors and settings to all icons
5. Export icons to project folder
6. Create Access form with image controls
7. Link icons to image controls
8. Implement click events and functionality

Quality Control

• Maintain visual consistency across all icons
• Test on different screen resolutions
• Verify icon alignment and spacing
• Ensure tooltips provide clear descriptions

Conclusion

Metro Studio provides Access developers with a professional solution for creating modern, icon-based interfaces without requiring design expertise. The combination of free, high-quality icons with straightforward customization tools makes it possible to transform basic Access applications into polished, user-friendly systems. While some manual adjustment may be needed for non-square icons, the overall workflow is efficient and produces consistently professional results.

Recording

The full recording is available on YouTube:

Join Live!

Want to get even more out of these presentations? Join the live Access User Group events! The next upcoming events are listed on the AUG Event Calendar.

Attending live gives you the opportunity to:

• Interact directly with presenters during Q&A sessions
• Network with other Access developers
• Share your own experiences and challenges
• Get immediate answers to your specific questions
• Participate in group discussions

With multiple user groups across different time zones (and languages!), you're sure to find a meeting time that works for your schedule.

Acknowledgements

• Base cover image generated by FLUX-schnell
• Initial draft generated by Claude-Sonnet-4