Foli

Using AR to buy plants.

Project

Concept App

Timeline

80 Hours

Role

UX/UI Designer, UX Research, Branding

The scenario is that the Stakeholder has a large catalog of plant products across many retail stores. They want to create an app that allows customers to shop through this catalog using augmented reality so that they can best pick out plants for their home or garden.

Competitor Analysis

No app seems to currently do specifically what the stakeholder wants, so I looked at two types of competitors. Those using plants with AR, and online plant catalogs that allow purchases.

The key strength across all apps was the clarity of information and intuitive functionality.

1-on-1 Interview feedback

After several interviews with plant buyers I recruited, it was clear that customers just want a convenient buying process with clear information so that the upkeep of caring for their new plant is as easy as possible. Beyond that, there were a few commonalities in the responses:

  • Low maintenance plants

  • Plants with certain sunlight needs

  • Recommendations

  • Plant information

User Persona

I used the research above to create a user persona that had all of the key traits that my interview participants shared with me.

Journey Map

I then elaborated on this information with a journey map to better understand the ideal flow of the user.

Information Architecture

Using my research, I then began organizing the key features I would need in this app. I used my journey map specifically to understand the best structure of the app.

App Map

Sketches

Wireframes

Visual Design

I got pretty far with my wireframes, but wanted to turn my attention to the branding and the visual design. I used my research to come up with keywords to influence my branding and visual choices.

Keywords: Adaptable, Calm, Cheerful, Modern, Green, Dynamic, Efficient, Helpful, Sunny, Peaceful, Pleasant

Colors

Screen Shot 2021-03-14 at 8.44 2.png
Screen Shot 2021-03-14 at 8.35 2.png
Screen Shot 2021-03-14 at 8.37 2.png
Screen Shot 2021-03-14 at 8.45 2.png
Screen Shot 2021-03-14 at 8.40 2.png
Screen Shot 2021-03-14 at 8.42 2.png
Screen Shot 2021-03-14 at 8.39 2.png

Brand Name Ideas

Sereen, Greeny, Grennar, Greener, Plnt, PlantAR, Foli, Plntr, Plant Match, Plant Pick, Pottar

Final Choice: Foli

UI Design

The UI design essentially combined my style tile and the wireframes with small adjustments to stay true to my research. My users want an app thats very clean and easy to navigate. I built out 22 screens and made minor style adjustments as I went along. Below is a selection of those different screens.

Prototype Testing Feedback

I conducted usability testing with 4 plant owners (and prospective customers) and organized their feedback into an Affinity Map. Overall the feedback was positive regarding the UI’s design, but there were some issues with the AR interface. The main changes needed were essentially making that feature much more intuitive.

affinity map2.png

Changes based on feedback

I went back to redesign the AR screens, and I also made more of them to clarify how it would function. I started with having the user setup the camera so that they would have a basic understanding of how the feature worked, and then I added more labels and buttons to increase the functionality.

Reflection & Next Steps

Foli’s design has been successful in making users feel that they would be better equipped to pick out the right plant for their home or garden. This app is now ready for stakeholder review and then development.

Designing this app showed me that there are still opportunities to create apps with new things to offer customers. I also found that the design process was mainly a search for the simplest solution. All the revisions I would make to the design and functionality centered around making things easier to use and easier to read. In the future, I will try to save myself some time and start as simple as possible.