Lightning Experience from Salesforce enables us to built modern enterprise apps easily and quickly. The Lightning Experience combines the Lightning Design System, Lightning App Builder and Lightning Components. Astrea IT Services has gained strong expertise in transitioning into Lightning framework and Astrea has helped many companies to transform their existing old UI into a new Lightning look and feel. The section below describes Astrea’s experience and some of the work we have done for few clients.
Lightning Design System
Lightning Design System is developed to inculcate some important design principles while building applications namely, Simplicity, Efficiency, Flexibility and Beauty.
Astrea has experience in using and implementing various resources of the Lightning framework and have trained our developers to build the applications using them. Some of the resources that Astrea have used to develop Visualforce pages, Lightning pages & Component and apps are
- CSS Frameworks, to define the UI components like page headers, labels, etc.
- Icons- Doctype, standard, utility actions
- Design Tokens- Variables like color, spacing, etc
- Font- the new available fonts used in the development process.
Lightning components provides a client-server framework that accelerates development, as well as app performance, and is ideal for use with the Salesforce1 mobile app and Salesforce Lightning Experience.
The event driven architecture is followed in the development using the Lightning framework and the Components are the self-contained and reusable units of an app. They represent a reusable section of the UI, and can range in granularity from a single line of text to an entire app.
Astrea has worked on number of components for various client app and for internal organizational purposes. Astrea has developed components for Campaign, Leads and also components for custom apps. Some of the work done by Astrea is mentioned in the section below.
Astrea & Lightening
Astrea has worked on Lightning framework for various clients around the globe and have successfully transform the UI for some clients and have developed components for few of them. Astrea has worked on a mix type of development work that includes CSS framework and Lightning design and custom apps using the Lightning Components. Examples of some of the work done by Astrea are as follows,
- Lightning Components
- ASSET HIERARCHY
The Asset tree screen that represents Asset records in hierarchical manner. A key feature of this page is the use of Lightning design components which make a page more prepossessing and user friendly. Each Asset record has a parent asset as a lookup field, which is used to determine the structure of the hierarchical tree.
At present, it reflects the name of Asset and its respective status, but can be further customized to represent other fields as well. Complete structure follows a specific indentation according to parent-child hierarchical system in order to make it more descriptive. One can collapse and expand the tree by clicking on. Asset record is currently open appears to be bold. As one moves down the list, corresponding asset record is highlighted.
CAMPAIGN MEMBER CLONING
To overcome the inability to clone a campaign member in lightning, we developed a component which could be added to Campaign Member page layout. This also enable the user to create a new Contact (Account) and Lead which further acts as a value in these required fields. It reflects error when any of the required field is not specified or when one tries to insert an already existing campaign member. One doesn’t need to type the complete name for a Contact, Lead and Campaign Member, a new lookup is generated each time a user enters a substring. On selecting a specific Name, there is no need to type the complete name. The given screenshot represents a modal which appears by clicking on Further by entering the details and clicking on , saves a new campaign member.
- ASSET HIERARCHY
- Development of Pages
A.Intake Entry Page
This page is a custom Intake Page that captures Contacts, Accounts, Cases and other custom objects. Based on the Salesforce Lightning UI styling, we developed custom Visualforce page with dynamic tabs, forms to take the input, modals as pop-ups, cards to show the related lists, data tables to show the data in tabular form and lookups, select lists, spinners and date-picker as well. We also used lightning based components to employ functionalities like making a field Required, Disabled and read only, displaying the Error Message.
Visualforce Pages transformation
This project involved conversion of 40 visualforce pages into their respective Lightning UI version as per the guidelines provided in SLDS('Salesforce Lightning Design System) documentation. The project dealt with Strategy Mapping, creating New Meetings, adding attendees to Meeting, adding meeting objectives,meeting insights and many more such functionalities. All the visualforce pages are developed using lightning ready and involved complex functionalities.
The screenshots below highlight some of the lightning UI ready visualforce pages which have multiple button and multiple tabs functionalities included on a single page.
- A.Intake Entry Page
Development of Apps
An App developed by Astrea which gives feel of sending a handwritten letter to the recipients instead of a regular email. The App is built using Lightning framework and have integration to other API and is mobile enabled.
Key Features implemented:
- App sends email to its recipient by converting email content into predefined handwritings using message template builder.
- Works on Mobile as well as on Salesforce classic.
- The app has WYSIWYG (What You See is What You Get) feature and shows the converted mail in hand written words as the user types (Real time) in Message template builder
- One writes mail with Emoticons and can insert Signature (user’s name is converted to user selected handwriting automatically) in the content
- Ability to change the background of the email Content.
Message Template Builder
On the left hand side the user inputs the desired content which is converted in selected language (selected via ‘Handwriting Style’).
One can go through all the recipients to whom the user will be sending the letter. On left the content to be sent is seen and on the right the sender’s and recipient’s address.Screenshot below
The user can either schedule the date on which all the letters will be sent or one can send it instantly by a click on “Send your notes now” button.