Overview
- 1. Enable My Domain and Brand Your Login Page
- 2. Build Persona-Based Lightning Apps
- 3. Design a Single Dynamic Homepage
- 4. Convert Record Pages to Dynamic Forms
- 5. Leverage Dynamic Actions for Contextual Buttons
- 6. Configure the Utility Bar for Instant Tools
- 7. Global Actions for Swift Record Creation
- 8. Apply Themes and Branding with SLDS Tokens
- 9. Optimize List Views and Search Layouts
- 10. Enable Einstein Search and Generative AI Tools
- Conclusion and Next Steps
A well-crafted user interface drives adoption, reduces clicks and frustration, and even enhances user morale. As a Salesforce administrator or consultant, you can deliver significant return on investment through configuration, metadata-driven declarative customizations, and a few low-code tactics. This guide explores ten high-impact UI adjustments, detailing the exact steps, best practices, and common pitfalls. By following these techniques, you will transform a plain-vanilla org into a polished, branded, and highly efficient workspace.
1. Enable My Domain and Brand Your Login Page
Implementing My Domain is the first prerequisite for virtually all advanced UI customizations. It gives you control over your login URL, enables Lightning components packaging, single sign-on, and more.
Deploy My Domain
- In Setup search My Domain and enter a unique subdomain name.
- Click Check Availability, then Deploy to Test and finally Deploy to Users once validated.
- Your login URL will become https://yourcompany.my.salesforce.com.
Configure Login Page Branding
- In Setup navigate to My Domain → Authentication Configuration.
- Under Login Page Branding upload a logo (JPG, PNG, or GIF; maximum 100 KB).
- Select a background color using a hexadecimal code.
- Optionally add custom CSS by uploading a static resource and referencing it in the login policy metadata.
xml
CopyEdit
<!-- Sample loginPolicy metadata -->
<loginPolicy>
<branding>
<logoUrl>/resource/CompanyLogo</logoUrl>
<backgroundColor>#0A4F7B</backgroundColor>
</branding>
</loginPolicy>
Best Practices
- Use a logo with transparent background to accommodate both light and dark modes.
- Test on mobile to verify that the logo scales appropriately.
2. Build Persona-Based Lightning Apps
Tailor the navigation, branding, and utility tools for different teams without writing code.
Create a New Lightning App
- Go to Setup → App Manager → New Lightning App.
- Define the app name, description, and brand color palette.
Select Navigation and Utility Items
- In the Navigation Items step, add only the objects, tabs, reports or dashboards relevant to that user group.
- Under Utility Bar, click Add, then choose tools such as Flow, History, Macros, or a Custom Lightning Component.
Assign to Profiles or Permission Sets
- Save the app, then click Manage Profiles, selecting only the profiles or permission sets that need access.
Common Pitfalls
- Assigning too many navigation items can slow down load times.
- Remember to review utility items periodically as process needs evolve.
3. Design a Single Dynamic Homepage
Instead of maintaining separate homepages for Sales, Marketing, and Finance, use component visibility filters to drive a unified page.
Create the Base Homepage
- In Setup → Lightning App Builder, click New → Home Page.
- Drag and drop common components such as Today’s Tasks, Recent Items, and Chatter Feed.
Add Team-Specific Report Charts
- For each team, drag a Report Chart component.
- Select the corresponding report, for example “Open Campaigns by Status” for Marketing.
Configure Visibility Filters
- Select a report chart component, then click Set Component Visibility.
- Add a filter: Field = User → Profile → Name; Operator = Equals; Value = e.g. “Marketing User”.
Activate and Assign
- Save, then choose Activation → Org Default to assign the page to all users. Availability can also be scoped by app.
Optimization Tips
- Keep common components minimal to avoid clutter.
- Consolidate similar metrics into a single dashboard component where possible.
4. Convert Record Pages to Dynamic Forms
Dynamic Forms let you control field and section visibility based on record data, replacing traditional page layouts.
Upgrade to Dynamic Forms
- Open a record page in Lightning App Builder.
- Click on a record detail panel and select Upgrade Now to migrate fields into dynamic sections.
Create Field Sections
- Drag the Field Section component onto the canvas.
- Within each section, drag individual fields from the Fields pane.
Set Visibility Rules
- For each field or section, click Set Component Visibility.
- Define filters such as “Show Discount Rate when Opportunity Stage equals Proposal”.
Advantages
- Eliminates the need for multiple page layouts per profile.
- Ensures users only see relevant fields based on business logic.
5. Leverage Dynamic Actions for Contextual Buttons
Dynamic Actions provide fine-grained control over which actions appear in the highlights panel, based on record context.
Enable Dynamic Actions
- In Lightning App Builder, select the Highlights Panel component.
- Check Enable Dynamic Actions.
Add and Filter Actions
- Click Add Action, select standard or custom actions (e.g. Close As Won).
- For each action, click Set Component Visibility and add criteria such as “Stage equals Negotiation”.
Best Practice
- Limit actions to no more than five in the highlights panel to avoid overwhelming the user.
6. Configure the Utility Bar for Instant Tools
The Utility Bar docks at the bottom of the app and provides one-click access to productivity items across pages.
Edit the Lightning App
- In App Manager, locate the Lightning App and click Edit → Utility Bar.
Add Utility Items
- Click Add, then choose from standard items like History, Notes, Report Chart, or Screen Flow.
- For a guided data-entry widget, select Flow, then pick the relevant flow (e.g. Contact Creation Wizard).
Custom Icons and Visibility
- Select an SLDS icon for each item.
- Configure default panel dimensions and optional show/hide filters if needed.
Pro Tip
- Use the Utility Bar for time-saving components such as a collapsible Kanban board or a quick search panel.
7. Global Actions for Swift Record Creation
Global Actions allow users to create records or launch flows from any page, streamlining common tasks.
Create a Global Action
- Navigate to Setup → Global Actions → New Action
- Choose an Action Type: Create a Record or Flow.
Define Predefined Values
- In the action layout editor, drag the fields you want users to fill.
- Use Predefined Field Values to auto-populate fields such as Record Type or Owner.
Assign to Publisher Layouts
- Click Action Assignments to add the new Global Action to the Mobile & Lightning Experience Actions section for specific page layouts or apps.
Considerations
- Keep the Global Action form concise to reduce friction.
- Test on mobile to ensure the action panel behaves responsively.
8. Apply Themes and Branding with SLDS Tokens
Use the Themes and Branding interface combined with Salesforce Lightning Design System 2 tokens for cohesive styling.
1. Create or Edit a Theme
- Go to Setup → Themes and Branding → New Theme.
- Upload your company logo, define primary and secondary colors, link font choices if needed.
2. Preview and Roll Out
- Use Preview Theme to verify colors, images, and links on home and record pages.
- Click Activate to make the theme live.
3. Advanced Styling with SLDS Tokens
- Package a .tokens file inside a Theme Layout Bundle or Lightning Web Component.
- Override SLDS variables for fine-tuned control of spacing, typography, and color variables.
Tip
- Keep typography consistent with your corporate style guide by specifying font families in tokens.
9. Optimize List Views and Search Layouts
Improving list views and search layouts helps users find the right records quickly and reduces time spent filtering.
Customize Search Layouts
- In Object Manager, select an object and click Search Layouts → Edit.
- Choose key columns such as Name, Stage, Owner, or Custom Status fields.
Design Effective List View Names
- Use numeric prefixes (for example 01_Open Cases, 02_High Priority) to force a logical ordering.
- Adopt clear conventions so users instantly know which list view they need.
Enhance Hover Details
- In Compact Layouts, assign critical fields such as Primary Contact or Dollar Amount.
- These fields appear in the highlights panel and when hovering over lookup links.
Outcome
- Users spend less time scrolling and more time taking action on key records.
10. Enable Einstein Search and Generative AI Tools
Einstein Search and built-in generative AI features let users find data via natural language and get AI-powered summaries.
Activate Einstein Search
- Setup → Einstein Search → toggle Enable Einstein Search.
- Choose which users or licenses receive advanced features like natural-language search operators.
Configure Search Preferences
- Customize search filters in Setup → Global Search Settings, defining default result ranking and object visibility.
Integrate Agentforce Prompt Builder
- In Flow Builder, drag the GPT Action component from the Palette.
- Provide a prompt template such as “Summarize the details of this Account record.”
- Map record fields into the prompt parameters for dynamic inputs.
Best Practices
- Monitor usage to gauge return on AI-driven efficiency.
- Educate users on phrase structures such as “My open opportunities above $50k”.
Conclusion and Next Steps
Transforming your Salesforce UI does not require code expertise or hefty budgets. By enabling My Domain, building persona-based apps, consolidating homepages, and leveraging Lightning features like Dynamic Forms, Dynamic Actions, and the Utility Bar, you create a branded, efficient environment. Optimizing list views and search layouts reduces friction, while Einstein Search and generative AI elevate productivity further.
Action Plan
- Prioritize one or two features from this list to implement in a sandbox environment this week.
- Conduct a quick user feedback session to identify immediate pain points.
- Roll out changes incrementally, measuring adoption and satisfaction metrics after each deployment.
With these steps, you will maximize user adoption, reduce support tickets, and showcase measurable ROI on your Salesforce projects.