SeekWeed is a modern flutter iPhone and Android app that highlights brands, local deals, and nearby stores for the cannabis industry.
Over a two week time period, I was tasked with creating a more elevated design that better fit design and UX best practices, for this newly launched mobile app.
Myself, Front-End Engineer, Back-End Engineer, Product Manager
Experience Designer who focused on the overall aesthetics and experience of the MVP app screen designs
I wanted to understand how other cannabis centered apps helped their users find the products they were looking for. To do this I looked at the apps Leafly and Weedmaps. Below you can see both the homepages and product pages for both these apps.
Leafly Product Page
Weedmap product page
What was interesting to call out was the fact that both competitors prioritized featuring certain brands or products and also provided a mix of their different services on their homepages.
Defining the scope
Once I had a better understanding of the current market and who we were up against, I worked with the team to define an appropriate scope for the MVP build out of the SeekWeed app.
Specifically, I worked on the Information Architecture of the app by building out a consolidated sitemap, which can be seen below.
My main focus for mapping this out was to determine the number of pages that would need to be designed for the MVP and to also see which pages would have a similar design structure.
what was solved for
Based on discussions with the team and this revised sitemap, it was decided that for the MVP build I would design 13 screens, the navigation and style of modals. Through these screens the goal of the app is as follows.
How might we help users locate their favorite cannabis brands and products from nearby stores?
how we started, and where we are now
As mentioned, before I joined the team, the SeekWeed app buildout had begun. Although I wanted to try and keep some of the original structure, I also wanted to make sure the new app followed best practices and provided a great experience for all users. That is why I focused my efforts on creating components that could be reused for several aspects of the product and also on accessibility.
Since the MVP roll out focused on 13 screens I am not going to show every single one here. Instead, I am going to focus on the onboarding screens and all the different homepages; Seek page, Stores Homepage, Deals Homepage, Products Homepage, Brand Homepage.
The main focus of the redesign of this section of the app was to bring in more of the company branding, while also providing users with a clearer understanding of what they should expect once they are a registered user of the platform.
I also wanted to make it more clear that they had reached the end of the onboarding flow by adding in the addition of the CTA that read "complete."
Originally the Homepage was focused on highlighting the nearby stores that delivered. However, based on the research I conducted I noticed that users would be happier with a page that more so resembled that of a "Discover" page instead. This way, at a quick glance they would have access to all sections of the app.
That is why on the new Seek page to the right, a user now has access to featured brands, their favorites, and nearby stores with a map.
New homepage (SEEk Page)
original Stores Homepage
New Stores Homepage
For this set of screens I wanted to keep the bone structure that had previously been created. I thought the card style was a great user experience, however I wanted to create a more modern feel by rounding the corners.
Additionally, as a way to help a user more quickly find exactly what they are looking for I created a filter feature. This way when clicked, it would provide them a model system that would better show the products or brands that they want to see.
original Deals Homepage
New Deals Homepage
The main changes I made to this screen was the order in which the information was grouped. Rather than create the different sections for the various deals, I decided to highlight the promoted ones first (green cards) and allow for users to filter using the native filter system for their more specific needs.
As well as now a user can access more information about each deal but clicking on it and activating a modal.
original products Homepage
New products Homepage
This section involved changes to the information architecture of the site. Originally, both products and brands were combined, but for the new design I decided to split the two categories for easier access for users. On a similar note, I provided the category buttons up top (the same as the homepage) and the filter button as a way for users to quickly refine their search.
original Brands Homepage
New brands Homepage
Similarly to the product homepage updates, my goal for this screen was to help users find their favorite brands easily. Once again, I did this through the category and filter buttons.
As mentioned at the beginning of this section, for sake of length I only highlighted the main homepages of the app. If you are curious to see the other screens feel free to check out the live app either on the Google Play Store or the App Store.
Although I was unable to create a full blown design system for this project due to the tight time constraints, I was able to use that mentality when creating my modules. I thought a lot about how I could create pieces that could be used over and over again, both in that simple format and also in ways to create other components. Not only did this help me design more pages within the timeline, but it was also beneficial to the Engineers as they built out the MVP.