Share and Enjoy !

Find this Podcast “SharePoint Branding – Making SharePoint Not Look Like SharePoint” on the ThreeWill Soundcloud, Stitcher, and iTunes.


Transcript

Danny:                    Hello, this is Danny Ryan and welcome to the ThreeWill Podcast. Today, I’ve got Tim Coalson, Senior Consultant, here with me. Thanks for joining me, Tim.

Tim:                          You’re welcome.

Danny:                    I have dragged him away. I haven’t literally dragged, but I pulled him out of his project because he is … He’s been very heads down recently. Been working really hard. Appreciate that.

Tim:                          Yeah. Got a pretty fun project going on with … Doing a lot of work that interests me. I love doing UI work. That instant gratification of being able to see pretty immediately the work you’ve done. Of course, customers that’s the thing they see. They don’t necessarily appreciate some great C# code on the backend. Maybe they appreciate the response time.

Danny:                    Yes.

Tim:                          Or how efficient it runs or the response returning back data quickly, but with UI, obviously, people can see it and they’ll generally have an option one way the other. Either they’ll like it or they’ll not, so you get pretty real-time feedback. That’s a lot of fun. That’s been a big part of my current projects. It’s definitely much easier to work those later hours, longer hours when …

Danny:                    You love what you’re doing.

Tim:                          … you love what you’re doing.

Danny:                    That’s great. Yeah, it’s been really important topic for us, because … It’s even on a phone call today where one of the key things that the prospect was talking to us about was, “Can you guys help it not look like SharePoint?” This just comes up time and time again. I think they just want to improve a branding, improved user experience, and really want a site that they’re proud to send people to. Nothing that … SharePoint is SharePoint. It sort of does what it does. It has a certain look to it, but I think a lot of people … It’s really important for them to brand it and make it their own.

Tim:                          Lately a lot of our customers really have wanted … focused on a better looking UI so we’ve created some extranet sites for some state agencies that a lot of the counties will log into. They really wanted a nicely branded interface. We did that on the SharePoint platform. My current project, which is actually a tax and accounting support site, where users log in to get product support for some of their cloud-based tools or tools that they install locally. We’re doing a lot of, essentially, rebranding it. We’re leaving a lot of the backend functionality the same, but basically giving it a face lift to make it look nicer.

We’re adding some new features and, of course, part of that involves a lot of use of some of the new jQuery plug-ins. Libraries that we can use to give some nice looking mobile pop-ups. Some nice looking sliders where you can have announcements on the front that either automatically rotate or users can click through. Things like that. Tabs. A leveraging bootstrap. We give a responsive experience. Based on the size of the browser, we can hide certain elements when they decrease their screen size or show more things or change it around, the interface, based on the screen size.

Lot of new capabilities out there to really provide a nice user experience. I think a lot of customers appreciate that when they go to a site that’s more engaging. I think they tend to come back more so that’s really what our customer’s looking for is an easier-to-use site. A lot of these new UI paradigms make the navigation a little bit easier and also just more engaging, more fun to use.

Danny:                    You typically work with … We have a couple of graphic designers that join us to help us out. What’s that interaction like? Are you working … During a project, are you working a lot upfront and then once you get to a certain place, it’s more of your taking over from there? Or what … Describe what your interactions are with …

Tim:                          Usually upfront we’ll have some initial meetings with our designer and the customer to really try to understand what is their goal for this site. What kind of messaging they’re trying to create. What kind of experience are they trying to create for their customers? Some companies actually have branding guidelines so we’ll get a copy of those. Some will have those available on a website. We’ll take a look at those guidelines and then integrate what their guidelines with what the customer wants in terms of the user experience.

We’ll usually come back with some screen mocks, some ideas of what we could implement. Give them some options. They’ll usually say, “I like this. I don’t like this.” Then we’ll go back. We’ll go through two or three rounds of some screen mocks to determine what the user likes.

At that point, our designer … Our designer is actually a very talented guy. He will go off and create HTML and CSS and actually deliver the HTML and CSS to me. Then I implement that into the actual design. A lot of times what the designer might create is static HTML will be drive dynamically based upon data that gets returned so what I’ll do it take that and then integrate it into our code base.

Danny:                    Very nice. I know also on projects we have QA testers and how does that … What’s your interaction with them typically on a project? I guess in this case it’s kind of more towards the end of the project where they’re going out and testing the UI. What’s a typical interaction with them?

