Episode Transcript

(Editor’s note: The new, responsive weil.com launched in July 2014, shortly after this interview was recorded.)

Karen:

This is a Responsive Web Design Podcast, where we interview the people who make responsive design happen. I’m your host, Karen McGrane.

Ethan:

And I’m your other host, Ethan Marcotte.


Karen:

And this week we’re really excited to speak with Chris Collette. Chris, why don’t you introduce yourself and tell us a little bit about what you’ve been working on.


Chris:

Sure. Thanks Ethan and Karen. I’m pleased to be here to talk about responsive design with you today. I’m a digital strategist working at the intersection of business strategy, user experience design, and content strategy. Most of my clients are in the business-to-business arena if you will, primarily in the professional services and financial services sector, with some dabblings in non-profit as well. Most recently I was working with Weil, Gotshal & Manges, which is a global international law firm with offices around the world. I really worked with them to bring their digital strategy and program into the 21st century. One of the most exciting things that we were able to do was to have a mobile first, responsive design solution which will be probably one of the first mobile first, responsive design solutions in the category, so very exciting to see that come to life.

Ethan:

That sounds pretty fantastic Chris. Karen, do you want to kick things off? Do you want to take the first question?


Karen:

Sure. But before I do that, let me first say a few words about our sponsor, Campaign Monitor. I’m really thrilled that Campaign Monitor is involved with this podcast because I know how difficult it is to put out an email newsletter. If you’re working on an email newsletter, you need the resources and support and insight that Campaign Monitor has built up over the last decade to teach you how to send really great emails. One of the things that they’ve done lately that I think makes it easier for you to create a great email campaign is they have this new builder, that they call Canvas. So Canvas is this fantastic tool that has drag-and-drop functionality that allows you to create an email much like using any editor that you might use on your desktop. And what’s great about it is that this editor is based on styles rather than templates. And if you know anything about the kind of stuff I talk about, the idea that having styles means that the content will drive the design, and not the other way around. So rather than having your stuff constrained into these boxes in your template, you can let the content be whatever it needs to be, and Canvas will make it look great. So you should check them out at campaignmonitor.com.

So Chris, let’s start off by talking a little bit about the overall business strategy that went into this mobile first, responsive redesign. How did you convince your stakeholders that this was the right thing to do?


Rarely in an organization are you given a blank canvas on which to design something brand new, so that was a nice, meaty challenge but also something that was very exciting.


Chris:

Sure. That’s a great question. I think that’s one of the first steps and the biggest hurdles to overcome. We were very lucky in this redesign in that we had a very small group of key stakeholders who just knew that the current digital property—I hate even to use website because that just seems so antiquated to me—hadn’t been touched in at least eight years and probably ten years. Across the board experientially, technically, content, user experience, we knew we had to throw the thing out and just start from scratch and work from the ground up. We were very lucky in assembling a great project team who had been working in this arena for a number of years and we knew that we had to go with something that was not just a standard “website.”

We started talking about adaptive and responsive technologies and approaches, and mobile first. Most of the stakeholders—and this isn’t by any means meant to be something to discredit them—said “oh yeah, that sounds good.” They just didn’t live in this world and so they said, “sounds good, just make it happen.” So we were thrilled we were able to do that. We were able to go through and create a truly breakthrough experience, so that was a key thing and the project team was absolutely thrilled that we could do this. Rarely in an organization are you given a blank canvas on which to design something brand new, so that was a nice, meaty challenge but also something that was very exciting.


Knowing also that content really is the bedrock of this experience we wanted to make sure that we had something that could serve up that content in all the various ways, across all the touch points and devices, without compromising. So we didn’t want to make any assumptions about who was looking at what.

Ethan:

Yeah, that sounds great. I guess one question that I tend to get working with clients and organizations is these two kind of problematic terms, “mobile” and “desktop.” When you guys were thinking about requirements and starting the planning process for this project, how did you think about the needs of “mobile users” and “desktop users”? (You probably can’t see me but I’m putting quotes around them.) Did they need access to the same information? Were their needs different? How did that frame things?


Chris:

