#CNX14 - Building Enterprise Mobile Apps With Salesforce1

Editor's Notes

• #5: Salesforce1 is the new customer platform that lets you connect to your customers in a whole new way . We’ve completely re-architected Salesforce to enable a future of connected customers, connected devices and connected apps.
• #8: Before we jump into the app, I want to highlight two key aspects of the navigation. The first is the Left Nav menu. This give users access to the same tabs they would see in the browser app, plus ones specfiic to mobile. This menu is configurable via the Mobile Administration setting in Setup.
• #9: The 2nd aspect is the record view – how your users see the data in salesforce on their device. How many of you a;ready have a bunch of page layouts that you love? [hands raise] Those same page layouts you use for the browser app are used on the mobile devices. That’s what you see on the bottom half of the screen. This top half is controlled by a new layout, called the Compact Layout. The Compact Layout allows you to configure the 4 fields that show at the top of a record – these should be the fields your users need to see at a glance.
• #10: Now let’s take a look at a sample app – one that anyone can build. It requires no coding. Demo package: https://login.salesforce.com/packaging/installPackage.apexp?p0=04ti0000000Csmi Package contains: - custom fields for Contact, custom action for Contact, compact layout for Contact - custom object Interview, includes custom action, compact layout, custom List View for My Interviews – change this List View to match your username Org setup: - remove fields and related lists that aren’t needed on Account and Contact, they clutter the story - create data for Account, Contact, and Interview - create a 2nd user (your boss) Slide Talk Track: This app is for Campus Recruiting. It can be used by any company or organization looking to recruit students for jobs, internships, or volunteer work. It was inspired by a custom mobile app created by Swathi Ramini at Teach for America for their campus recruiters. When recruiters visit campuses, they do not bring their laptops, but they always have their phones. Without Salesforce1 Mobile, they take handwritten notes and then enter them into the Campus Recruiting app in salesforce.com when they get back to the office. Sometimes, that is days later, if they are visiting many schools. With Salesforce1 they have their interview schedule in their hand, and can capture their notes and outcomes with a few taps. Let’s take a look…[switch to demo on your phone/tablet] Demo Script: For example, I need to go to Drew University today, so I can search for Drew in the global search to access the Drew account record. From here I can tap on the map icon and that will open the map application on my phone, in this case it is Google Maps. I love this because when I click on addresses from most websites it opens google maps in the browser, which is not as user-friendly on the phone. (This should be done either using your device. You should check out reflector, air display or if you have a direct connection from the device to the projector.) Show the chatter Feed. Show the left hand nav. Search for an account. Tap the Map icon on the account. Close the map and reopen Salesforce1. Once I get to Drew, I check my Interview schedule by swiping to the Left Nav and tapping Interviews and selecting My Interviews, a custom List View I created in the browser – the Salesforce1 Mobile App is just reading that same metadata to display the lists. I see I have an interview with Sarah Scribble at 11:30. I can see this, and the location, right at the top of this detail view. This top section is customizable, and you should include the 4 fields that mobile users will need to see most when on the road. Back to left nav – tap Interviews, My Interviews Tap a specific interview, show detail view I am at the room on time, but Sarah is not there. I swipe to see more information about Sarah as I wait – I do this via an Expanded Lookup element that was added to the Page Layout as a Mobile Card. We’ll see how to do this in a minute. I can see she’s a Junior majoring in Math. That might be handy because not a lot of people like to teach Math. Swipe to show related info, show Expanded Lookup mobile card for contact info. Now I’m getting impatient, so I click into Sarah’s contact record. Here I can quickly call her to see where she is. I do that (not really, but note that the Log a Call screen displays automatically when you dial from the Contact record, saving the user a couple of clicks and gently reminding them to log all calls). She’s on her way, so I have some time. I use that time to learn more about her by swiping to the right pane of the Student details and check out her Twitter feed to see what she’s been saying [note: use my twitter feed, @rockchick322004, or yours if you prefer]. Tap a specific contact, show detail view. Click phone icon (in the top section). Don’t call. Close Log a Call screen. Swipe to related info, show Twitter feed. Sarah arrives and we have a good interview. I quickly schedule a follow-up interview for her with my manager, Reid, for later in the day. I do that with a Publisher Action on the Contact record which lets me create a child record. Behind the scenes the Interview Status is set to Scheduled, and now it will appear in Reid’s Interview list. Click the plus button Show the custom quick action, New Interview. Create a new interview, making your 2nd user the Interviewee. Finally, I need to record my notes while they’re fresh and indicate whether there is potential for hiring her. I do that by navigating back to the Interview record, which is here in the Related List, just like it would be in the Desktop app (note that you can see the new Interview here as well). From here I can tap the Interview and then tap the plus button on the lower right and tap on the Log Interview quick action. This is a custom Publisher Action, created with just point & click. I’ll show how to do that in a second… Sarah was pretty awesome and I think she’d be a great Math teach at Teach for America, so I enter that and tap Submit. What I’ve just done is updated the Interview record with my notes and outcome, and also, behind the scenes, the Interview Status field was updated to Complete. Setting values automatically, using the new Predefined Values feature for Publisher Actions, is a great way to save your users time when they are on their mobile device. Still on the Contact detail. the plus button Swipe to related info. Tap your Interview record. Click the plus button Show the custom quick action, Log Interview. Enter the interview info, submit. That’s it! In this scenario, I would go on to my next interview, and at the end of the day, instead of having to transcribe all of my handwritten notes into my laptop in the office, or my hotel, I can spend time socializing with my friends or watching movies in my hotel. [switch to desktop browser] Have Setup open to the Schema Builder, showing only Account, Contact, and Interview. Now, let’s take a look behind the scenes to see how I created this custom Campus Recruiting app without any code. The data model schema for the Campus Recruiting app is simple. It leverages standard Accounts and Contacts, and a custom object for Interviews that has a Master-Detail relationship with Contact. It is because of that relationship that I can use point & click to create the “New Interview” Publisher Action on the Contact object. I can do this for both Master-Detail and Lookup relationships. I won’t demo everything I did to set this up, because most of it you are already familiar with – it is the same Setup work you do in the desktop browser app. However, I would like to walk through creating a Publisher Action, since that is something you will be doing a lot. Let’s add a new Publisher Action on the Contact that will let the interviewer quickly update the Education Information for the Student they are interviewing. Close Schema Builder In Setup’s QuickFind, enter “Contact”. Click Buttons, Links & Actions under the Contact node. Click New Action. Show the Action Types and Target Objects. Create an Action of type “Update a Record”, label “Update Education”. Action layout should contain only Name, Grade, and Major. If time, show the Predefined Values, even though there isn’t a good example for this use case. Important to know how powerful these are - you can select a specific Picklist value, or use Formulas to set any of the field types Formulas support as a return type (Text, Number, Checkbox, etc.). Nav to Contacts – Page Layouts and add the Update Education action to the Publisher. Don’t bother going back to the phone to demo this, you can just show it in the Contact detail page Publisher. Makes the point that they are the same.
• #11: Let’s review the other parts of the salesforce1 app that we interacted with. You are going to see 5 different apps today, and I don’t expect you to remember every click. You can dig into these features in Setup and the documentation when you get started building your own app. First is List Views. Main point here is that they are the same as the ones your user has access to in the desktop application, including custom List Views they add.
• #12: Next is the Expanded Lookup. In the Page Layout Editor, there is a new category called Expanded Lookups, and you drag the one you want into the Mobile Card section. It will only display in Salesf orce1 Mobile, not on the Desktop app. The fields for the Expanded Lookup are defined by the Primary Compact Layout definition for the object in the lookup. So, in our case that was the Contact object. This is important because the Compact Layout also controls the fields at the top of the detail page in Salesforce1 Mobile, and you can only have 4 fields, so choose carefully.
• #13: One great trick is the built-in map integration for Account & Contact records. Note this is ONLY on Accounts and Contacts, not on custom objects, but it is pretty cool.
• #14: This last feature is the secret sauce of Salesforce1 Mobile success in your company. The thing is, like any sauce, you want to use it wisely. Not enough quick actions, Salesforce1 feels cumbersome, too many, users get overwhelmed. This is the area you want to really focus on when you are gathering requirements from your users – what are the 3-4 things they are ALWAYS doing on the road. Define those as Publisher Actions, setting Predefined Values whenever possible to save even more time, and you will be a hero.
• #16: A couple of things that you should do to make your Visualforce pages work well in the salesforce1 app. Always use the doctype attribute on your page tag. This provides access to the most current features of HTML from your javascript code. There is a check box on the metadata detail page for your Visualforce pages that needs to be checked. If for some reason your page is not showing, double check that you have made it available for salesforce mobile apps. You need to style your pages appropriately for the device you are targeting. Responsive design CSS and JS are great ways to target multiple devices with one code base.