by Cass Koller and Erik Hartley
The scope of this app was discovered after a conversation with developer, Erik Hartley. He wanted to get the visual components of his project polished so he could launch this app in the App Store.
Farmét (name discovered later on) is a visual re-design and branding concept for a Farmers Market/Recipe iOS app. When getting a look at what was already built, I found that this app was a searchable recipe portal, a farmers market finder, and a personal recipe builder.
The goal of this project was to create a platform which:
I started my research after viewing the pre-designed screens. It was important to see what was already out there, and what features weren’t on the market. Comparing what apps were already on the market helped me figure out the design elements I wanted to create for the redesign.
When comparing other apps I really liked the concept of a seasonal produce list. This allowed farmers market goers the ability to see what was in season, and what was not yet. Through this research I also found that other apps did not have direct inspiration to what was featured at the farmers market — this would be something that would give the app more something fresh and new. There were a few apps that had lists of nearby farmers markets but why have to look into multiple apps to find directions, produce lists, and recipes?
The initial task was to make the pre-designed app more user friendly and visually pleasing. As easy as it would be to focus on the look of the project I didn’t want this app to be live in the App Store without a main focus or user flow. Erik was supportive along this process, and shared a similar understanding of the user goals for this project.
Screen Changes
Speaking with Erik, I found out the functionality of the Add Recipe was for users to add in their own recipes to store within the app. Looking at the scope of the project this feature didn’t seem to fit in with the other screens of the app. I took the pre-designed app and did a little guerrilla testing for the functionality.
During testing, I asked users to browse the different screens and wanted to gain feedback. Through my test, I validated that users didn’t find the Add Recipe feature to be as exciting or engaging as being able to see featured recipes, details of the markets, and a map which you can find whats nearby or in your favorite city. The decision after hearing back from users was to remove this feature from the design.
The Search for Recipes page needed to be more functional and welcoming. Before the redesign, it was just a lined screen with search functionality. To the user, this wouldn’t be a huge difference from a search engine. How could those that weren’t as creative with their meal planning become inspired to cook something that they found while shopping at the market? Categorizing came to mind but focused on Farmers Market produce and seasons (see sketches below).
When showing this categorized recipe sketch with Erik he told me there was an issue with the API he was using — there was no capability to sort. Not one to give up easy I looked into other API’s that had the functionality for building a more user-centric app. The API’s I found were all fee-based which was not an initial goal (see more details in Learning Moments section), so I had to think of another way to make this app engaging for those wanting to see recipes related to the market.
I continued researching, sketching out lo-fi wireframes, and talked with anyone I could about the capabilities of what this app could be, and what features people would want to use. This led to an iteration of the project goals.
These three main functions were the new and final focus of the app. When testing with users, I found this was simple, and the navigation made sense. After browsing around the features one user said “I would definitely use this. I want to be able to see what is fresh currently and what will be fresh in upcoming seasons.” The homepage would feature the current seasons produce list along with a seasonal recipe to inspire farmers market searching and cooking.
As this was a redesign, a good portion of my time was spent looking at food imagery — trying not to be hungry the whole time was challenging! In addition to looking at competitors on the market, I also looked into color pallets that would be vibrant enough but also represent something earthy. The images below were done by a Google search of my favorite restaurants featuring whole, healthy foods. Their meals are vibrant, fresh, and visually pleasing. From this imagery, I started thinking about colors I would want to feature and the logo.
There was minimal direction with branding before the redesign- it was a menu icon with a fork and spoon. Having a menu as the app icon no longer made sense- it had to be something more related to the market experience. As there was a shift in functionality, the concept went from recipe categorizing to highlighting location and seasonal produce. Liking the pink and green combination from the color inspiration (above) I thought about produce featuring both of those colors- beets came to mind. The design was simple, using vector circles, ovals, and lines. It fit well within the location icon for a more customized element.
The name took a few days of jotting down ideas in the notebook. Farmét came to mind thinking of gourmet and farm merged. Before I started the design the idea of the name was “Farm to Able,” but the app shifted into more of a farmers market locator and about a seasonal experience.
When the screens were completed, we downloaded Zeplin so Erik could get the specifications of the design.
Here are some screens from the finished prototype:
...and the Prototype video:
Having the ability to partner so closely with a developer is something I am grateful for. I hope to continue to learn what a developer needs, the language they speak, and what is (and is not) capable.
Initially, the app was to be a searchable recipe portal, a farmers market finder, and personal recipe builder. Looking through the user experience lens, I found that all of these together weren’t going to engage a user. There are multiple ways to perform each function. Figuring out how to integrate the farmers market element with recipes was, and still is an exciting featuring that both design and code solved.
There were limitations to API capabilities on a student budget and a free app. I went into the developer seat trying to see if we could really make this work for a user (categorizing seasonal produce, finding recipes, and finding local markets which had the necessary ingredients). Searching for API’s didn’t seem difficult at first but sitting in meetings with Erik lead to a further understanding of what was needed- many of these programming interfaces weren’t free or capable of a more personalized integration. Customizable options were $99/month which didn’t make sense in a free download app.
With price limitations, capabilities of integration, and a lack of updates from local markets it took a lot of conceptualizing to come up with what is now Farmét. Farmét is now a seasonal produce list, local farmers markets with locations, and a featured seasonal recipe from various websites to inspire people picking up the ingredients while at their farmers market.
Was it frustrating we couldn’t build the dream Farmers Market app… YES! But it did not feel limiting since it gave me the patience to understand what could, and could not happen. It validated the need to communicate with dev teams throughout the process — agile for the win!
With more time Erik and I would do the following:
Thank you Erik for your dedication to building this App!
Closing notes, if you are a designer or PM, make sure to high five your developer- they put in a lot of blood, sweat, and tears to make your designs a reality!