Absolutely. We really took a very agnostic approach and sort of looked at this from a couple different dimensions. Really from a business strategy and audience strategy, the two main audience groups were current and existing clients, and law firm recruits. You can imagine that’s a pretty wide range of ages and experience and digital engagement, but we knew that we had to design a solution that could meet the needs of all of them. Given also an organizational perspective, the team internally that supports all the digital of the whole firm—Programs—is quite small, so we knew from a planning and strategy perspective we didn’t want to have a proliferation of various sites and other properties that we had to update. So going to a standalone mobile site that was either a derivative of the “test off” site really wasn’t the solution. Early on when we started with the new content management system—Sitecore is the solution we went with—we knew early on that that was going to be able to support that single destination. Knowing also that content really is the bedrock of this experience we wanted to make sure that we had something that could serve up that content in all the various ways, across all the touchpoints and devices, without compromising. So we didn’t want to make any assumptions about who was looking at what.

One of the core things in a law firm website is the thought leadership content. That could appeal to current clients, it could appeal to prospective clients, but also it could be a law recruit who might be working in a particular area—say private equity or anti-trust litigation. So we didn’t want to segment that content off and wall it off. So that really helped us think of a “one universe” kind of solution for that and then allowing that content to be served up appropriately and in the appropriate ways to the various users.


Ethan:

That’s great. Actually as a quick follow up, you mentioned the word universe, the scope of this thing sounds pretty impressive. If I could ask, how do you guys plan on rolling this out when it goes live?


Chris:

It will be a complete cut over to the new experience, so this will not be done piecemeal or section-by-section. Everyone’s been waiting for this for so long—and no one more than I—to get this out the door. So the way to do this, we had to focus on the core experience and make sure that was put out there. We were lucky also, just as maybe a little footnote to that, in that the firm didn’t have a lot of other digital properties in its ecosystem. There were no apps, thank heavens, to have to tamp down. There’s probably five to six blogs of various incarnations that the firm supports, most of which actually do follow a very rigorous publication schedule, so they are active and they do have traction in that. We just made a strategic decision, we had to cut the frame somewhere and said those could be on a future release. So they’ll still be there, they just won’t be in the design system when we roll out, but that really is one of the first pieces that will be on the next cycle for integration both experientially and technically into the Sitecore system.


Ethan:

That sounds great.

We have some pretty sophisticated clients. So it was important as a brand promise that the experience would be as cutting edge and innovative as the legal services we provide.

Karen:

One of the questions that I seem to get a lot is responsive design, that’s great for publishers, I mean that’s great if you have a blog. But do we really need to be thinking mobile first if we’re a B2B company? Aren’t most of our users going to be at their desktop computers? Why should we bother focusing on mobile or redesigning around all of these different screen sizes when our primary audience is professionals? How did you deal with those questions, or how did you present the benefits of the mobile first, responsive design approach in a B2B framework?


Chris:

You use a couple of key words that are very near and dear to my heart, which is publishing. Brands are publishers as we know. I think even Karen, you were the one who coined that phrase. That’s very true in the law firm context as well. The thought leadership content, some of the alerts, the newsletters, the analysis, it’s one of the things that is a brand differentiator. Well, if you’re a publisher, you have to be able to get that content out. Just anecdotally, lawyers are people too. Just walking around the firm, being in partners’ offices and various things, they all have an iPad on their desk. They all have iPhones. We’re seeing more and more integration of the firm supporting those kinds of things. I don’t have any hard and fast rules about that, but they’re using those devices professionally but also personally. So why would we make assumptions that everyone would be bound to their desk?

Also we’re looking forward to where the evolution of law and the way it deals with technology—especially from a business development and marketing standpoint, it was critical to be on the forefront. Another differentiating factor is the client roster, not unlike many top law firms, we have some pretty sophisticated clients in the technology sector but also in other sectors as well. So it was important as a brand promise that the experience would be as cutting edge and innovative as the legal services we provide. So that was the thing we used as the brand tenet, if you will, to help us get over get over “responsive” and “mobile” and looking at that. I hope that answered the question.


Karen:

No, that was fantastic, I wish you would say that to all my clients.

Ethan:

