Florapedia

Florapedia is an app created for people who spend time in nature appreciating local plants and flowers. These people want to learn more about the plants and keep track of where they were found as well as their photos of each plant.

ROLE

DURATION

Product Designer

10 weeks

PROBLEM

Learning about local flora is difficult.

There is not an easy way to learn about local plants. A person can purchase or borrow a book about flowers, but it is unlikely that they will bring that book with them. They are able to look online, but often they won't have service or an easy way to remember what they have learned. Both of these ways are cumbersome and there is little motivation to increase flora knowledge due to these barriers.

SOLUTION

An app that can work offline and incentivizes collecting flora.

The introduction of the Florapedia app solves this problem. It is user friendly and makes finding and collecting plant varieties fun. The app uses your location to provide a map as well as local flowers for you to find in the database. When you come across a new flower, you can capture a photo of it and Florapedia will automatically identify it for you. You are then able to add photos and a location marking where you found it. You are later able to look at your map and see all of the flora you have found or you can look at your collection and add more locations or more photos.

Another element that makes Florapedia fun is that you can follow your friends and family. You can see all of the plants they have found as well as your and their achievements, which become unlocked as you find more plants. Florapedia also supports light and dark modes.

RESEARCH

Competitive Analysis

To start, I wondered if a solution like this already existed on the market. I researched looking for a variety of different apps to include plant apps in general, database apps, and more. PictureThis was the top app that I found and boasts a huge range of features to help users learn more about how to take care of their plants. iPhones also have a built in system that allow you to learn the name of a plant if the camera can recognize it, which is very cool but is a somewhat hidden feature and does not allow you to save this information in a dedicated space.

User Personas

It was important to me to ensure that this app was accessible to a diverse group of users. To help acheive this, I created two very different personas that I envisioned could benefit from using the app. Ian is an older gentleman who enjoys hiking, wants to learn more about flowers, but struggles with technology. Dani is a young woman who enjoys trail running, wants to be more connected to the local flora, but has limited time.

User journey map

The next step I took was to create a user journey map for my personas. I walked through every action they would have to take, as well as the tasks they would have to go through for each of those actions. I then noted down the feelings that the user might have and any opportunities for improvements. After going through this process, I realized that a user may want to tie several photos of the same flower to that flower's page. I also realized that a powerful way to incentive users to keep using the app and collect more flowers, is to show how the other plants in the local area that the user might be able to find through their database page.

Features & Benefits

After creating the user journeys, I spent time brainstorming as many ideas as I could for potential features I could include. Once I had a lot of different ideas, I went through them all and matched them to the persona that could benefit from those features. If a feature didn't match a persona or fill a need, I set it aside.

Value Proposition and Goal Statement

Value proposition:
This app will allow users to identify local flora. It will allow them to mark which ones they have identified and which ones are still out there for them to find. It will also allow them to keep track of where they found them and add personal photos.

Goal statement:
The flora identification app will affect people who are out on local trails and want to learn about their local flora. It will allow them to learn the names and information about each plant they find and capture via the app and it will allow them to save each one with it’s location and photos so that they can keep track of all of the plants they are seeing and learning about. It will also show them which plants they haven’t found so they can be excited and motivated to find and learn about more plants.

DESIGN

Wireframing

I created wireframes that reflected the user journey that I had created, and then also added a profile page. I envisioned the plant collection page as the home page where the user would spend most of their time. From there, they would capture plants and see more information about that plant.

Other pages in the app would include the database where other plants waiting to be found could be seen, a map of all the plants the user has found and their locations, and a profile page where they could add friends and see their achievements.

FEEDBACK

Refinement

After doing real user research with my wireframes, I learned that navigating to each of the different pages via the collapsed menu was time consuming and confusing. Users reported feeling stuck on pages, and did not intuitively think to click the hamburger menu to navigate through the app. They also reported feeling confused about the differences between the plant collection page and the plant database page.

I addressed these concerns in my mock-ups by adding a bottom navigation bar where users could easily toggle between all available pages. I also created banners for each plant in the database to indicate whether a plant has been found or not, so the user can clearly see that these are all of the plants they can find, not just the ones in their current collection.

DESIGN

Accessibility

After testing our left navigation and current branding guidelines, I realized that we are failing accessibility standards set by the WCAG. I tested several updated variations of our branding and created a presentation for the CEO showcasing my recommendations. With all of our stakeholders approval, we moved forward with our updated branding as displayed in the new designs.

DESIGN

Dark Mode

After starting with a light mode version of Florapedia, I created a dark mode version. Dark mode can be great for low light situations or if users have light sensitivity. Light mode is still important to have for those with limited vision or in high light situations such as if a user is using the app on a very sunny trail and has difficulty seeing the screen with the sunlight reflecting off of it. Both of these modes can also just be nice to have for a user's preference and can easily be toggled from the setting's page from the user's profile.

TAKEAWAYS

Learnings

This was the first mobile app that I created and I really enjoyed the complexity of learning to work within a limited amount of space. When I first started, I went through a pendulum of making everything way too big, and then way too small for the screen sizes. After a lot of trial and error and using the prototype settings on Figma, as well as studying other apps that I regularly use on my phone, I believe I finally found the sweet spot.

I also quickly realized how many more features you can include on mobile apps that are not generally available on web apps. I wanted to challenge myself by including a lot of these, such as using maps and capturing photos. I had a lot of fun incorporating these into the app, but may have honestly chosen to include too many for what was meant to be a small project. There is a lot of room for refinement for these features, such as including photos you have already taken in the past from your camera gallery, and not only being able to add new photos to a plant. I would have had a more refined final product if I had just dedicated more time to a few features instead.

Next Steps

After continuing to go through user testing, I learned that it is not clear what plants are in your database and how that can relate to your location. To address this, I would add information about your current location in the settings page as well as a dropdown to choose the distance from that location you would want the database to include. I would also include an ability to change your location or see other locations to learn more about what is in other areas.

I would also include a setting for the light mode or dark mode to automatically switch based on your system settings.

Let's connect

Get in touch to work together or learn more.