How Adobe XD Became the Standard for Prototyping at McCann
Image Source: McCann.
by Matt Sanders
posted on 03-19-2020
Agency life can be exhilarating, fast-paced, and very satisfying. As a lead digital designer, I get to bring new ideas and experiences to life and watch them play out in the world around me. I’m also fortunate to work for one of the largest networks of advertising agencies in the world, McCann Worldgroup, which produces powerful campaigns for iconic brands.
I’m part of the McCann Central team, the largest integrated marketing communications agency in the UK. As we focus on creating memorable, end-to-end digital experiences through a combination of websites, mobile apps, email campaigns, and more for our clients, one of the most important steps in our creative process is prototyping.
As IDEO founders Tom and David Kelley famously said, “If a picture is worth a thousand words, a prototype is worth a thousand meetings.”
That insight is spot-on. A good, working prototype has a magic all its own in the design world. The power to bring a vision to life. The power to persuade clients. The power to align the team so it can execute on an idea, fast.
We’re looking to hone that power here at McCann by standardizing on a single prototyping tool—Adobe XD. For us, it’s a gradual process, but the endpoint is clear. We want to unify the team to deliver high-impact digital experiences at scale and with speed.
Why we standardized on XD
There are several different teams across McCann Central and, though we’ve become more blended over the past few years, we still have a lot of overlapping toolsets—everything from Adobe InDesign and Adobe Photoshop to Sketch and InVision. On any given project, a designer might have to work with up to eight different file types.
That tool fragmentation really slows us down. At some point, we decided we couldn’t keep working that way and needed a standard tool so we could introduce best practices. With three agencies and 550 people making up McCann Central, we knew we needed a solution that would work for everyone across the board, on a large scale.
I started using XD in its infancy almost two years ago, as a trial. At the time, we were trying to transition from Photoshop to Sketch for big user experience projects, exporting them to InVision for prototyping and we also experimented with Proto.io for prototyping and consumer testing. The setup wasn’t ideal because it involved a lot of exporting and importing and lost productivity. If we made one minor change, we had to repeat the whole process.
Throughout this transition, I kept watching XD. It was a good fit for our Adobe Creative Cloud environment and, as its features evolved, it became the obvious solution for prototyping. For one thing, it didn’t force us to find workarounds. XD is specifically designed for digital journeys and prototyping, with a very focused, simplified interface—which keeps designs from becoming overcomplicated.
And it’s important to keep designs simple. When our designers put together image-heavy emails in other tools, creating enormous artboards in the process, we could end up with well over a gigabyte of data in a single file. A file of that size is unwieldy and glitchy.
We were curious to see the difference between what would happen with XD, so we dropped that same file into XD. It was a fraction of the size. We can now create designs with loads of artboards—and no lagging, eliminating a big source of delays and frustration for designers.
More show, less tell with XD
XD has also reinvigorated how we present ideas. The last thing most clients want to see is another PowerPoint presentation. When we pitch an idea, we need to make it tangible, vivid, and interactive, and XD gives us a powerful tool to help clients see what’s possible.
More and more, we’re mocking up digital experiences in XD and simply passing the link to our clients so they can truly understand how an experience will work and feel. They can also easily share the link with board members, internal designers and developers, and even other third-party agencies responsible for executing on our ideas.
For example, we reskinned a British car company’s website for desktop and mobile as the company prepared to launch a new car model. In my presentation, I included a QR code and asked everyone to pick up their phones, scan the link, and scroll through the demo as I talked them through it on-screen. They loved it because they had instant access to a working prototype in XD.
We’re even starting to deliver more dynamic, immersive pitches in XD, with outstanding results. Even better, the tool helps us conquer the challenges of time and distance. In one case, the pitch team was with the client in Geneva, and designers in London updated the XD file based on client feedback in near-real time. The client was thrilled to see the changes appear during the meeting.
It’s hard to resist a tool this intuitive
Anytime you ask people to change their daily routines, pushback is natural. But we’re not really seeing resistance to XD; likely because most designers are well versed in Creative Cloud so it’s easy for them to pick up XD and start creating layouts in a matter of hours. The interface is familiar and intuitive, so learning is fast. Ease of use is hugely important if we expect people to use a new tool, and Adobe’s built-in training and how-to videos speed learning new skills.
We’re quite far down the road with XD when it comes to client presentations and mocking up pure-play digital work such as websites. To keep moving forward, we now require that people use XD as a delivery vehicle during the briefing process. That move was a game changer for us and will accelerate the integration of XD into campaigns and production work.
As far as agencies go, it doesn’t get much bigger and better than McCann. It’s always exciting to see our work play out on such a grand scale. With XD as our go-to prototyping tool, our teams can bring ideas to life at scale and with speed—building more of the iconic campaigns we’re famous for.
Topics: Design, Creativity, Customer Stories
Products: Photoshop, Creative Cloud, XD