I know, seriously, I’m gonna turn that into a tattoo or something. That’s I guess one of the questions I had. You mentioned these devices actually showing up in the workplace. I’d be interested to hear a little bit more about your design process. Have you or your team done much responsive work prior to this?

Chris:

Not to this scale, I worked with R/GA and was a creative director at R/GA for a number of years prior to this engagement, in this role. And so that was, at that time around 2010, 2011, we were just sort of dipping our toes in the water of this. Kind of wrapping our heads around what this means. So I had worked on a standalone mobile site with one of my clients in the telecommunications and technology sector, and at the time that was at the right approach where they were in their digital maturity model. They weren’t ready to start a full-fledged mobile first, responsive design for that. It was scoped well. The effort was appropriate for what the solution was. Looking back, or looking just recently, they have since gone to mobile first, full-on responsive design. So I’m very pleased that we planted the seeds there, but the site evolved into a full-fledged experience in the mobile first world.

We really put that out as a main criteria for anybody with whom we were going to work is that it had to be mobile first, responsive and adaptive.

Ethan:

Oh, that’s great, tell me a little bit more about the design process. Was that a big adaptation for you guys? How did you think about actually implementing this?

Chris:

Well, really it started at the RFP scoping. To be very, very basic, we really put that out as a main criteria for anybody with whom we were going to work is that it had to be mobile first, responsive and adaptive, in that world. I was very adamant as the lead strategist on the project that that would be the way to do it. Also with getting off of paper and no paper prototypes. Some of this stuff I knew, if we were going to sell in this solution and to get people to wrap their heads around what this meant, we really had to put it in a digital first medium. So we had the prototype there, we had to iterate in that front end framework to really show how this would work and what the interactions and limitations are, or to get people to think differently about how you put together a digital presence that takes advantage of these technologies. 


Ethan:

That’s great, that’s great.


Karen:

One of the things that comes up from many of the clients that I work with is the challenge in communicating with stakeholders that their “thing” isn’t going to “live” on one particular point on the page anymore. How—assuming that you had to have conversations with people about how thinking mobile first is different or how responsive design is different—how did you communicate that to them?


Chris:

We had to show them, and that was why we had to build this from the ground up in the digital environment. In those early days, it took a lot of convincing. It took a lot of multiple review sessions for people to see, not to fix this item in the upper right corner and—I’m gonna abuse the air quotes—of the “page.” Really the page had sort of disappeared and we were talking about a much broader canvas in a very gestural interface in the way that was built. That was big challenge because they were still trying to fix the design and the placement of the items and modules and things. But once they wrapped their head around what we were doing in this larger content placement, things would wrap in this flexible grid, it became a lot easier. Even looking at the prototype that we did—and we built it out in iterative cycles—it was still difficult for folks to see. They thought that was the website. The black and white, gray pages that they were seeing. They thought “Why aren’t our colors there?” It’s like hold on, we’re not there yet. This is a model.


Karen:

I’ve heard that in my life.


Chris:

Right. Luckily we did use very little lorem ipsum so at least they saw some real content there, but that took some convincing. It was also a big challenge for stakeholders in the workshops that we did to understand that they weren’t going to see a finished product day one when we did the first review. We broke the experience down by major experiential sections. In law firms, bios are really a critical, peak content store, if you will. We really started with trying to crack the code with that. How can this be more engaging that people can learn about the lawyers because, really, that is the product, lawyers are the product, so how can we showcase them in the best way? Working from there, and then out to practice descriptions. 

We got to the homepage somewhere midway, which I was thrilled about because, this really wasn’t top down, in thinking about the way that this worked; it was a very nonlinear kind of process. Most folks in legal are very linear, they think this and this, therefore that, and this process upended all of that. That was something that was a bigger philosophical shift for them, and everyone, and even some folks on the team, we fell back into our old fixed page metaphor. What we really tried to use language and bring people along in this new, multi-dimensional, non-fixed world.


Ethan:

Wow. That’s really great. Just out of curiosity were applications like, Photoshop or Illustrator really ever relied on from a design standpoint? 


Chris:

Not in the early interaction model.


Ethan:

