Lunch time a struggle? Here’s how to nourish a healthy yuppie.

Alice Petrova
theuxblog.com
7 min readFeb 22, 2017

--

This case study follows my UXD process in a group project at RED Academy.
The goal was to entice people to shop more at their local Market.
By any means possible.

Opportunity

With the task of promoting local shopping through one of the few large Markets in Toronto, we chose St.Lawrence Market. It’s far enough from the core to be considered the “nice part of town” and for that same reason, has not been obliterated by drunken Varsity boys. Yet.

St.Lawrence is fantastic. It’s filled with vendors who have been in the business for generations. They sell everything from farm fresh produce to Pashmina scarves, to jewellery. The Market attracts grocery shoppers looking for hand-picked items, tourists exploring Toronto in the summer, and culinary students from a nearby College. What newbies or residents don’t know alike-is that during lunch time, the Market transforms.

Planning

The project started out strong. I had three extroverts working with me, we all got along swimmingly and collectively projected ideas like a tennis ball machine. It was pretty clear to us that if you can’t bring the people to the Market — you bring the Market to the people. Three days into it, we had built a same-day grocery delivery service that was going to collaborate with Uber. With a team this vibrant, we have thought of everything, down to the details of how much the drivers were to be paid. UBER does StLawrence

Then came our Design Eval. We met with our lead instructor and about 20 seconds into our brilliant pitch, I actually watched him enter REM. Long story short:

  • Uber will never do this
  • Where is the research to back this up?
  • Do you have any other ideas?

Research

Halfway to the deadline, we started our research from scratch. Conducting many in-person and online interviews, the real picture was slowly coming to life. By going to the Market we found out that a lot of the food vendors rely on returning customers and cater their service accordingly. At this point I was asking friends about what brings them back to St. Lawrence. Toronto is not that difficult to navigate, but it was starting to look like distance and price both played a part in the return of clients. What’s interesting is that foodies willing to spend more for quality didn’t really feel like commuting to St.Lawrence, and people who lived and worked in the surrounding area didn’t really care for it. But why?
At this point my team decided to visit the Market during our lunch hour, and that was perhaps the best decision to make. They found out that during lunch hours the Market is unrecognizable. Displays are full of freshly made meals, the building is full of people — It was a completely different place from what we have visited the first time. From this, an idea to focus on promoting the lunch specials came to.

Actual planning

At this stage of UX, my gears finally started shifting. Focusing on a Young Urban Professional as our persona, I thought of many ways to connect the data my team mates found to something relatable. The thought of someone NOT knowing to go to this Market for food was very foreign to me. St.Lawrence makes the best Russian salad made by non-Russians, that I can eat. I wanted to share that with the world. I started thinking of why people that are so close to such a variety of food simply don’t know any better. Another series of surveys and analytics showed that people working in the area simply don’t have the time to go explore the options on their breaks. And I get it: nobody wants to do urban exploration when they’re on a time limit and it is very cold outside. Time = Money and Young Professionals are impatient.

Our main User was a Young Professional who works in the Old Toronto area by the Market but only gets a limited amount of time for her lunch. She makes good money and as a result of that, doesn’t mind to spend a little more on artisanal or home-made foods. For her, quality is everything. I got the idea to make our website purely consist of photos - to make mouths water. When it comes to enticing visual displays — Netflix is king, so we looked at what worked for Netflix and why. Our MVP was to be the lunch menu that brings neighbourhood Yuppies in for healthy foods. We wanted to focus on the people who are already in the vicinity of the Market and already know about it. The goal was to create an exclusive experience for returning users to make them share the experience.

Prototypes + Testing

When the time came to our prototype, usability was at the core of our process. It was becoming harder to differentiate between aesthetics and necessary features. The original concept contained a landing page that was a full screen photo with a step to enter the site, About page, a Menu page and a Directory. I was handed a wireframe to make the first prototype.

First prototype: Market Directory page attempt.

Basically, all three pages were designed to give the user a solid flashback to Windows .98 in all of it’s glory. In my past projects, the most valuable feedback was always given through testing, so I just wanted to get something out in the world to mess around with. At this point during tests, we found out that people don’t care for About pages anymore and they certainly don’t care for long lists of names and numbers.

Because our users didn’t want to click around to find the hours of Lunch on our site, I pushed to have them clearly visible on the banner. Together, we rearranged several features on the website and started gearing towards SPA format. The three tabs became one hamburger with Categories, a Search bar was added for returning users and overall, we just embraced the carousel.

My fourth mid-fidelity prototype

Through our testing it turned out that the easiest way to piss off your users is to make them click one extra time to Enter, so the home page became the landing page, and the Enter button was scrapped.

Design

For the high-fidelity prototype I decided to go with a darker UI: yes, because Netflix for Food was the motto. But also because the site relied so heavily on the quality of visuals. In my final design decision, I put the Chef’s Picks category float on it’s own to garner more attention straight away. This would also add a little more spunk to the many carousels to follow. This moved the necessities up to the top nav bar, where the eye first falls on the page.

Futura proved to be the best standing font for this site. It automatically made the titles pop. This also triggered the notion of reintroducing a new logo just as type. Futura just made the words look good standing on their own. For the accent colour I went with a warm colour of the kitchen — something that reminded me of a cutting board and making home cooked meals. You can even see the imagery recurring in the photos.

If you made it this far — try out my final prototype by following this link:

What I learned

The biggest lesson I took away from this, was the importance of research over assumptions. I wanted to marry Uber with my Project, but I learned the the hard way that if you love something you gotta let it go. Another huge one for me, was learning how to refocus an idea in a VERY short amount of time and change directions. I was lucky to work in a team that built each other up even through the panic and collect themselves to bounce back.

NEXT!

--

--

Alice Petrova
theuxblog.com

UX Designer situated in Toronto, inspired by everywhere else.