Salesforce Admins: 5 Things you need to know about the Lightning Design System

Being a Salesforce Admin there is a good chance you would have heard about Lightning from Salesforce.com, Which in the past few months has quickly become the collective noun for a plethora of Lightning related tools, elements, components and even experience. At a high level we have: 

• The Lightning Experience (I'm talking about the new UI here) ;  and, 
• The Lightning App Builder; and, 
• Lightning Components; and now for the piece de resistance, 
• The Lightning Design System 

Don't think for one second that this is not a MASSIVE transformation for salesforce.com and the foundations for the platform for at least the next decade, so trust me when I say, you want to be ALL over this stuff. 

Today I want to shine the light on what the Lightning Design System is and how
it relates to you as a Salesforce Admin. I must admit, I had kinda swept it under a blanket and thought, that's one of those things that developers need to know about, so hey, I will read the the marketing paragraphs on the salesforce.com website and move on. MISTAKE. So without further ado, here are the top 5 things you need to know about the Salesforce Lightning Design System (SLDS): 

1. Hang on ... what the heck is it ? 
   

   
   Basically, Salesforce went and paid some really really smart people to solve modern day enterprise UX (User Experience)  problems, (like I want to access my data on 24 inch iMac and also a 5-inch phone, I want clean designs that are data rich etc etc) Then produce a bucket of tools, icons, graphics, layouts, components that are not only lightning ready, device agnostic but also browser agnostic and then they turned around and gave that to you for free .. oh yeah, and it's open-source. SLDS plays nicely on practically any platform, even if you were going to build a standalone app on heroku #nice!

   The SLDS makes it easy to create apps /components/ pages etc that look and feel like they were built by Salesforce, that fit right into the Lightning feel without having to go back and reverse engineer it. It is constantly being testing, revised, improved and extended .. this is just the start for SLDS.  Pretty awesome right? But I want to show you the view from 30,000 feet up as well. You will have high adoption amongst your user base because your UX is brilliant, onboarding of new users will be improved and my guess is that in time your users will actually begin using their mobile devices more and more to do some of the more complex workflows within your business because its now quick and easy to do and its gorgeous to interact with, we humans do fancy gorgeous things.  Are you starting to see how the SLDS will do much more for organisations then just save you time? This transformation won't happen overnight but you really do get a sense of the behemoth of an opportunity sitting right in front of you. 

2. Yeah but .. how will Admins use it?
   

   Salesforce Admins have long been the go-to for questions like "How do I solve this problem?", "Can we use that feature?", "Hey can we use lightning?". And sometimes we stand proudly and proclaim our Salesforce smarts .. and other times we use the "SNG" approach.. Smile ... Nod...Google .. am I right? So at the very least as an Admin you will understand what it means to leverage the SLDS in situations when you are working with your development team, in situations when you are conveying the value that Salesforce brings to your organisation or even when you are purchasing a Lightning component from the appExchange you will be able to recognise if the SLDS is being leveraged and why that is important..... 

   Moving on to the next level of Admins or as John Stevens describes this class of Admins "Adminelopers" or "Devministers" this is a class of Admin that may sneak into the odd APEX class and add an extra field into a SOQL query (and not forget to update the test class) or jump into a visualforce page and tweak something here and tweak something there .. after all a Visualforce page will generally just contain markup language (kinda like HTML) it's not code-code .. you may have even put something between two <style> tags before. This is where, when you learn a bit more about the SLDS you become kinda scared and kinda wildly ecstatic at the same time, it reminds me of this scene in Mean Girls 

   but alas, I digress ... If you are a "Admineloper" once you start to explore the SLDS you will see how quickly the line is becoming blurry. Almost to the point where you have another stream of Salesforce professional a "Lightning Designer"  you will be able to contribute to projects, add page structures, add Lightning Design System classes to mock up beautiful pages much quicker than you ever have before and then tap-in your developer to hook up the data to the page when you have locked down the design. Kinda cool right? .. WRONG ... FLIPPING AMAZING :D

3. How do you get the SLDS?
   So hopefully by now I have managed to convey that the SLDS is a real tangible thing and that to use it you need to install it in some way or another... Now there are a bunch of techie ways you can do this depending on the development environment and stack being used, but I'm not going to go into that. From an Admin point of view the easiest way would be to install the unmanaged package into your Salesforce Environment. The unmanaged package will insert a Static Resource that can be referenced in Visualforce Pages and Lightning Components. To get a link to the unmanaged package (or if you are so inclined, read about how to install it via command line etc ) head over to the SLDS website (after you have finished reading this of course!) 
   
   
4. What about existing Visualforce pages?
   So if you are a bit of an Admineloper (if you have skipped ahead read section 2 to get the definition) no doubt you are thinking "OMG I can go back and transform my existing Visualforce pages into gorgeous pieces of art by installing this unmanaged package from the SLDS website!"  Whilst that statement has some truth to it, it's not quite "Install and Done".  The SLDS is not yet compatible with existing APEX tags and depending on the complexity of the page it could be quite the crusade, so it would be worth getting your head around the capabilities of the SLDS and then sit down with your Dev team (with a bowl of steaming Christmas pudding and silky smooth vanilla bean custard ... oops sorry, went all Nigella on you) and see if there are any pages that could be transformed fairly easily and give your org a taste of what is to come as well as giving you and your colleagues a chance at exploring the SLDS with real-world examples.  
   
   If you want a no-nonsense fairly "adminified" but highly informative article about Lightning vs Visualforce and want to show up your devs about how much you really do know, I thoroughly recommend having a read of Balkishan Kachawa's post. I consider this almost required reading for any Admin, Developer, Admineloper, Devminister, you get the drift. 
5. How do I learn more about it? 

There are some really existing ways you can get face to face with the Lightning Design System 

• Trailhead >> Lightning Design System If you scan through this module you will see there is a bit of code here and there, but I assure you you don't actually need to write any code, the most you will do is copy and paste snippets and watch the magic unfurl.   
• Lightning vs Visualforce >> Balkishan explores what the differences are, does one replace that other and what you can do with existing Visualforce pages. (And easy for an Admin to follow as well! thanks Balkishan) 
• React University >> Sample Application. The title of this article sounds very techie but if you do anything watch the video on how the SLDS has been leveraged in an app external to the Salesforce platform, it reallystarts to open your eyes around the possibilities. 
• Salesforce UX >> The Next Generation of living Style Guides
• Salesforce UX >> The Salesforce Team Module for Scaling a Design System