Sure.


Chris:

It was a custom built framework, but it would be something like a Foundation or Twitter bootstrap, one of those similar to that. Obviously, once we got into the visual presentation layer, we went into Photoshop, but quickly evolved those into some front end HTML templates so people could start to see the interactions between things, highlighting hover states, or touch states. All of that stuff was very critical. Once we got to that stage, then folks were like, “oh, I see.” Again, a very literal kind of mindset, and there’s nothing wrong with that, I think that’s something that those of us who work in this arena, there’s a lot of convincing and selling you have to do. Once we started to marry those pieces together, then folks started to see the design rationale, and how and why this would work in such a way that it did.


Ethan:

Yeah. That’s great.


It bears noting that we didn’t probably, start rewriting any content until about nine or ten months into the process. It really took that adage of measure twice, cut once. We probably measured about ten times before we cut once.

Karen:

One of the things I think, predictably, what’s interesting to me when I talk to people about their responsive redesigns, is how does the content and the editorial process sync up with the design and development process? Can you talk a little bit about what changes you made to the content?


Chris:

I can talk a lot about the changes we’ve made to the content! We were dealing with, probably, to boil it down to the highest level, two different kinds of domains of content, if you will. There was a core, somewhat evergreen: the practice description, the bios, obviously, those do get updated. And then the legacy content, these are all the supporting articles, all those different pieces. We knew everything about the current experience was something that we knew that we just had to toss out entirely. The content itself, all that core, all the pieces that made up the experience did not really align with what the firm was doing from a strategic business perspective, which was a big disconnect there. So, we knew we had to scrap all of it, or most of it, and really re-architect how we were going to market, or how the firm was going to market with its legal services.

We spent a very large amount of time in workshops and taxonomy sessions and planning sessions to re-architect and re-taxonomize—if that’s a word—the business, to really make sure that things we were presenting, the things we were writing to and about were accurate to where the firm was placing its emphasis in the business. There were gross inaccuracies, there were false practices that were up there that weren’t really practices, or anything like that. There were other weird interconnections that didn’t really exist. So, we scrapped that all and then built up, again, from a blank slate, a new architecture for that.

Folks are wanting to go out and hire writers at the beginning of the process. It’s like, “Hold on, hold down those horses.” Let’s understand what you’re trying to do from a business strategy first before you start rewriting anything.

But, that rigor that we took was understanding, “Okay, what are the key concepts that go into each of these areas, how do they all interrelate, what can we sort of carve off that says, well this is more of a kind of capability of the lawyers there, as opposed to a practice?” So something like “trial-ready.” You know that could apply to a number of practices, so how do we sort of create that as a content experience?

All that work and all that upfront work was really helpful because then we had those templates for this and we had the modules. We had the design patterns, if you will, and were able to write and revise and really streamline the content for that experience. That’s not to say it didn’t take numerous cycles of getting people and subject matter experts and other outside writers and content creators to sort of wrap their head around that, but that really did pay off in spades when we actually got down to the authoring of the content. I’m looking at a couple opportunities and folks are wanting to go out and hire writers at the beginning of the process. It’s like, “Hold on, hold down those horses.” Let’s understand what you’re trying to do from a business strategy first before you start rewriting anything. So I think those are some very important lessons that I’ve learned and I think that was helpful for us as well.


We have to think about this from the back end, from the content management system, how is this structured, how is this componentized if you will, so that it can take advantage of that “author once, publish everywhere” kind of model. We really took a very hard and fast look at all the content in design and development in the iterative process.

Karen:

That’s fantastic, can you talk a little bit more about how the content and editorial process, what I might call content modeling, or the process that you go through to evaluate what you’re going to do with the content? How would that intersect with the prototyping that you did in the design and development process? And you know to me, I totally agree with you. There’s a whole bunch of work that happens in the content before you actually start doing the rewrite but for some organizations it’s still kind of a mystery of, “Well, what are you doing with the content if you’re not actually rewriting it?”


Chris:

