Design teardown: building an office lunch app

At FFW, a global digital agency headquartered in Copenhagen, a catering company delivers us lunch every day. On Mondays, we get the menu for the week—it changes daily—but it’s a clunky PDF that’s a pain to view on a phone.

Our Global Creative Director had the idea to make an app that just tells us what’s for lunch every day. I loved the simplicity of the idea, and as a designer who’s self-taught in coding iOS apps, I thought it’d be fun to create an app from scratch—especially because it’d be something our whole team would use and love.

Though it was a side project, I took it as seriously as I would any client work. Here’s a look at my process and what I learned from this project.

“I wanted to create an app that would not only tell people what’s for lunch, but facilitate an atmosphere of fun by getting everyone talking about food.”

Meet Lunchie

I wanted to create an app that would not only tell people what’s for lunch, but facilitate an atmosphere of fun by getting everyone talking about food, what dishes they look forward to, their favorite foods, and so on. The app could be a great thing for company culture.

With the idea in hand, I started sketching. Putting your thoughts on paper helps shape your idea, make decisions, test out what feels right (or wrong), and brainstorm navigation structures.

Sketching helps your team understand your vision for the product. It’s also a starting point for feature discussions.

We initially designed the app to feel like flipping through a restaurant menu, but it wound up confusing our coworkers because it resembled a page control that’s most commonly used for onboarding.

We used InVision to quickly mock up a prototype and get a feel for the product experience. Though it was a really simple mockup, it brought the product to life.

At this point, I felt like I was onto something—so I dove into Xcode and got coding. Thankfully, our in-house developer helped me out when Xcode threw compiler errors at me. Building the app would have taken twice as long without him.

In terms of distribution, we couldn’t release Lunchie via the App Store, since the app was only intended for our office. Instead, we used an enterprise distribution and simply sent out a link for people to download the app directly from our server.

Lessons

By building Lunchie, I learned so much about UX, the design process, and creating a great product. Such as:

1. Carrying out an idea is scary

In your head, your great idea is this awesome thing that’ll be the next big thing and make tons of people happy.

But once you start designing, you start judging your idea for what it is and what it isn’t. You might even figure out it’s not going to work. That’s also okay—at the very least, it means you’ve learned something.

2. Don’t try to do everything yourself

Having basic coding knowledge has given me a valuable understanding of the inner workings of websites and apps. Constantly having to switch between the high-level concept and UX and the minute details of code is tough, and it occasionally made me lose sight of our overall vision.

You need at least 1 other person to provide feedback and help you reflect on your product decisions. You’ll wind up with a much better product.

3. Nothing beats observing people using your product

You learn so much by watching people interact with your product. Chances are some things are different than what you intended them to be. Maybe people love a feature that almost didn’t make it. Maybe they aren’t interested in the product at all, or maybe they can’t figure out the navigation. The only way to know these things is by watching real people use your product.

4. Providing value to others feels amazing

Observing how design can change—or at least improve people’s lives—is powerful. Watching how you’ve made someone’s day just a little bit easier feels so good and makes those long hours spent in the office worth it.

5. Nothing is more important than clear navigation

If people can’t navigate the app or find the content they’re looking for, they’re going to leave and never return.

6. People are busy and will occasionally forget about your product

We’re all busy and tend to forget things—services, apps, where we put our keys. Your users need to be reminded about your product. With Lunchie, we implemented push notifications to remind people about lunch (and the app’s existence). In this first version of the app, the notification was a heads up that lunch was 15 minutes away. Eventually, we want to do things like install iBeacons in the cafeteria to determine who’s still at their desks, and then send those folks a second reminder that lunch is ready. We might even push out notifications on Friday afternoons to remind people to take home leftovers.

7. Listen to your users

The people using your app will naturally come up with clever, smart ways of using your product or features that would make it better. Listen to them.

8. Make sure your product can stand the trial of everyday use

Using your product for a long period of time reveals different insights than just testing your product while building it. If possible, try to use your product from the moment you start creating it until way after it’s shipped. The insights and problems you’ll discover through everyday use will improve your design skills.

9. Your product needs to be maintained

Products need to be maintained. If it’s an app, eventually you’re going to have to upgrade it to a newer OS. Or, your app might feed off some sort of information that needs to be maintained by someone in a database somewhere.
Plan for maintaining your product. To be honest, I didn’t think about the fact that someone needs to update Lunchie on a weekly basis with the newest menu.

10. Your product is never finished

There’s no such thing as a finished product—contexts and circumstances evolve. Things and people change. Your product is a living organism that exists because it solves an issue. If issues or needs change, your product needs to change too.

Why designers should learn to code

Designers, I encourage you to pick up coding, even if it’s just basic HTML. It’s amazing what beautiful visual things you can create by typing rather than clicking. You’ll get a better understanding of what happens beneath your visuals so you know what’s feasible and what isn’t. The engineering team will love you.

Get a side project

Have a side project to turn to whenever you’ve got some downtime. You’ll replenish your creativity, recharge, and have a lot of fun. And your client work will improve as a result.