Form Design Guidelines
Design Principles
- Required fields only where truly necessary
- Clear help text on every field
- Logical field ordering
- Fast keyboard navigation
Visual Indicators
| Indicator | Meaning |
|---|---|
| Red asterisk (*) | Required field |
| Gray help icon (?) | Hover for field description |
| Green checkmark | Field validated successfully |
| Red border | Validation error |
Field Width Standards
| Width | Use For |
|---|---|
| 100% | Text areas, single important fields |
| 50% | Paired fields (e.g., Email + Role) |
| 33% | Grouped fields (e.g., City + State + Zip) |
Form 1: New Person
Create a new person record for IT team members and application owners.
┌─────────────────────────────────────────────────────────────┐ │ NEW PERSON │ ├─────────────────────────────────────────────────────────────┤ │ │ │ Full Name * │ │ ┌─────────────────────────────────────────────────────┐ │ │ │ │ │ │ └─────────────────────────────────────────────────────┘ │ │ Full name as it appears in company directory │ │ │ │ Email * Department │ │ ┌────────────────────────┐ ┌────────────────────────┐ │ │ │ │ │ │ │ │ └────────────────────────┘ └────────────────────────┘ │ │ Work email address Team or department name │ │ │ │ Active * │ │ ┌────────────────────────┐ │ │ │ Active ▼ │ │ │ └────────────────────────┘ │ │ Active or Inactive │ │ │ │ ┌──────────┐ ┌──────────┐ │ │ │ Cancel │ │ Create │ │ │ └──────────┘ └──────────┘ │ └─────────────────────────────────────────────────────────────┘
Field Specifications
| Field | Type | Width | Required | Default | Help Text |
|---|---|---|---|---|---|
| Full Name | Text | 100% | Yes | - | Full name as it appears in company directory |
| Text | 50% | Yes | - | Work email address | |
| Department | Text | 50% | No | - | Team or department name |
| Active | Select | 50% | Yes | Active | Active or Inactive |
Form 2: New Server
Create a new server record for physical servers, VMs, or cloud instances.
┌─────────────────────────────────────────────────────────────┐ │ NEW SERVER │ ├─────────────────────────────────────────────────────────────┤ │ │ │ Hostname * │ │ ┌─────────────────────────────────────────────────────┐ │ │ │ │ │ │ └─────────────────────────────────────────────────────┘ │ │ Server hostname (e.g., web-prod-01) │ │ │ │ IP Address Server Type * │ │ ┌────────────────────────┐ ┌────────────────────────┐ │ │ │ │ │ Physical ▼ │ │ │ └────────────────────────┘ └────────────────────────┘ │ │ e.g., 192.168.1.100 Physical, Virtual, Cloud │ │ │ │ Operating System Environment * │ │ ┌────────────────────────┐ ┌────────────────────────┐ │ │ │ │ │ Production ▼ │ │ │ └────────────────────────┘ └────────────────────────┘ │ │ e.g., Ubuntu 22.04 LTS Production, Test, Dev │ │ │ │ Status * Managed By │ │ ┌────────────────────────┐ ┌────────────────────────┐ │ │ │ Operational ▼ │ │ Select person... ▼ │ │ │ └────────────────────────┘ └────────────────────────┘ │ │ Operational, Non-Op, Maint Person responsible │ │ │ │ ┌──────────┐ ┌──────────┐ │ │ │ Cancel │ │ Create │ │ │ └──────────┘ └──────────┘ │ └─────────────────────────────────────────────────────────────┘
Field Specifications
| Field | Type | Width | Required | Default |
|---|---|---|---|---|
| Hostname | Text | 100% | Yes | - |
| IP Address | Text | 50% | No | - |
| Server Type | Select | 50% | Yes | Virtual |
| Operating System | Text | 50% | No | - |
| Environment | Select | 50% | Yes | - |
| Status | Select | 50% | Yes | Operational |
| Managed By | Object Picker | 50% | No | - |
Object Picker Configuration
Managed By Field:
- Object Type: Person
- Filter:
Active = "Active" - Display: Full Name (Email)
- Search: Full Name, Email
Form 3: New Application
Create a new application record for business applications.
┌─────────────────────────────────────────────────────────────┐ │ NEW APPLICATION │ ├─────────────────────────────────────────────────────────────┤ │ │ │ Application Name * │ │ ┌─────────────────────────────────────────────────────┐ │ │ │ │ │ │ └─────────────────────────────────────────────────────┘ │ │ Business-friendly name (e.g., Customer Portal) │ │ │ │ Version Environment * │ │ ┌────────────────────────┐ ┌────────────────────────┐ │ │ │ │ │ Production ▼ │ │ │ └────────────────────────┘ └────────────────────────┘ │ │ Current version number Production, Test, Dev │ │ │ │ Status * Managed By │ │ ┌────────────────────────┐ ┌────────────────────────┐ │ │ │ Operational ▼ │ │ Select person... ▼ │ │ │ └────────────────────────┘ └────────────────────────┘ │ │ Operational or Non-Op Business owner │ │ │ │ Runs On │ │ ┌─────────────────────────────────────────────────────┐ │ │ │ Select server(s)... ▼ │ │ │ └─────────────────────────────────────────────────────┘ │ │ Server(s) where app runs │ │ │ │ ┌──────────┐ ┌──────────┐ │ │ │ Cancel │ │ Create │ │ │ └──────────┘ └──────────┘ │ └─────────────────────────────────────────────────────────────┘
Field Specifications
| Field | Type | Width | Required | Default |
|---|---|---|---|---|
| Application Name | Text | 100% | Yes | - |
| Version | Text | 50% | No | - |
| Environment | Select | 50% | Yes | - |
| Status | Select | 50% | Yes | Operational |
| Managed By | Object Picker | 50% | No | - |
| Runs On | Object Picker (Multi) | 100% | No | - |
Object Picker Configuration
Runs On Field:
- Object Type: Server
- Filter:
Status = "Operational" - Display: Hostname (Environment)
- Search: Hostname, IP Address
- Multi-select: Yes
Form Validation Patterns
Hostname Validation
^[a-z0-9]([a-z0-9-]{0,61}[a-z0-9])?$
Valid examples: web-prod-01, db-east-primary, app1
Invalid examples: Web-Prod-01 (uppercase), -server (starts with hyphen), my_server (underscore)
IP Address Validation
^((25[0-5]|(2[0-4]|1\d|[1-9]|)\d)\.?\b){4}$
Valid examples: 192.168.1.100, 10.0.0.1, 172.16.0.50
Invalid examples: 256.1.1.1 (out of range), 192.168.1 (incomplete)
Email Validation
^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$
Valid examples: user@company.com, first.last@subdomain.company.org
Invalid examples: user@company (no TLD), @company.com (no local part)
Error Messages
Validation Errors
| Field | Error | Message |
|---|---|---|
| Name | Empty | Please enter the person's full name |
| Empty | Please enter a work email address | |
| Invalid format | Please enter a valid email address | |
| Duplicate | A person with this email already exists | |
| Hostname | Empty | Please enter a hostname |
| Hostname | Invalid format | Hostname must be lowercase letters, numbers, and hyphens |
| IP Address | Invalid format | Please enter a valid IP address (e.g., 192.168.1.100) |
Warning Messages
| Scenario | Message |
|---|---|
| Production server without owner | Consider assigning an owner for production servers |
| Production app without owner | Consider assigning an owner for production applications |
| Production app without server | Consider linking this application to its hosting server |
| Setting person to Inactive | This person owns X servers and Y applications. Reassign before deactivating. |
Keyboard Shortcuts
| Shortcut | Action |
|---|---|
| Tab | Move to next field |
| Shift+Tab | Move to previous field |
| Enter | Submit form (when on button) |
| Escape | Cancel/close form |
Schema Forge