Absolutely, I can. I could not and cannot separate content from the overall design experience. To me, it is a separate thing but it is so ingrained in that whole experience. Especially with responsive and mobile first sites, you have to think about it from multiple dimensions, from the consumption side of things—like how are people actually working with and consuming this content. From the creation, from the editorial process, how can we get people to write less but still get the point across? We have to think about this from the back end, from the content management system, how is this structured, how is this componentized if you will, so that it can take advantage of that “author once, publish everywhere” kind of model.

We really took a very hard and fast look at all the content in design and development in the iterative process. So using things like the audits and stuff to pull representative content into that. So again, we were using actual content in our prototypes. You know, picking a couple practice areas to rewrite, picking a couple of bios to sort of model into, massage if you will. Taking some of the legacy content and understanding you know how that needs to be, the hierarchy of things and how they were classified in the whole taxonomy. It was really critical so we were thinking about this from all these different dimensions.

Then who was providing the content, how is this being authored? A lot of the core thought leadership content comes from the lawyers themselves, and so we really wanted to make sure that we weren’t altering that but we were giving it a much better setting, if you will. All the other core content, the bios, the practice pieces, the about-the-firm kind of thing. That’s were we got the opportunity to go in a much more radical direction and really strip it down and get it to be much more editorially focused. And really on message and on brand with what the firm is trying to do. I hope, did that answer the question or at least get close to it?


Karen:

Yeah, I think that’s great.


Ethan:

Yeah, definitely, I guess one thing I’d be interested to hear about, Chris, would be how you actually manage the review process. How would you actually share the prototype and share the design system with the rest of the organization? And how did you manage that side of things?


Chris:

We kept the early design review process fairly tight, just to a key number of stakeholders. We were really trying to avoid the “design by committee” which could have happened. We did share it out in different pieces and different parts of the design. We sort of keep these key leadership in the firm, so both the executive director, sort of the executive partner, the managing partner of the whole firm, the key department heads, and really showing them how this would work and what the key features were. Lawyers are very busy, they’re billing at great, amazing hourly rates so with those kind of presentations we had to be very tight about what we showed and what we didn’t show. They were all very successful. Everyone was and is so disgusted with the current site that almost anything, just a fixed width home page would have been, “Oh my gosh, this is the greatest thing.”

So we did show some of that interactivity, some of that mobile first and some of the pieces, the gestural interface. There was really kind of a wow factor, this is really cool. One of the biggest things in the strategy that went through, the lawyers themselves can’t find the content they’re looking for. It was like: I know I wrote that thing, where is it? And so illustrating some of those use cases with them and talking them through that really helped them to get that buy in, and so that was something that we were very, very lucky to have.

Subsequently, it’s been rolled out once we’ve gotten to the content, especially with the practice areas of the site, and the thing that speaks to the more of the core of the business and what they do, then showing them how it works has been distributed throughout the firm. So very excited to see that it’s very successful and then sharing it with folks globally, met with great applause if you will, just that it’s so bold and just such a departure from certainly the current presence but really anything out there in the category. So that’s really exciting and people are starting to get very fired up if you will, about this going live.


Karen:

How did you manage the feedback process? And I will say, I have a great many years of experience in printing out or making PDFs of wireframes and distributing those and getting written feedback on them. I would imagine that process would be totally different for your experience.


Chris:

It was. I’ll speak to that in two parts. With the up front framework, the prototype, the interactive concept if you will, that we really did keep in a digital format. I’ll give a shout out to our excellent, outstanding, stellar partners. We worked with Happy Cog on this, on this front end development, and could not be more thrilled with their absolute brilliant skill and the craftsmanship, but also their patience going through multiple design reviews to make sure that people got it, just the gentle nature that they approached this and that they were really working collaboratively both with the core team but also with the core stakeholders, taking feedback, doing multiple iterations of that framework was something that was very helpful and I think really helped us sell that in within the core team and the core group of stakeholders.

You mentioned—I apologize if I chuckled in the middle of your question—about printing out PDFs. That still was a part of this, I’m sorry to say, primarily once we got down to the actual writing of the content. We did create Word templates for folks. We knew that the organization wasn’t quite there to send them off to something like a Gather Content, to start authoring things in some sort of database for tracking, but that was okay. The core team took on some of that work and those tasks to make sure. One of our phrases on the team was, “they don’t need to know how the sausage was made, we’ll be the sausage makers” and so we’ll let them do that. That I think was a way to get people oriented.

