How Visa Spends Less Time Spec’ing & More Time Making

Visa distinguishes itself from other technology companies by being “everywhere you want to be.” Whenever its customers need to make a purchase, regardless of where they are in the world or with what payment form factor they know they can rely on Visa to successfully facilitate the transaction.

Sympli takes the same approach with its users. We’ve developed tools to help designers and developers work together, but we realize each project has its own distinct set of needs and everyone has their own preferred platforms. That’s why we’re committed to working in platforms where you work and improving our products to make it easier for you to improve yours.

We sat down with Jonathan Yap, Product Designer at Visa Design Studio, to find out how they use Sympli and what their workflow looks like. By simplifying workflow processes, Sympli helps Visa’s design team spend less time stressing about logistics and more time thinking creatively.

Thanks Jonathan and Visa Design Studio team!

Name: Jonathan Yap
Title Product Designer
Company: Visa

“The Brandbooks feature is really valuable in bringing consistency to design implementation. Once I see my design in Sympli I can spot inconsistencies that would usually be picked up by our developers.”

Q. How long have you been using Sympli?

A. I’ve been using it for four months now on pilot, but soon heard great feedback from across multiple teams. We are now in the process of adopting it across the entire design team.

Q. What do you like about it?

A. It’s amazing how the specs tools integrate right into IDE and Sketch. You guys came out on top of other tools thanks to nifty little layering tools and how easy it is to adjust font styles and coloring highlights on our designs. We actually not only use Sympli for specs, but for collaboration and discussion as well. Our other designers have also gave some fantastic feedback on how easy it is to integrate right into our workflow in Sketch.

“[Sympli] provides a single portal to retrieve the most accurate, up-to-date version of the design, which minimizes the possibility of inconsistencies.”

Q. Why do you use it?

A. The way Sympli makes collaborating with engineers and handling assets is such a breeze, it’s hard to not use it. Now I don’t have to worry about whether my designs have the right colors or asset size. The Brandbooks feature is really valuable in bringing consistency to design implementation. Once I see my design in Sympli I can spot inconsistencies that would usually be picked up by our developers.

I also like that it carries the “burden” of asset management. Sympli controls naming conventions and provides asset generation. When I complete a component whether it includes assets or not, I know that’s the last time I have to think about it after shipping to Sympli. Sympli also helps limit human error eliminating QA bombarding me when a hex value is off by a letter or number.

Reduced manual documentation has been a lifesaver.

Q. What design and development platforms do you use?

A. We use Sketch for design and Android Studio/Xcode for development.

Q. How is the design and development team set up?

A. Design teams are usually led by the product designer and supported by additional designers who work on multiple projects simultaneously. We have two development teams per platform with a single Dev leader.

Q. What does your overall workflow look like?

A. Our workflow follows a four-step design process: discover > define > design/implement > evolve, which upholds the design thinking methodology. We usually start with a lot of research using offline medium (paper/whiteboard) before narrowing down a trajectory for the journey we’re about to undertake. Once we have finished most of the pre-work, we’ll design a quick prototype to test out internally and externally. The scale of the project will determine the fidelity of the prototype. Once we complete the prototype, we’ll incorporate final visual design along with development before testing it. And then we’ll continue to evolve and develop the design in the next iteration based on feedback.

Q. How have you integrated Sympli into your current workflow?

A. I’ve introduced Sympli after a deep dive into different spec tools. It works hand-in-hand with Invision which introduces the flow into prototype, while Sympli acts as a source of truth to pass along the most accurate and latest design to the developers (and QA — recently requested a style sheet as source of truth while testing) for implementation in our design/implement stage. Sympli is a mechanism to ensure consistency by providing developers with the most accurate and latest designs during the implementation stage. It also helps because it hosts comments, feedback, and notes in context within the design. It’s critical to our process to understand context clearly, especially when a lot of our teams are remotely spread across the world. The plugins also enable us to work efficiently within our own environment, be it in Sketch, Xcode, or Android Studio.

Visa’s office in Singapore

Q. How has Sympli helped?

A. It provides a single portal to retrieve the most accurate, up-to-date version of the design, which minimizes the possibility of inconsistencies. Sympli has also eliminated a lot of the burden involved in passing the design over to developers. With less time specing, there’s more time to spend on creative problem-solving with the support of Sympli spec automation vs manual spec documentation).

Hours previously spent manually documenting specs are now opening up time for designers to spend time on what they do best, design. Also, it is opening the door to explore new tools to further enhance our work flow.

Learn more about Sympli and give our Free Plan a shot! Don’t hesitate to contact us with any questions, feedback or feature requests you might have — help us build a better tool for you. Also, find us on Twitter, Facebook, and LinkedIn for feature updates!

Originally published at sympli.io on October 4, 2016.