Tim:                          Usually we try to get them involved as upfront as possible, that way they understand the spirit of the site. What’s trying to be accomplished. They’ll go through the functionality end and then in some cases they’ll find where a button’s too big here or something’s not in the correct alignment so they’ll normally go through their normal QA cycles on the branding and point out anything they see. We’ll fix it. We’ll go back through some subsequent iterations that way they can retest things that we fix. Usually after two or three iterations, then we got it down to little or no defects or things that they find wrong before then it goes to a customer.

Danny:                    Nice. I guess … I know this morning we got together for our monthly company meeting. Pete said, “JavaScript, JavaScript, JavaScript.” It seemed like that’s the direction that we’re moving for implementing a lot of these solutions. It sounds like you’re using a lot of the frameworks to go do a lot of this stuff now.

Tim:                          Yeah, we’re doing a lot client-side asynchronous calls so that way the user … The page will refresh quickly and then if there are pieces of data that take longer to retrieve, those pieces of data will come in as they are retrieved and display in the screen. That way the user gets a better, quick experience. There’s just so much out there now that’s available to really give a rich-looking UI. We’ve not only implemented these outside of SharePoint, but even within SharePoint, we leverage jQuery a lot. Not only just for purely display things, but for example, SharePoint natively doesn’t support field-level security so oftentimes in different lists or document libraries or even document sets, we’ll implement jQuery behind the scenes. We’ll make an asynchronous call to determine what role the current user is in and then based upon that role we can hide fields or display fields. Even change the behavior of the form. Not only from a security standpoint, but also sometimes users want some of the more common metaphors for search. We might take a text box and implement a type ahead search that behind the scenes is going back against another SharePoint list. Instead of using a default SharePoint drop down, we might provide a text box that has type ahead that behind the scenes is going back.

Danny:                    That’s nice.

Tim:                          As the user types, it’ll bring back all the entries that match what they’re typing. There’s a lot you can do with jQuery as you integrate it in SharePoint or even outside of SharePoint.

Danny:                    Very nice, very nice. It’s probably difficult to stay on top of … Some of these … Seems like there’s a framework of the weak coming all the time. I imagine with updated versions, everything just seems like you’re just trying to stay on top of what frameworks are being put out there and which are the right ones to use for whatever project you’re on.

Tim:                          Yeah. Luckily at ThreeWill, we do have a person, Pete, that’s focused on keeping up with what are the new technologies. We really try to narrow that down so that we’re not all going after everything, but we really focus in on what we think are the emerging industry standards. Things like AngularJS, jQuery. Things like that. TypeScript. We’re really trying to not get too caught up in. There is so much going on that you can get overwhelmed and really know a little bit about a lot of things instead of being deeper in a few things. We really try to be deeper in fewer technologies so it really peaks carrying that burden of researching, trying to determine what are the emerging technologies that we should focus on. That does help, but even there, there’s a lot to learn. That’s what makes it fun, you know? Just continuing to learn new things that really provide some nice capability.

Danny:                    I know we’re starting to do … Actually being doing a lot of work with Office365. Have you been on any projects where you’re starting to figure out, how does the UI and what are the changes as you’re looking to … Instead of doing on-prem SharePoint, you’re doing something in Office365. How does that change what you do?

Tim:                          I have done a little bit of work. Not a lot there. Certainly with a platform that’s constantly changing, they pretty much tell you that you can’t rely on certain things to be there from one day to the next, because they are constantly evolving the functionality in Office365. Hanging your coat off of certain attributes in a screen, you’re not really guaranteed to have that from one day to the next. They do have patterns and practices for doing branding in Office365, but generally, and more in the cloud, they tend to not really recommend doing a lot of branding-type stuff as much as stuff you can do in an on-premise environment where you can control that.

Danny:                    Very nice. Anything else just to wrap this up with maybe tips or anything you’ve learned recently or anything you want to share with folks about branding or UX in general with SharePoint?

Tim:                          I just think there’s a lot of things you can do with jQuery with some pretty minimal custom code. A lot of what I’ve done for customers to enhance the forms has really been all client-side JavaScript, which is very easy to include in a page, particularly like in an on-premise, even though we have even done some of that in Office365. If you don’t like the SharePoint experience, you can certainly enhance it using jQuery libraries. Check with this one and we can tell you what’s possible.

Danny:                    Absolutely. Thank you for taking the time off of your project to come and talk with me about this. I know this is an important topic and I appreciate you leading up within the group and focusing in on more of the UI. You’re absolutely right with customers. In the end, they just have the experience of working with the app and how important that is. Thanks for doing a great job with that. I’ll let you get back to your projects.

Thanks everybody for listening and have a great day. Take care. Bye-bye!

Share and Enjoy !

Related Content: