The Design Behind Our Mobile App

resources-blog-130510

The Mobile Challenge

We’ve added a number of new features in the past few months that have made our software more powerful and easy to use. So, we knew we needed to create a mobile companion app that would be as useful and simple for our customers, for when they aren’t in front of the computer.

We set an aggresive timeline and goal because, at Yext we love nothing more than challenges.

Customer Feedback

blog pic 1

We started with design-research by speaking with our customers to learn about the things that matter to them, often face-to-face via video.

What are their current behaviors? How do they publish their location information today? What tools do they use? How do they perceive and use Yext?

We learned that our customers are incredibly mobile – they are on the go and they use mobile technology. They take pride in their work and are looking for ways to share their business stories with their customers. A business, just like our personal lives, has high and low moments. Interestingly, what’s actually shared on social networks includes only the highs.

It became clear to us that expanding Yext’s mobile app capabilities to capture those moments of success and share them on social networks would address our clients’ needs. That combined with our PowerListings Network of nearly 50 publishers offers a unique solution.

Business and Pleasure

Great apps are not only about function though. The actual design was inspired by Maslow’s pyramid of needs, from Designing for Emotion by Aarron Walter (a great read on its own), who explains that today’s software needs to be more than just functional, reliable and usable. It also needs to be pleasurable.

Yes, at Yext, we believe that business should be mixed with pleasure. Our customers are not just “users”. They are people.

pyramid

Design for Emotion – In this adaptation of Maslow’s pyramid of needs, the top part of the pyramid that many applications are missing, however it’s what contributes a great deal to customer engagement.

Concealing Complexity

We also know that our business owners are—not surprisingly—very busy people. So any app we design needs to be very straightforward and simple. Just a tap and you’re done. But that “tap” needs to be powerful.

The GM and CEO of Vine, Dom Hofmann, put it well at the latest NYC Mobile Apps Meetup. He said, “great apps need not avoid complexity, they need to conceal it.”

pic 3

With this in mind, we got our hands dirty. Collaboration is key at Yext, and the team participated in a “Design Studio”. For a couple of hours, we all left our computers and performed rapid visual brainstorming in our Fun Room. We had a great group of people from different departments of the company all working together: visual and UX design, marketing, customer support, developers, QA, and product.

After 190 sketches, we reached a rough consensus of the main information architecture and screens. Designers and developers continued to collaborate as the team iterated the design and the actual code. We used the whiteboard extensively as the place to discuss and wireframe any user-facing element of the app. And at the end of this process, we had a fully functional and designed app, but it didn’t seem quite finished…

Adding Fun

There was one small yet important detail missing: fun. We wanted to add a discovery element to our app, one that would be appealing and engaging, but wouldn’t hide or interfere with functionality.

In the first set of wireframes, we had a standard iOS button on the screen with a plus sign inside. It was a placeholder annotated “Sexy Plus Button”. That button would open a menu to select the type of information they wanted to share: a photo, a thought, a Featured Message, and more. We wanted to make this interaction delightful and fun, but also clear. If business owners aren’t sure how to use our app, they might close it and never open it again.

The main action button as it looked in one of the initial low fidelity wireframes.

The main action button as it looked in one of the initial low fidelity wireframes.

So we used Keynote to prototype some of the possible animations, along with our trusty whiteboard. Eventually, we found an animated design that worked. It’s simple, elegant yet cool, sexy and fun.

Evolution of screens from whiteboard prototyping to a full, polished Yext App.

evolution

We are very excited about the launch of the new Yext app and are looking forward to roll out more exciting new features. Click here to download and stay tuned for more!

See first-hand how the Yext Knowledge Engine can help you better manage your digital knowledge and attract more customers.

Schedule a demo