The thing I didn’t like is it still has a very fixed page metaphor knowing that move this module over here to line up in a column and it’s like well, once this goes down to a different form factor there aren’t going to be two columns. It’s going to be one column anyhow. But you have to sort of navigate and massage those kinds of things so in that content authoring piece, especially because we were working with a distributed team of other subject matter experts, not just writers and other content developers, that was an important thing for us to use as a tool. But once we took it in and we’re starting to work with the front end templates and working on the Sitecore platform, the core team, the core development team, we would then be working purely in a digital environment.


Karen:

Great.

Ethan:

I think I’ve got just one last question, so have you guys had any conversations about whether or not this responsive design has been successful? What are your metrics that you’re judging this against?


Chris:

Well, kind of simple, it’s better than what we had before. 


Ethan:

Fair, fair.


One of the platform pieces that I was really adamant about is we have to stop creating PDFs. No more PDFs. Get the content into a digital first format, which you think this should be sort of a no-brainer.

Chris:

I know. I think that this will be something that will be in the early stages once this is rolled out and the core team will be looking at audience engagement, especially in the way that the firm distributes its outbound communications to clients and prospectives and things. One of the platform pieces that I was really adamant about is we have to stop creating PDFs. No more PDFs. Get the content into a digital first format, which you think this should be sort of a no-brainer but no. So client alerts, newsletters, they should all be directed back to a digital format because then we can track it. It’s not this spray and pray, well, I think somebody opened it, I’m not sure if they read it, you know? So we are trying to come up with an analytical model where if they receive something we can actually track them and their engagement with the content, where they went, did they look at the author, the bio of that? Those are the kind of things I’m sure they will be measuring against.

The experience hasn’t been released yet, so the traditional metrics. There will be an uptick with visitors, new visitors, repeat visitors. But really that more sophisticated model, being able to track people in their movements through the experience, I think will be something that will help. For law firms, we’re talking about something making an impact, we’re talking about in the tens to hundreds, not necessarily the thousands to millions. So a piece of content, a piece of strategic thought leadership content, if it reaches the right twenty-five to fifty people, the general counsel of a major corporation, and it encourages them to engage a little bit more with the firm, then that’s a success. So that’s a very important point to think about. We’re not talking about hundreds of thousands to millions of users, we’re talking about a very niche audience, but one that’s very important. So anything that we can do in that micro focus on those will be something that’s very important for success to measure.


Ethan:

That sounds great.


Karen:

Chris, this has been fantastic.


Chris:

Well thank you.

Karen:

It is always a pleasure to get to talk to you and even more of a pleasure to hear all of this great stuff that you’ve been doing. It sounds like a really great case study of how focusing on a mobile first strategy really encompasses so much more about your business than just “how do we make this work on smartphones?”


Chris:

Yes, well thank you. I am just absolutely thrilled at the invitation to be able to speak about this. It’s something that I’m extremely passionate about and really looking to be a champion in somewhat more traditional kinds of arenas. I’m just thrilled that people are starting to take notice of these and we’re actually able to do some very cutting edge work and to really bring experiences into the 21st century. 


Ethan:

Yeah, well I for one can’t wait to see it. So, Chris, thanks so much for your time.

Chris:

You’re welcome, thank you Ethan, thank you Karen.

Karen:

Great, thanks a lot. Thanks to everyone for listening to this episode of a responsive web design podcast.

Ethan:

If your company wants to go responsive but you need help getting started, we offer a two-day onsite workshop to help you make it happen. We’re also planning to offer these workshops to the public, so please go to responsivewebdesign.com and let us know that you’re interested.

Karen:

If you want even more from us, you can sign up for our newsletter, subscribe to this podcast, and read full transcripts of every podcast episode at responsivewebdesign.com.

Ethan:

Thanks again to our sponsor, Campaign Monitor. Be sure to visit campaignmonitor.com and check out their email editor, Canvas. Thanks for listening, and we’ll be back next week.